SwiftUI Navigation TabView

SwiftUI Navigation: TabView

Switch between sections with TabView and .tabItem.

---

Basic TabView

Use TabView to switch between sections.

Example

Demo.swift

ContentView.swift

App.swift

import SwiftUI

struct TabBasicDemo: View {
  var body: some View {
TabView {
  Text("Home").tabItem { Label("Home", systemImage: "house") }
  Text("Settings").tabItem { Label("Settings", systemImage: "gear") }
}
  }
}

In the example above, the TabView is used to switch between sections.

---

---

Selection & Badges

Track the active tab with @State and add .badge().

Example

Demo.swift

ContentView.swift

App.swift

import SwiftUI

enum Tab: Hashable { case home, inbox }

struct TabSelectionDemo: View {
  @State private var selection: Tab = .home
  var body: some View {
TabView(selection: $selection) {
  Text("Home").tabItem { Label("Home", systemImage: "house") }.tag(Tab.home)
  Text("Inbox").tabItem { Label("Inbox", systemImage: "tray") }.badge(3).tag(Tab.inbox)
}
  }
}