SwiftUI ScrollView 也觸發 DragGesture

Question

我正在制作用戶用自己的內容填寫的可滑動 flash 卡。 該卡片包含一個垂直 ScrollView（用於文本）和水平 ScrollView（用於標簽）。 該卡還附加了一個拖動手勢。 但是，當我滾動瀏覽 ScrollViews 時，它也會觸發 DragGesture's.onChanged（但也不會跟隨 with.onEnded）。 如何在手勢之前優先考慮 ScrollView？

struct ContentView: View {
    @State private var translation: CGSize = .zero

    var body: some View {
        GeometryReader { geometry in
            ZStack {
                Color(.blue).edgesIgnoringSafeArea(.all)

                VStack {
                    ScrollView {
                        Text("blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah")
                    }
                    Tags(decks: ["Tag", "Tag", "Tag", "Tag", "Tag", "Tag", "Tag"])
                }

                .padding(24)
                .frame(width: geometry.size.width - 48, height: geometry.size.height / 2)
                .background(Color.gray)
                .clipShape(RoundedRectangle(cornerRadius: 18, style: .continuous))
                .animation(.interactiveSpring(response: 0.5, dampingFraction: 0.75, blendDuration: 0))
                .offset(x: self.translation.width, y: self.translation.height)
                .gesture(DragGesture()
                    .onChanged { value in
                        self.translation = value.translation
                    }.onEnded { value in
                        self.translation = .zero
                    })
            }
        }
    }
}


struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

struct Tags: View {
    var decks: [String] = []

    var body: some View {
        ScrollView(.horizontal, showsIndicators: false) {
            HStack {
                ForEach(decks, id: \.self) { deck in
                    Text(deck)
                        .font(.system(size: 12, weight: .semibold))
                        .padding(.vertical, 6)
                        .padding(.horizontal, 12)
                        .background(Color.white)
                        .clipShape(Capsule())
                }
            }
        }
    }
}

Answer 1

嘗試使用手勢修飾符，例如同時(with:)、sequential(before:) 或exclusive(before:) 來解決您的問題。