带有同时手势的 SwiftUI TabView答案

【问题标题】：SwiftUI TabView with simultaneousGesture带有同时手势的 SwiftUI TabView
【发布时间】：2022-11-07 02:41:04
【问题描述】：

我有一个TabView，其中一些视图内部包含DragGestures。我希望能够将视图与 TabView 分页一起拖动。我正在尝试使用simultaneousGesture 进行拖动手势。这适用于ScrollView，但不适用于TabView。正如您在示例中看到的那样，可以拖动第二页上的绿色方块，但这不会与TabViews 水平滚动同时发生。

这是代码的简化版本：

struct ContentView: View {
  let colors:[Color] = [.red, .green, .blue]
  @State private var location: CGPoint = CGPoint(x: 100, y: 100);

  var simpleDrag: some Gesture {
    DragGesture()
      .onChanged { value in
        self.location = value.location
      }
      .onEnded {_ in }
  }

  var body: some View {
    TabView{
      ForEach(colors, id: \.self) { color in
        Group {
          if color == .green {
            VStack {
              color
                .frame(width:100, height: 100)
                .position(location)
                .simultaneousGesture(simpleDrag)
            }
          } else {
            color
          }
        }
        .frame(width: 200, height: 200)
      }
    }
    .frame(width: 400, height: 400)
    .tabViewStyle(.page(indexDisplayMode: .never))
  }
}

这是一个带有ScrollView 的版本，效果非常好，它甚至可以在左右移动时滚动滚动视图，并在上下拖动时移动绿色框。

struct ContentView: View {
  let colors:[Color] = [.red, .green, .blue]
  @State private var location: CGPoint = CGPoint(x: 100, y: 100);

  var simpleDrag: some Gesture {
    DragGesture()
      .onChanged { value in
        self.location = value.location
      }
      .onEnded {_ in }
  }

  var body: some View {
    ScrollView(.horizontal) {
      HStack {
        ForEach(colors, id: \.self) { color in
          Group {
            if color == .green {
              VStack {
                color
                  .frame(width:100, height: 100)
                  .position(location)
                  .simultaneousGesture(simpleDrag)
              }
            } else {
              color
            }
          }
          .frame(width: 200, height: 200)
        }
      }
    }
    .frame(width: 400, height: 400)
  }
}

【问题讨论】：

标签： swiftui gesture tabview simultaneous

【解决方案1】：

我也一直在寻找类似的答案。我能找到的最接近解决方案的是设置 DragGesture 的 minimumDistance 参数。我发现 DragGesture(minimumDistance:20) 可以很好地允许 TabView 分页在 DragGesture 启动之前发生。它确实将另一个手势延迟了 20 像素，但允许这两种手势似乎是一个公平的折衷方案功能

【讨论】：