[Presentation Containers] Tab View

 Tab view 

어떤 컴포넌트인가?

• A view that switches between multiple child views using interactive user interface elements.
  
  > 하단 버튼(UI요소, Tab bar)를 사용하여 여러 화면을 전환할 수 있다.

---

언제, 어디서 사용하는가?

• A tab bar appears at the bottom of a screen, helping people understand the types of information or functionality an app provides. Tabs let people quickly switch between top-level sections in your app while preserving the current navigation state within each section.
  
  > 화면 하단에 위치하여, 사용자가 정보나 기능의 유형을 쉽게 이해할 수 있도록 돕는다.
  > 탭을 사용하면, 앱의 현 탐색 상태는 유지하며 각 세션 사이의 빠른 전환을 할 수 있도록 한다.

---

어떻게 사용하는가? 

//선언
struct TabView<SelectionValue, Content> where SelectionValue : Hashable, Content : View

// 탭뷰 선언 (3개의 탭)
TabView {
    Text("The First Tab")
        .badge(10) // 알림이 10개
        .tabItem {
            Image(systemName: "1.square.fill") //SF 이미지
            Text("First")
        }
    Text("Another Tab")
        .tabItem {
            Image(systemName: "2.square.fill")
            Text("Second")
        }
    Text("The Last Tab")
        .tabItem {
            Image(systemName: "3.square.fill")
            Text("Third")
        }
}
.font(.headline)

 

---

 관련 HIG 요소 

• 화면 최하단에 위치한다.
• 탭바는 반투명 상태여야 한다.
• 키보드 활성화시 탭바는 숨겨져야 한다.
• 탭 수는 3~5개를 유지한다.
  > 너무 많으면 탭을 터치할 수 있는 영역이 좁아진다. (→ 원치 않는 이동이 일어남)
  > 인터페이스의 복잡성이 늘어남
• 탭을 통해 화면이동할 때 , 탭은 사라지면 안 된다.
• SF 기호를 사용해라

---

 Document Link 

• HIG (Tab Bar)

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

Apple Developer Documentation

---

 컴포넌트가 사용된 곳 

• 애플뮤직
  • 탭 바가 반투명으로 되어있으며, 키보드 활성화시 탭바가 사라졌다.

•