如何根据点击选项更改SwiftUI选择器值?

jv4diomz  于 2023-05-21  发布在  Swift
关注(0)|答案(3)|浏览(187)

我有三个选项在一个选择器,我需要改变选定的选项时,用户按下它。如何获取用户按下的选项,然后根据该选项更改选项?这是我目前的情况。我想我不明白如何获得索引的点击位置的选择器?

@State var option = 0

Picker("", selection: $option) {
                        Text("1").tag(0)
                        Text("2").tag(1)
                        Text("3").tag(2)
}
.pickerStyle(.segmented)
.onTapGesture {
   print(option)
   if option == 0 {
       print("1")
   } else if option == 1 {
       print("22")
   } else if option == 2 {
       print("3")
   }
}

目前print总是打印1。在正确的方向上的任何帮助将不胜感激!

epfja78i

epfja78i1#

当您点击Picker时,您正在请求打印:如果用户将其滑动到侧面会怎么样?.onTapGesture不会触发。更不用说它会扰乱用户的体验,因为它会在点击时触发一些不需要的东西。
您需要跟踪变量option的值,以便在它通过点击或滑动发生变化时打印它。请参阅下面使用.onChange(of:)的代码:

Picker("", selection: $option) {
                Text("1").tag(0)
                Text("2").tag(1)
                Text("3").tag(2)
            }
            .pickerStyle(.segmented)
            
            // This modifier tracks the value of the variable and triggers whenever it changes
            .onChange(of: option) { value in
                print("\nVariable value: \(value)")
                
                switch value {
                    case 0:
                        print("Selection 1")
                    case 1:
                        print("Selection 2")
                    default:
                        print("Selection 3")
                }
            }
qaxu7uf2

qaxu7uf22#

这就是我如何使用修饰语。onChange

struct ContentView: View {

@State var option = 0
let tabNames = ["1", "2", "3"]

var body: some View{
        Picker("", selection: $option) {
            ForEach(0..<3) {
                Text(tabNames[$0]).tag($0)
            }
        }
        .pickerStyle(.segmented)
        .onChange(of: option, perform: { value in
            print(value)
          print(tabNames[value])
        })
}
}
ugmeyewa

ugmeyewa3#

我通过创建一个按钮组来解决这个问题,并将其样式设置为拾取器:

ForEach(options, id: \.self) { option in
                        Button(action: {
                            selectedOption = option
                            print("Selected option: \(selectedOption)")
                        }) {
                            Text(option)
                                .frame(minWidth: 0, maxWidth: .infinity)
                                .padding()
                                .foregroundColor(.white)
                        }
                        .background(selectedOption == option ? Color.blue : Color.gray)
                        .padding(1)
                    }

相关问题