Tab Bars

A tab bar appears at the bottom of an app screen and provides the ability to quickly switch between different sections of an app. Tab bars are translucent, may have a background tint, maintain the same height in all screen orientations, and are hidden when a keyboard is displayed. A tab bar may contain any number of tabs, but the number of visible tabs varies based on the device size and orientation. If some tabs can’t be displayed due to limited horizontal space, the final visible tab becomes a More tab, which reveals the additional tabs in a list on a separate screen.

탭바는 앱 화면의 하단에 나타나고 앱의 다른 섹션들간에 빠르게 전환할 능력을 제공합니다. 탭바는 반투명하고 배경 색조를 가질 수 있으며 모든 화면 방향에서 동일한 높이를 유지하고 키보드가 표시되면 숨겨집니다. 탭바에는 여러 개의 탭이 포함될 수 있지만 표시되는 탭의 수는 장치 크기 및 방향에 따라 다릅니다. 제한된 가로 공간으로 인해 일부 탭을 표시 할 수 없는 경우, 마지막으로 표시되는 탭이 다른 탭의 목록에 있는 추가적인 탭을 드러내는 More 탭이됩니다.

In general, use a tab bar to organize information at the app level. A tab bar is a good way to flatten your information hierarchy and provide access to several peer information categories or modes at once.

일반적으로 앱 수준에서 정보를 구성하려면 탭바를 사용하십시오. 탭바는 정보 계층을 평평하게 하고 한 번에 여러 대등한 정보 카테고리 또는 모드에 접근을 제공할 좋은 방법입니다.

Use a tab bar strictly for navigation. Tab bar buttons should not be used to perform actions. If you need to provide controls that act on elements in the current view, use a toolbar instead. See Toolbars.

탐색을 위해 엄격하게 탭바를 사용하십시오. 액션을 수행하기위해 탭바 버튼이 사용되면 안됩니다. 현재뷰의 요소에 작동하는 컨트롤을 제공해야하는 경우 대신 툴바를 사용하십시오.

Avoid having too many tabs. Each additional tab reduces the tappable area for selecting a tab and increases the complexity of your app, making it harder to locate information. Although a More tab can display extra tabs, this requires additional taps and is a poor use of space. Include essential tabs only, and use the minimum tabs necessary for your information hierarchy. Too few tabs can be a problem too, as it can make your interface appear disconnected. In general, use between three and five tabs on iPhone. A few more are acceptable on iPad.

너무 많은 탭을 피하십시오. 탭을 추가 할 때마다 탭을 선택할 수있는 영역이 줄어들고 앱의 복잡성이 증가하므로 정보를 찾기가 어려워집니다. More 탭이 추가 탭을 표시 할 수 있지만 추가 탭이 필요하고 공간을 잘 활용하지 못합니다. 필수 탭만 포함하고 정보 계층 구조에 필요한 최소 탭을 사용하십시오. 너무 적은 탭도 문제가 될 수 있습니다. 인터페이스가 연결이 끊어진 것처럼 보일 수 있기 때문입니다. 일반적으로 iPhone에서 3개에서 5개의 탭을 사용합니다. 아이패드에서 몇 개만 더 허용될 수 있다.

Don’t remove or disable a tab when its function is unavailable. If tabs are available in some cases but not in others, your app’s interface becomes unstable and unpredictable. Ensure that all tabs are always enabled, and explain why a tab’s content is unavailable. For example, if there are no songs on an iOS device, the My Music tab in the Music app explains how to download songs.

탭 기능을 사용할 수 없는 경우 탭을 제거하거나 비활성화하지 마십시오. 일부 경우에는 탭을 사용할 수 있지만 다른 경우에는 사용할 수 없는 경우 앱의 인터페이스가 불안정 해지고 예측할 수 없게됩니다. 모든 탭이 항상 사용 가능한지 확인하고, 탭의 컨텐츠를 사용할 수 없는 이유를 설명하십시오. 예를 들어 iOS 기기에 노래가 없는 경우 음악 앱의 내 음악 탭에서는 음악을 다운로드하는 방법을 설명합니다.

Always switch contexts in the attached view. To keep your interface predictable, selecting a tab should always affect the view that’s directly attached to the tab bar, not another view elsewhere on screen. For example, selecting a tab on the left side of a split view shouldn’t cause the right side of the split view to suddenly change. Selecting a tab in a popover shouldn’t cause the view behind the popup to change.

항상 부착된 뷰에서 컨텍스트를 전환하십시오. 예측 가능한 인터페이스를 유지하기 위해 선택한 탭은 항상 탭바에 직접적으로 부착된 뷰에만 영향을 미치고 다른 화면의 뷰에는 영향을 미치지 않아야 합니다. 예를 들어 스플릿뷰의 왼쪽에서 탭을 선택해도 스플릿뷰의 오른쪽이 갑자기 변경되지 않아야합니다. 팝오버에서 탭을 선택하면 팝업 뒤의 뷰가 변경되지 않습니다.

Make sure tab bar icons are visually consistent and balanced. The system offers a range of predefined icons for common use cases. See System Icons > Tab Bar Icons. You can also create your own icons. See Custom Icons.

탭바 아이콘이 시각적으로 일관되고 균형 잡혀 있는지 확인하십시오. 시스템은 일반적인 사용 사례를 위해 사전 정의 된 아이콘 범위를 제공합니다.

Use badging to communicate unobtrusively. You can display a badge—a red oval containing white text and either a number or an exclamation point—on a tab to indicate that new information is associated with that view or mode.

눈에 잘 띄지 않게 통신하려면 뱃지를 사용하십시오. 새 정보가 해당 뷰 혹은 모드와 관련되 있음을 나타내기 위해 탭에 뱃지(흰색 텍스트와 숫자 또는 느낌표가 포함된 빨간색 타원형)를 표시할 수 있습니다.

For developer guidance, see UITabBar.

Tip It’s important to understand the difference between a tab bar and a toolbar, because both types of bars appear at the bottom of an app screen. A tab bar lets the user switch quickly between different sections of an app, such as the Alarm, Stopwatch, and Timer tabs in the Clock app. A toolbar contains buttons for performing actions related to the current context, like creating an item, deleting an item, adding an annotation, or taking a photo. See Toolbars. Tab bars and toolbars never appear together in the same view.

탭 막대와 툴바, 두 유형의 바가 앱 화면 하단에 표시되므로 이 둘의 차이점을 이해하는 것이 중요합니다. 탭바를 사용하면 시계 앱의 알람, 스톱워치 및 타이머 탭과 같은 앱의 여러 섹션간에 신속하게 전환 할 수 있습니다. 툴바에는 항목 작성, 항목 삭제, 주석 추가 또는 사진 찍기와 같은 현재 컨텍스트와 관련된 작업을 수행하기 위한 단추가 있습니다. 탭바와 툴바는 같은뷰에 함께 나타나지 않습니다.

Tab Bars - Bars - iOS - Human Interface Guidelines - Apple Developer