swift - 选择器干扰 onTapGesture
问题描述
我想澄清一下我已经搜索了答案,但没有找到任何有用的东西。我已经发布了这个问题,但是我已经修改了它,因为我为代码提供了图像而不是使用文本。
我有以下代码:
struct TimeChoiceView: View {
@State var buttonText = "None"
@State var isPressed = false
var text : String = "SomeView"
var body: some View{
VStack{
HStack{
VStack(alignment: .leading, spacing: 20){
Text(text).padding(EdgeInsets(top: 0, leading: 15, bottom: 0, trailing: 0)).font(.system(size: 14))
}
Spacer()
VStack(alignment: .trailing){
Text(buttonText).padding(EdgeInsets(top: 0, leading: 0, bottom: 0, trailing: 15)).foregroundColor(.gray).font(.system(size: 14)).onTapGesture {
self.isPressed = !self.isPressed
self.buttonText = self.buttonText == "None" ? "Undo" : "None"
}
}
}
HStack {
if isPressed {
TimeChoice()
}
}
}
}
}
在此视图中,TimeChoice
是否使用以下代码实现了 Picker:
struct TimeChoice: View{
@State var hours: Int = 8
@State var minutes: Int = 30
var body: some View {
HStack {
Spacer()
Picker("", selection: $hours){
ForEach(0..<23, id: \.self) { i in
Text("\(i)").tag(i)
}
}.pickerStyle(WheelPickerStyle()).frame(width: 50, height: 70).clipped()
Text(":")
Picker("", selection: $minutes){
ForEach(0..<60, id: \.self) { i in
Text(i < 10 ? "0\(i)" : "\(i)").tag(i)
}
}.pickerStyle(WheelPickerStyle()).frame(width: 50, height: 70).clipped()
Spacer()
}
}
}
选择器的出现是由onTapGesture
方法 in触发的TimeChoiceView
,但正如您所见,尝试再次按下Undo
按钮不会触发相关操作。我可以设置选择器,但不能设置按钮。我有理由认为这与.onTapGesture
干扰选择器的方法有关,因为这只会在我按下按钮并且选择器消失时发生。有没有人经历过这样的行为?
解决方案
问题在于,在提供的代码中,Picker
按钮在打开时会重叠(甚至在视觉上被剪裁),因此请处理所有点击事件。
解决方案是将按钮面板放置在可选显示的选择器视图上方。使用 Xcode 11.4 / iOS 13.4 测试
var body: some View{
VStack{
HStack{
VStack(alignment: .leading, spacing: 20){
Text(text).padding(EdgeInsets(top: 0, leading: 15, bottom: 0, trailing: 0)).font(.system(size: 14))
}
Spacer()
VStack(alignment: .trailing){
Text(buttonText).padding(EdgeInsets(top: 0, leading: 0, bottom: 0, trailing: 15)).foregroundColor(.gray).font(.system(size: 14))
.onTapGesture {
self.isPressed.toggle()
self.buttonText = self.buttonText == "None" ? "Undo" : "None"
}
}
}.zIndex(1) // << here !!
HStack {
if isPressed {
TimeChoice()
}
}
}
}
推荐阅读
- multithreading - pthread_create() 是否总是在用户和内核线程之间创建一对一的映射?
- angular7 - 如何在 Router 和 NAvControl 中使用 ionic 4 中的前一个组件
- haskell - 哈斯克尔。得到相同的邻居
- php - 用facebook登录的问题。突然不工作
- javascript - python,使用recording.js将blob转换为wav文件
- python-3.x - 在 athena 查询 boto3 后,将文件从一个 s3 位置复制到另一个位置不起作用
- javascript - 如何在angular4中设置XLSX工作表的列宽
- php - PHP 使用 mysqli_connect 连接到 Google Cloud Sql Instance 数据库
- c# - 如何使用 C# 将在代码中创建的 UIElement 转换为流?
- reactjs - 触发点击事件时如何在amcharts中获取气泡值