TabBar Item

A modal representing an individual item for the tab bar.

Overview

The TabBarItem defines an individual item in the TabBar. Each item includes a system image and a title, which are displayed in the tab bar. This model helps in creating a navigational structure within the bottom tab Bar.

To use TabBarItem initialize it with a system image name and a title. Use it with the tabBarItem modifier to specify each tab item in the TabBar.

Initializer

Creates a tab bar item with the specified system image and title.

TabBarItem(systemImage: String, titleKey: String)

Parameters

Paramters
Description

systemImage

The name of the system image to be used as the tab item’s icon.

title

The text to be displayed as the tab item’s title.

Example

@State private var selection = TabBarItem(systemImage: "house.fill", titleKey: "Home")

var body: some View {
    TabBar(selection: $selection) {
        Text("Home View")
            .tabBarItem(systemImage: "house.fill", titleKey: "Home", selection: $selection)
        
        Text("Settings")
            .tabBarItem(systemImage: "gear", titleKey: "Settings", selection: $selection)
    }
}

Last updated