ScrollView 中的 SwiftUI 按钮有时不可点击

Question

我在 MapView 顶部有一个水平 ScrollView。

ScorllView 是 Button 的集合。奇怪的是 ScrollView 中的按钮有时可点击，有时不可点击。第一次点击总是有效，但之后我必须滚动一下，点击按钮中的不同区域，进行一些秘密祈祷，然后它就起作用了！

我尝试禁用/删除视图中的所有其他组件，但仍然无法找出根本原因。

有人经历过吗？

Answer 1

我遇到了同样的问题，水平

ScrollView

位于顶部，

List

。在调试时，我将空的

.onTapGesture

添加到

ScrollView

，它以某种方式解决了我的问题。

VStack(spacing: 0) {
    ScrollView(.horizontal) {
        HStack {
            Button("one") {}
            Button("two") {}
            Button("three") {}
        }
    }
    .onTapGesture { // <---- fix
    }
    List {
    }
}

Answer 2

对于遇到此问题的其他人，不要添加空的 .onTapGesture 视图修饰符，而是检查 ScrollView 层次结构中的任何 HStack 是否具有

.contentShape(Rectangle())

修饰符。默认情况下，HStack 不接受其子视图之间的点击，并且根据子视图的布局，这可能会导致点击被错过，即使它们看起来应该着陆。

.contentShape(Rectangle())

使 HStack 的整个框架都可点击。

Answer 3

我也遇到了 Swiftui 深色主题“CameraTimerItem”按钮不可点击的水平滚动视图的相同问题（仅深色主题有问题）。然后我放了一个 onTapGesture 没有任何动作。它开始正常工作了。我认为这是 SwiftUI 的错误。

       VStack (alignment:.center){
                        ScrollView(.horizontal, showsIndicators: false) {
                            HStack{
                                ForEach(timeSlots,id: \.self) { item in
                                    CameraTimerItem(cellTitle: item)
                                }
                            }
                            .frame(width: AppUtils.width, alignment: .center)
                        }
                        .onTapGesture {
                           // <---- This is the solution 
                        }
                    }

Answer 4

已接受答案的一个问题是，如果 ScrollView 中也有 ColorPicker，它会破坏 ColorPicker 的演示文稿。 解决方案，使用

.simultaneousGesture(DragGesture())

代替。

ScrollView {
  HStack {
    Button("A") {}
    ColorPicker("Color", selection: .constant(.red))
  }
}
.simultaneousGesture(DragGesture())