광학 확대/축소 및 크기 조정

  • 아티클

이 문서에서는 Windows 확대/축소 및 요소 크기 조정에 대해 설명하고 이러한 상호 작용 메커니즘을 앱에서 사용하기 위한 사용자 환경 지침을 제공합니다.

중요 API: Windows.UI.Input, Input(XAML)

광학 확대/축소를 사용하면 콘텐츠 영역 내의 콘텐츠 보기를 확대할 수 있지만(콘텐츠 영역 자체에서 수행됨) 크기 조정을 사용하면 콘텐츠 영역의 보기를 변경하지 않고도 하나 이상의 개체의 상대 크기를 변경할 수 있습니다(콘텐츠 영역 내의 개체에서 수행됨).

광학 확대/축소 및 크기 조정 상호 작용은 손가락 모으기 및 스트레치 제스처(손가락을 더 멀리 이동하고 확대하여 더 가깝게 이동)를 통해 수행되거나, 마우스 스크롤 휠을 스크롤하는 동안 Ctrl 키를 아래로 누르거나 Ctrl 키를 누른 상태에서(Shift 키를 사용하여, 숫자 키패드를 사용할 수 없는 경우) 더하기(+) 또는 빼기(-) 키를 눌러 수행됩니다.

다음 다이어그램은 크기 조정과 광학 확대/축소의 차이점을 보여줍니다.

광학 확대/축소: 사용자가 영역을 선택한 다음 전체 영역을 확대/축소합니다.

moving the fingers closer together zooms in on the content area and moving them apart zooms out

크기 조정: 사용자가 영역 내의 개체를 선택하고 해당 개체의 크기를 조정합니다.

moving the fingers closer together shrinks an object and moving them apart enlarges it

참고 광학 줌을 시맨틱 줌과 혼동하지 않아야 합니다. 두 상호 작용에 동일한 제스처가 사용되지만 의미 체계 확대/축소는 단일 보기(예: 컴퓨터 폴더 구조, 문서 라이브러리 또는 사진 앨범)로 구성된 콘텐츠의 표시 및 탐색을 나타냅니다.

 

권장 사항 및 금지 사항

다음 지침을 크기 조정 또는 광학 확대/축소를 지원하는 앱에 사용합니다.

  • 최대 및 최소 크기 제약 조건 또는 경계가 정의된 경우 시각적 피드백을 사용하여 사용자가 해당 경계에 도달하거나 초과하는 경우를 보여줍니다.

  • 끌기 지점을 사용하여 조작을 중지하고 콘텐츠의 특정 하위 집합이 뷰포트에 표시되는 논리적 지점을 제공하여 확대/축소 및 크기 조정 동작에 영향을 줍니다. 사용자가 이러한 수준을 더 쉽게 선택할 수 있도록 공통 확대/축소 수준 또는 논리적 보기에 대한 맞춤 지점을 제공합니다. 예를 들어, 사진 앱은 100%의 크기 조정 끌기 지점을 제공하거나, 매핑 앱의 경우 끌기 지점이 도시, 주 및 국가 보기에서 유용할 수 있습니다.

    끌기 지점을 사용하면 사용자가 정확하지 않으며 목표를 달성할 수 있습니다. XAML을 사용하는 경우 ScrollViewer의 끌기 지점 속성을 참조하세요.

    두 유형의 끌기 지점이 있습니다.

    • 근접성 - 접촉이 해제된 후 관성 끌기 지점의 거리 임계값 내에서 중지되는 경우 끌기 지점이 선택됩니다. 근접 끌기 지점은 여전히 끌기 지점 간에 확대/축소 또는 크기 조정을 허용합니다.
    • 필수 - 선택한 끌기 지점은 제스처의 방향과 속도에 따라 접촉이 해제되기 직전에 교차된 마지막 끌기 지점 바로 앞이나 성공 지점입니다. 조작은 필수 끌기 지점에서 끝나야 합니다.

  • 관성 물리학을 사용합니다. 여기에는 다음이 포함됩니다.

    • 감속: 사용자가 꼬집기 또는 스트레칭을 중지할 때 발생합니다. 이것은 미끄러운 표면에서 정지에 슬라이딩과 비슷합니다.
    • 바운스: 크기 제약 조건 또는 경계가 전달될 때 약간의 바운스백 효과가 발생합니다.

  • 대상 지정 지침에 따른 공간 컨트롤.

  • 제한된 크기 조정을 위한 크기 조정 핸들을 제공합니다. 핸들을 지정하지 않은 경우에는 등각 또는 비례 크기 조정이 기본값입니다.

  • 확대/축소를 사용하여 UI를 탐색하거나 앱 내에서 추가 컨트롤을 노출하지 말고 이동 영역을 대신 사용합니다. 이동에 대한 자세한 내용은 이동 지침을 참조하세요.

  • 크기 조정 가능한 콘텐츠 영역 내에 크기 조정 가능한 개체를 배치하지 마세요. 예외는 다음을 포함합니다.

    • 크기 조정 가능한 항목이 크기 조정 가능한 캔버스 또는 아트 보드에 나타날 수 있는 그리기 애플리케이션.
    • 맵과 같은 포함된 개체가 있는 웹 페이지.

    참고 모든 터치 지점이 크기 조정이 가능한 개체 안에 있는 경우가 아니면 항상 콘텐츠 영역의 크기가 조정됩니다.

샘플

보관 샘플