본문 바로가기
Human Interface Guidelines/글

HIG 번역) Views - Split Views

by jum0 2020. 4. 21.

Split Views

A split view manages the presentation of two side-by-side panes of content, with persistent content in the primary pane and related information in the secondary pane. Each pane can contain any variety of elements, including navigation bars, toolbars, tab bars, tables, collections, images, maps, and custom views. Split views are often used with filterable content; a list of filter categories appears in the primary pane, and the filtered results for the selected category are shown in the secondary pane. If your app requires it, the primary pane can overlay the secondary pane and can be hidden offscreen when not in use. This is particularly useful when the device is in portrait orientation, as it allows more room for viewing content in the secondary pane. For related guidance, see Auto Layout.

Split view는 primary 창의  변하지 않는 콘텐츠와 secondary 창에서 관련된 정보인, 콘텐츠 두 창을 나란하게 보여주는 방식으로 관리합니다. 각각의 창은 navigation bars, toolbars, tab bars, tables, collections, images, maps 및 custom views 등을 포함하여 어떤 다양한 elements도 포함할 수 있습니다. Split views는 필터링 가능한 콘텐츠와 자주 사용되는데, primary 창에서 필터 카테고리 목록이 나타나고 선택된 카테고리의 필터 된 결과가 secondary 창에서 나타납니다. 앱에서 필요한 경우 primary 창을 secondary 창 위에 덮어 씌울 수 있고, 사용하지 않을 때 화면 밖에 숨길 수 있습니다. 이러한 기능은 secondary 창에서 콘텐츠를 볼 수 있는 공간이 넓어지기 때문에 기기가 세로 방향일 때 특히 유용합니다. Auto Layout과 관련된 가이드는 다음 문서를 참조하세요.

Choose a split-view layout that works well with your content. By default, a split view devotes a third of the screen to the primary pane and two-thirds to the secondary pane. The screen can also be split into halves. Choose an appropriate split based on your content, and make sure the panes don’t look unbalanced. Avoid creating a secondary pane that’s narrower than the primary pane.

콘텐츠와 잘 어울리는 split-view 레이아웃을 선택하세요. 기본적으로, split view는 화면의 1/3을 primary 창에, 2/3를 secondary 창으로 분할합니다. 그 화면들은 또한 반으로 나눠질 수 있습니다. 콘텐츠에 따라 적절한 분할을 선택하고, 창이 불균형하게 보이지 않도록 유의하세요. Secondary 창이 primary 창보다 더 좁아지는 것을 피하세요.

Persistently highlight the active selection in the primary pane. Although the secondary pane’s content can change, it should always correspond to a clearly identifiable selection in the primary pane. This helps people understand the relationship between the panes.

Primary 창에서 선택된 부분을 지속적으로 강조하세요. Secondary 창의 콘텐츠가 변경될 수 있지만, 항상 primary 창에서 명확하게 알아볼 수 있는, 선택된 부분과 일치해야 합니다. 이것은 사용자가 창들 간의 관계를 이해할 수 있도록 돕습니다.

In general, restrict navigation to one side of a split view. Placing navigation in both panes of a split view makes it hard for people to stay oriented and discern the relationship between the two panes.

일반적으로, split view의 한쪽으로의 이동을 제한하세요. Split view의 양 쪽에 navigation을 배치하는 것은 사용자가 방향을 잡고 두 창 사이의 관계를 이해하는 데 어렵게 합니다.

Provide multiple ways to access a hidden primary pane. On layouts where the primary pane may be offscreen, be sure to provide a button—typically in a navigation bar—to reveal the pane. Unless your app uses the swipe gesture to perform other functions, let people swipe from the side of the screen to access the primary pane too.

숨겨진 primary 창에 접근하는 여러 가지 방법을 제공하세요. Primary 창이 화면 밖일 수 있는 레이아웃에서, 창을 드러내기 위해 일반적으로 navigation bar에 버튼을 제공하세요. 또한 앱에서 다른 기능을 수행하기 위해 swipe 제스처를 사용하지 않는다면, 사용자가 화면의 옆부분을 swipe 해서 primary 창에 접근할 수 있도록 하세요.

For developer guidance, see UISplitViewController.

UISplitViewController와 관련된 개발자 가이드는 다음 문서를 참조하세요.


수정해야 할 부분이 있다면 알려주세요!

감사합니다!

반응형

댓글