Toolbars
툴바
A toolbar appears at the bottom of an app screen and contains buttons for performing actions relevant to the current view or content within it. Toolbars are translucent, may have a background tint, and often hide when people are unlikely to need them. For example, Safari hides the toolbar while people scroll towards the bottom of a page, bringing it back when they scroll towards the top or tap the bottom of the screen. A toolbar also hides when a keyboard is onscreen.
툴바는 앱 화면 아래에 위치하며, 현재 뷰나 콘텐츠에 관련한 액션을 취할 수 있는 버튼을 포함합니다. 툴바는 투명하나 배경색상값을 가질 수 있고, 사용자들이 필요하지 않을 때면 종종 숨겨집니다. 예를 들어, 사파리 앱에서 툴바는 사용자들이 페이지를 아래로 스크롤할 때 사라지고, 위를 향해 스크롤하거나 화면의 아래를 탭하면 다시 보여집니다. 툴바는 키보드가 화면에 띄워져있을 때 사라지기도 합니다.
TIP
It’s important to understand the difference between a toolbar and a tab bar, because both types of bars appear at the bottom of an app screen. A toolbar contains buttons for performing actions related to the current context, such as creating an item, deleting an item, adding an annotation, or taking a photo. A tab bar lets people switch quickly among different sections of an app, such as the Alarm, Stopwatch, and Timer tabs in the Clock app. For guidance, see Tab Bars. Toolbars and tab bars never appear together in the same view.
탭바와 툴바의 차이를 알아두는 것이 좋습니다. 둘 다 앱화면의 아래에 나오기 때문입니다. 툴바는 현재 맥락과 관련된 액션을 수행하기 위한 버튼을 포함합니다. 아이템을 삭제하거나 만들고, 주석을 추가하거나 사진을 찍는 것입니다. 반면 탭바는 앱의 다른 섹션으로 이동할 수 있게 합니다. 시계 앱의 알람/스탑워치/타이머 탭이 그 예입니다. 가이드는 탭바에서 확인하세요. 탭바와 툴바는 절대 같은 화면에서 함께 나오지 않습니다.
Provide relevant toolbar buttons. A toolbar should contain frequently used commands that make sense in the current context.
관련성 있는 툴바 버튼을 제공하세요. 툴바는 지금 맥락과 관련해 자주 사용되는 명령어를 포함해야 합니다.
Consider using text in a toolbar with three or fewer buttons; otherwise, use glyphs. In Calendar for example, the titles “Today,” “Calendars,” and “Inbox” clarify each button’s meaning. If text-titled toolbar buttons make sense in your app, create concise titles and be sure to provide enough space between buttons to prevent them from running together. You can ensure separation by inserting fixed space between the buttons. For developer guidance, see the UIBarButtonSystemItemFixedSpace constant value in UIBarButtonItem.
툴바에 세개 이하의 버튼이 있을 때만 텍스트를 사용하고, 그렇지 않으면 글리프를 사용하세요. 캘린더 앱의 경우, "오늘", "달력", "수신함" 같은 타이틀은 각 버튼의 의미를 잘 설명해줍니다. 만약 버튼이 텍스트로 만들어졌을 때 맥락에 맞게 잘 사용된다 생각한다면, 간결한 텍스트로 만들고 버튼과 버튼 사이에 충분한 공간을 두어 텍스트가 한덩어리로 읽히지 않게 하세요. 고정된 여백값을 버튼 사이에 넣어 분리감을 줄 수 있습니다.
If you create a custom glyph for a toolbar button, use the following sizes, adjusting as needed for balance.
만약 글리프를 직접 만들어 툴바 버튼으로 사용할 거라면, 아래의 사이즈를 따르고 균형을 맞추세요.
| Target sizes | Maximum sizes |
| 24x24 pt (72x72 px @3x) | 28x28 pt (84x84 px @3x) |
| 24x24 pt (48x48 px @2x) | 28x28 pt (56x56 px @2x) |
Avoid using a segmented control in a toolbar. Segmented controls let people switch contexts, whereas a toolbar’s actions are specific to the current screen. If you need to provide a way to switch contexts, consider using a tab bar instead.
툴바에 세그먼트 컨트롤*을 넣지 마세요. 세그먼트 컨트롤은 사용자들이 화면(맥락)을 통채로 바꾸는 역할을 하는 반면, 툴바의 액션은 현재 화면에만 최적화 되어있기 때문입니다. (즉 context를 바꾸면 툴바의 기능도 또 바뀌어야 하니 논리가 맞지 않다.) 만약 맥락을 바꾸는 기능이 필요하다면, 탭바를 대신 사용하세요.
