Reputation: 119
I have a picker with 3 values. How to display some information based on the selection of the picker tab?
@State var tabSelectedValue = 0
var body: some View{
VStack {
Picker(selection: $tabSelectedValue, label: Text("")) {
Text("A").tag(0)
Text("B").tag(1)
Text("C").tag(2)
}.pickerStyle(SegmentedPickerStyle())
}
}
Upvotes: 2
Views: 1325
Reputation: 6500
@State var tabSelectedValue = 0
var yourData = ["one", "Two", "Three"]
var body: some View{
VStack {
Text("\(yourData[tabSelectedValue])")
Picker(selection: $tabSelectedValue, label: Text("")) {
Text("A").tag(0)
Text("B").tag(1)
Text("C").tag(2)
}.pickerStyle(SegmentedPickerStyle())
}
}
Or you may use with TabView together,
struct ContentView: View {
@State var tabSelectedValue = 0
var body: some View{
VStack {
Picker(selection: $tabSelectedValue, label: Text("")) {
Text("A").tag(0)
Text("B").tag(1)
Text("C").tag(2)
}.pickerStyle(SegmentedPickerStyle())
TabView(selection: $tabSelectedValue,
content: {
Text("A Tab Content").tag(0)
Text("B Tab Content").tag(1)
Text("C Tab Content").tag(2)
})
.tabViewStyle(PageTabViewStyle())
}
}
}
Upvotes: 3
Reputation: 18904
struct PickerDataView: View {
var data: String
var body: some View {
Text("Picker Date \(data)")
}
}
struct ContentView: View {
@State private var tabSelectedValue = 0
private var pickerData: [String] = ["A", "B", "C"]
var body: some View {
VStack {
PickerDataView(data: "\(pickerData[tabSelectedValue])")
Picker(selection: $tabSelectedValue, label: Text("")) {
ForEach(0 ..< pickerData.count) {
Text(pickerData[$0]).tag($0)
}
}.pickerStyle(SegmentedPickerStyle())
}
}
}
Upvotes: -1