How it works
DefaultTabLabel is the view SwiftUI synthesizes to present a tab's label — its title and image — when you build a Tab from a string and a system image rather than supplying your own label view. It is the standard appearance that the system draws in a TabView's tab bar or sidebar, giving every tab a consistent, platform-appropriate look without your having to compose the label by hand. Reach for it implicitly whenever you create a Tab with the convenience initializers; you rarely name the type directly, but it is what backs the labels you see.
Create tabs with the title-and-image initializer
Building a
Tabfrom a localized title, asystemImage, and avalueis what causes SwiftUI to produce aDefaultTabLabelfor that tab. EachTabhere —Tab("Home", systemImage: "house", value: 1),Tab("Search", systemImage: "magnifyingglass", value: 2), andTab("Profile", systemImage: "person.crop.circle", value: 3)— hands its title string and SF Symbol to the default label rather than a custom closure.Supply the title and SF Symbol the label renders
The first argument and the
systemImageargument become the two piecesDefaultTabLabellays out: text paired with an icon. Strings like"Home"and symbol names like"house"and"person.crop.circle"are all the label needs to draw a complete, correctly styled tab item.Let the value drive selection through DefaultTabLabel
Pairing each tab's
valuewith theTabView(selection:)binding lets the default label reflect selected versus unselected state automatically. Withvalue: 1matched against@State private var selection = 1via$selection, theDefaultTabLabelfor the Home tab renders in its selected style while the others render unselected.Rely on the system styling instead of a custom label
Because no
label:closure is provided,DefaultTabLabelcontrols placement, font, tint, and adaptation to the currentTabViewstyle — bottom bar, sidebar, or compact — across platforms. TheText("Home")and.padding()inside eachTabare the tab's content, not its label; the label itself is entirely the default one.
Tab("Search", systemImage: "magnifyingglass", value: 2) with a Tab(value: 2) that supplies its own label: closure, and watch that one tab stop using DefaultTabLabel while Home and Profile keep the system-drawn label.Example & preview
Press Run live & edit to compile it in your browser — then edit the Swift on the left and the preview re-renders live.
struct DefaultTabLabelDemo: View {
@State private var selection = 1
var body: some View {
TabView(selection: $selection) {
Tab("Home", systemImage: "house", value: 1) {
Text("Home").padding()
}
Tab("Search", systemImage: "magnifyingglass", value: 2) {
Text("Search").padding()
}
Tab("Profile", systemImage: "person.crop.circle", value: 3) {
Text("Profile").padding()
}
}
}
}