Add TabView in SwiftUI
TabView
A view that switches between multiple child views using interactive user interface elements.
Overview
To create a user interface with tabs, place views in a Tab and apply the tab modifier to the contents of each tab. The following creates a tab view with three tabs:
import SwiftUI
struct ContentView: View {
init() {
UITabBar.appearance().barTintColor = UIColor.systemPink
}
var body: some View {
TabView {
Text("First View")
.tabItem {
Image(systemName: "house.fill") // Change Tab Bar Item Image
Text("Home") // Change the Tab Bar Item Title
.foregroundColor(Color.red)
}.tag(0)
Text("Second View")
.tabItem {
Image(systemName: "mappin.circle.fill")
Text("Map")
}.tag(1)
Text("Third View")
.tabItem {
Image(systemName: "3.circle")
Text("Third")
}.tag(2)
}
.accentColor(.white) // change the Tint color of Tab Bar Item
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
Tab views only support tab items of type Text, Image, or an image followed by text. Passing any other type of view results in a visible but empty tab item.
Comments
Post a Comment