How to embed views in a tab bar using TabView

Paul Hudson @twostraws October 4th 2019

Updated for Xcode 12.0

SwiftUI’s TabView provides an equivalent to UITabBarController, allowing us to let the user switch between several active views using a bar at the bottom of the screen.

In its basic form, you should provide each item with an image and title, optionally also adding a tag if you want to control which tab is active programmatically. For example, this creates two views with different images, titles, and tags:

struct ContentView: View {    
    var body: some View {
        TabView {
            Text("First View")
                .tabItem {
                    Image(systemName: "1.circle")
                    Text("First")
                }.tag(0)
            Text("Second View")
                .tabItem {
                    Image(systemName: "2.circle")
                    Text("Second")
                }.tag(1)
        }
    }
}

If you add tags, you can programmatically control the active tab by modifying the tab view’s selection. First, add some state that can track the active tab: