애플 휴먼 인터페이스 가이드라인(49) Views -9 Split Views

Split Views
스플릿 뷰

A split view manages the presentation of hierarchical content at the top level of your app. A split view consists of a two- or three-column interface showing a primary column, an optional supplementary column, and a secondary pane of content. Changes in the primary column drive changes in the optional supplementary column, which affect the content itself. Split views are useful for navigating multiple levels of content hierarchy, like traversing the mailboxes and messages in Mail to view each message.

 

스플릿 뷰는 앱 내 위계 순서가 있는 콘텐츠를 최상위 레벨부터 보여줍니다. 스플릿 뷰는 두개나 세개의 컬럼(세로단) 으로 구성되어 있는데, 가장 중요한 일차 컬럼, 추가 보조용 컬럼, 그리고 콘텐츠 영역을 보여주는 이차영역으로 구성됩니다. 일차 컬럼에 변동이 생기면 보조 컬럼에도 변화가 생기며, 이는 콘텐츠 자체에도 영향을 미칩니다. 스플릿 뷰는 콘텐츠 위계의 여러 레벨을 탐색하는 데 편리합니다. 메일 앱에서 수신함을 가로질러 각각의 메세지를 볼 때 등 말이죠.

 

Split views can display a variety of content, but many system apps like Mail use a split view to create a sidebar-based interface. In this type of interface, the primary column shows a sidebar, the optional supplementary column shows a list view, and the secondary content pane shows details about the selected content. For related guidance, see Sidebars.

또 스플릿 뷰는 여러 종류의 콘텐츠를 보여줄 수 있는데, 메일과 같은 많은 시스템 앱은 사이드바 기반의 화면을 만들기 위해 스플릿 뷰를 사용합니다. 이런 종류의 화면에선 일차 컬럼이 사이드바를 보여주고, 보조 컬럼은 리스트 뷰를, 그리고 콘텐츠 영역은 선택된 콘텐츠의 세부 내역을 보여줍니다. 관련 가이드는 사이드바에서 확인하세요.

 

On iPad, use a split view instead of a tab bar. Split views provide the same quick navigation as tab bars while making better use of the large display.

iPad에선 스플릿뷰를 탭바 대신 사용하세요. 스플릿 뷰는 탭바처럼 빠른 네비게이션을 제공하는데, 거기에 더해 큰 화면에서 더 잘 사용될 수 있습니다.

 

Choose the appropriate style for each type of column. For the primary column displaying the sidebar, use the sidebar appearance. This appearance is appropriate for app-level navigation and lists of collections, like the mailboxes in Mail. For the supplementary column displaying the list view, use the plain sidebar appearance. This appearance is appropriate for lists of individual pieces of content, like the messages in a mailbox. For developer guidance, see UICollectionLayoutListConfiguration.Appearance.

각각의 컬럼에 적절한 스타일을 고르세요. 사이드바를 보여주는 일차 컬럼엔 사이드바의 외형 스타일을 사용해야합니다. 이 외형은 앱 수준의 네비게이션과 메일 앱의 수신함처럼 콜렉션들의 모음에 사용하기 적절합니다. 리스트 뷰를 보여주는 보조 컬럼엔 꾸밈없는 사이드바 외형을 사용하세요. 이 외형은 메일함의 메세지 하나하나 같이 개별 콘텐츠들의 모음에 사용하기 적절합니다.

 

Persistently highlight the active selection in the primary and supplementary columns. Although the secondary pane's content can change, it should always correspond to clearly identifiable selections in the other columns. This selection helps people understand the relationship between the columns and keep themselves oriented.

일차, 보조 컬럼에서 현재 활성화되어있는 부분을 계속해서 하이라이트하세요. 콘텐츠 영역은 계속 변할 수 있으나, 다른 일차, 보조 컬럼에서 선택된 부분과 명확히 일치해야 합니다. 이는 사용자들이 컬럼과 탐색 출발지점 사이의 관계를 이해하는데 도움을 줍니다.

 

If appropriate, allow people to drag and drop content between columns. Because split views provide access to multiple levels of hierarchy, people can quickly move content from one part of the app to another by dragging and dropping items between the columns. For related guidance, see Drag and Drop.

For developer guidance, see UISplitViewController.

적절하다면 사용자들이 컬럼 간 콘텐츠를 드래그앤 드랍할 수 있게 하세요. 스플릿 뷰를 통해 여러 단계의 위계에 접근할 수 있기 때문에, 사용자들은 아이템을 드래그앤 드랍해 앱의 한 부분에서 다른 부분으로 빨리 이동하고 싶어합니다. 관련 가이드는 드래그앤 드랍에서 확인하세요.