TabBar 란 무엇인가?
- 화면 하단에 탭 표시줄이 나타나 사람들이 앱이 제공하는 정보 유형이나 기능을 이해할 수 있도록 도움
- 각 섹션 내의 현재 내비게이션 상태를 유지하면서 앱의 최상위 섹션 사이를 빠르게 전환
- 기본적으로 탭 표시줄은 반투명이며, 콘텐츠가 뒤에 나타날 때만 배경 자료를 사용
- 키보드가 화면에 있을 때 탭 표시줄이 숨김
- 사진 앱과 같이 탭바 뒤에 컨텐츠가 있으면 배경색을 보여주고, 하단으로 스크롤 하면 뒤에 비치지 않음
- 장치 크기와 방향에 따라, 보이는 탭의 수는 총 탭 수보다 적을 수도 있다
- 화면에 모든 탭이 표시되지 않는경우, 더보기 탭이 되어 목록에 나머지 항목을 별도의 화면으로 표시
공식 문서 : UITabBar
Tip
TabBar 와 ToolBar는 모두 화면 하단에 나타나지만, 서로 다른 목적을 갖는다 탭 바는 한 화면에서 탭에따라 다른 뷰를 표시해 주지만, ToolBar의 경우 항목 생성, 필터링, 콘텐츠 표시등을 위한 버튼 등이 포함된다 TabBar와 ToolBar는 동시에 표시할 수 없다.
지켜야 할점
- 어떠한 기능을 수행하기 위해 사용하지 말고, 오직 탭을 전환하는 용도로만 사용할것
- View의 요소에 어떠한 기능을 제공해야 하는 경우 Toolbar를 사용할것.
- 적당한 수의 탭을 사용할것, iPhone의 경우 3~5개 , iPad의 경우 조금더 많이 사용할것
⇒ 너무 많거나, 너무 적으면 오히려 디자인적 요소가 깨짐
- iPadOS 앱에서는 TabBar대신 SideBar를 사용하도록 권장
- Modal View를 제외한 다른 View에서 언제 어디서나 유저가 바로 이동할수 있도록 TabBar를 숨기지 말것
- 해당 탭의 컨텐츠를 이용할수 없는 경우에도 Tab을 숨기지 말고 이용할 수 없는 설명을 보여줄것
- 현재 선택된 탭에서 다른 탭의 View에 영향을 끼치지 말아야 함
→ 예를 들어, 분할된 view의 왼쪽에 부분에 있는 tab을 선택했다면, 분할된 view의 오른쪽에 갑자기 변경되지 않아야 하고 Popover에서 tab을 선택했다면 popup 뒤의 뷰가 변경되지 않아야 한다
- 소통을 위해서 badge를 사용할것 ( 알림이 있다면 뱃지를 사용하여 표시 ) ex) 카카오톡 채팅 탭
→ 공식 문서 : UITabBarItem
- SF 기호를 사용하여 확장 가능하고 시각적으로 일관된 TabBar 항목을 제공하는 것을 고려할 것
- Custom Tab Bar glyphs를 만들어야 하는 경우, 탭 바가 어떠한 환경에서든 일관성있게 보이도록 글리프를 두 가지 크기로 만들것 ( Regular, Compact )
