How it works
TabsPickerStyle is a PickerStyle that presents a picker's options as a horizontal row of tab-like segments, with the current selection highlighted in place. Reach for it when a picker offers a small, fixed set of mutually exclusive choices — such as filters or view modes — and you want all options visible at once rather than hidden behind a menu or wheel. Rather than instantiate the type directly, you apply it through the .tabs static value passed to the pickerStyle(_:) modifier, which adapts the picker's standard selection binding and content to the segmented presentation.
Apply the style with pickerStyle(.tabs)
The pickerStyle(_:) modifier tells SwiftUI how to lay out a Picker's options; passing the .tabs shorthand for TabsPickerStyle switches the picker from its default presentation to an inline segmented row. In the example, .pickerStyle(.tabs) is attached directly to the Picker so its three options render as adjacent tabs.
Drive selection with the picker's binding
TabsPickerStyle does not change how selection works — it reads and writes the same binding the Picker is initialized with, highlighting whichever tab matches the current value. Here the picker is created as Picker("Filter", selection: $selection), so tapping a tab updates the @State property selection, and the bound Text("Showing: \(selection)") reflects the change.
Identify each tab with tag(_:)
Each option's value is established with the tag(_:) modifier, and TabsPickerStyle matches the active tab by comparing those tags against the selection. The example tags Text("All").tag("All"), Text("Unread").tag("Unread"), and Text("Flagged").tag("Flagged"), so each label becomes a selectable segment whose tag must be the same type as selection.
Provide labels as the picker's content
The views supplied inside the Picker become the visible content of each tab, so TabsPickerStyle works best with short, evenly weighted labels that fit a segmented row. The three Text views in the example act as the tab titles, while the picker's own "Filter" label is used for accessibility rather than drawn in the segmented control.
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 TabsPickerStyleDemo: View {
@State private var selection = "All"
var body: some View {
VStack(spacing: 16) {
Picker("Filter", selection: $selection) {
Text("All").tag("All")
Text("Unread").tag("Unread")
Text("Flagged").tag("Flagged")
}
.pickerStyle(.tabs)
Text("Showing: \(selection)")
.font(.headline)
}
.padding()
}
}