살짝 밀기 애니메이션에 대한 지침

항목 선택에 살짝 밀기 제스처를 구현할 때 살짝 밀기 애니메이션을 사용합니다.

권장 사항 및 금지 사항

  • 사용자가 항목을 선택 상태가 전환될 만큼 충분히 항목을 끌지 않은 상태에서 그냥 떼면 살짝 밀기 선택 애니메이션을 사용하여 선택 상태는 바꾸지 않으면서 항목을 남은 위치로 다시 이동합니다.
  • 살짝 밀기 애니메이션의 방향은 사용자의 살짝 밀기 제스처 방향과 일치해야 합니다.
    • 콘텐츠를 가로로 스크롤할 경우 살짝 밀기 애니메이션은 아래로 이동했다가 다시 위로 이동해야 하므로 살짝 밀기 방향은 세로입니다.
    • 콘텐츠를 세로로 스크롤할 경우 살짝 밀기 애니메이션 시퀀스가 앱의 읽기 순서에 따라 가로로 이동되어야 하므로 살짝 밀기 방향은 가로입니다.
      • 왼쪽에서 오른쪽 읽기 순서를 갖는 앱의 경우 애니메이션은 오른쪽으로 이동한 후 왼쪽으로 이동해야 합니다.
      • 오른쪽에서 왼쪽 읽기 순서를 갖는 앱의 경우 애니메이션은 왼쪽으로 이동한 후 오른쪽으로 이동해야 합니다.
  • 세로로 이동하는 경우 15픽셀, 가로로 이동하는 경우 23픽셀 등 살짝 밀기 애니메이션에 권장되는 거리로 항목을 이동합니다.

관련 항목

디자이너용
추가 및 삭제에 대한 지침
콘텐츠 전환 애니메이션에 대한 지침
끌기 애니메이션에 대한 지침
가장자리 기반 UI 애니메이션에 대한 지침
페이드 애니메이션에 대한 지침
페이지 전환 애니메이션에 대한 지침
포인터 클릭 애니메이션에 대한 지침
위치 변경 애니메이션에 대한 지침
팝업 UI 애니메이션에 대한 지침
개발자용(HTML)
HTML 애니메이션 라이브러리 샘플
UI 애니메이션
살짝 밀기 제스처 애니메이션
WinJS.UI.Animation.swipeReveal function
WinJS.UI.Animation.swipeSelect function
WinJS.UI.Animation.swipeDeselect function
개발자용(XAML)
UI 애니메이션
살짝 밀기 제스처 애니메이션
빠른 시작: 라이브러리 애니메이션을 사용하여 UI에 애니메이션 효과 주기
SwipeHintThemeAnimation class
SwipeBackThemeAnimation class

 

 

표시:
© 2015 Microsoft