SwiftUI + Xcode 12

SwiftUI | Implement a TabView With TabItem()

Let’s see how to implement a SwiftUI TabView that switch Views each time you click on a TabItem

From the author

Difficulty: Beginner | Easy | Normal | Challenging

Environment : Xcode 12 & SwiftUI

Create a new project

Open Xcode > New Project > App Template > Name it TabViewDemo> SwiftUI App Life Cycle & Interface.

Xcode > New Project

Create the 3 Views

Go to your project target > New File > SwiftUI View > name them as follow:

• FirstView
• SecondView
• ThirdView

Now, you will have the following file in your project:

Create the TabView

Head back to your ContentView.swift file and replace the Text UI element with the following code:

Here, we gave our TabView three TabItem() with an icon picked up from Sf Symbol and a name.

Run the project 🏋🏻‍♂️

Now, run your Xcode project and you will be able to switch between Views thanks to the bottom navigation.

Final Screenshot

Thanks for reading! I’m always happy to have a chat and collaborate at hello@sullivandecarli.com. Consider subscribing to enjoy unlimited access to my articles and all of Medium through my referral link.