SwiftUI中ScrollView用户拖拽滚动时仍可通过代码触发滚动的实现方案

嘿，我完全懂你遇到的这个问题！之前我在做一个长列表项目时也踩过这个坑——当用户正在手动拖拽ScrollView滚动的时候，用ScrollViewReader的scrollTo方法确实会失效，系统会优先响应用户的手势操作，直到滚动完全停下来才会处理代码里的滚动请求。不过别担心，我们有两种靠谱的解决办法，分别适配不同的iOS版本。

方案一：iOS 17+ 原生SwiftUI解决方案（推荐） #

从iOS 17开始，SwiftUI的ScrollView新增了scrollPosition绑定属性，这个属性的优先级很高，就算用户正在拖拽滚动，修改它也能立刻触发滚动，完美解决你的问题。

修改后的完整代码如下：

struct TestScrollView: View {
    @Namespace var topID
    @Namespace var bottomID
    // 新增：用于绑定滚动位置的变量
    @State private var scrollID: AnyHashable?

    var body: some View {
        VStack(spacing: 10) {
            Button("Scroll to Bottom") {
                withAnimation {
                    scrollID = bottomID
                }
            }
            .id(topID)

            ScrollView {
                VStack(spacing: 0) {
                    ForEach(0..<100) { i in
                        color(fraction: Double(i) / 100)
                            .frame(height: 32)
                    }
                }
                // 标记滚动目标的布局容器
                .scrollTargetLayout()
            }
            // 关联滚动位置绑定变量
            .scrollPosition(id: $scrollID)

            Button("Top") {
                withAnimation {
                    scrollID = topID
                }
            }
            .id(bottomID)
        }
    }

    func color(fraction: Double) -> Color {
        Color(red: fraction, green: 1 - fraction, blue: 0.5)
    }
}

这个方案的优势是完全用SwiftUI原生API实现，不需要依赖UIKit，代码更简洁。scrollPosition的优先级比用户的拖拽手势更高，所以不管用户是否在滚动，修改这个绑定变量都会立刻触发滚动动画。

方案二：兼容iOS 16及以下的UIKit桥接方案 #

如果你的项目需要支持iOS 16或者更早的版本，我们可以通过包装UIScrollView的方式，直接操作底层的滚动视图，绕过SwiftUI的手势优先级限制。

首先，我们需要创建一个封装UIScrollView的UIViewRepresentable组件：

struct UIKitScrollView<Content: View>: UIViewRepresentable {
    let content: Content
    // 用于控制滚动偏移的绑定变量
    @Binding var targetOffset: CGPoint?

    init(targetOffset: Binding<CGPoint?>, @ViewBuilder content: () -> Content) {
        self._targetOffset = targetOffset
        self.content = content()
    }

    func makeUIView(context: Context) -> UIScrollView {
        let scrollView = UIScrollView()
        // 将SwiftUI内容包装成UIView添加到ScrollView中
        let hostingView = UIHostingController(rootView: content).view!
        hostingView.translatesAutoresizingMaskIntoConstraints = false
        scrollView.addSubview(hostingView)

        NSLayoutConstraint.activate([
            hostingView.topAnchor.constraint(equalTo: scrollView.topAnchor),
            hostingView.leadingAnchor.constraint(equalTo: scrollView.leadingAnchor),
            hostingView.trailingAnchor.constraint(equalTo: scrollView.trailingAnchor),
            hostingView.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor),
            hostingView.widthAnchor.constraint(equalTo: scrollView.widthAnchor)
        ])

        return scrollView
    }

    func updateUIView(_ uiView: UIScrollView, context: Context) {
        // 当targetOffset有值时，直接设置滚动偏移
        if let offset = targetOffset {
            uiView.setContentOffset(offset, animated: true)
            // 重置变量避免重复触发
            targetOffset = nil
        }
    }

    func makeCoordinator() -> Coordinator {
        Coordinator(self)
    }

    class Coordinator: NSObject, UIScrollViewDelegate {
        var parent: UIKitScrollView

        init(_ parent: UIKitScrollView) {
            self.parent = parent
        }
    }
}

然后修改你的TestScrollView，使用这个自定义组件并计算滚动位置：

struct TestScrollView: View {
    @Namespace var topID
    @Namespace var bottomID
    // 用于控制自定义ScrollView的滚动偏移
    @State private var targetScrollOffset: CGPoint?
    // 保存顶部按钮的位置信息
    @State private var topButtonGlobalFrame: CGRect = .zero

    var body: some View {
        VStack(spacing: 10) {
            Button("Scroll to Bottom") {
                withAnimation {
                    // 计算滚动到底部的偏移量（根据列表总高度调整）
                    let totalListHeight = CGFloat(100 * 32)
                    targetScrollOffset = CGPoint(x: 0, y: totalListHeight - UIScreen.main.bounds.height + 64)
                }
            }
            .id(topID)
            // 获取顶部按钮的全局位置
            .background {
                GeometryReader { geo in
                    Color.clear.onAppear {
                        topButtonGlobalFrame = geo.frame(in: .global)
                    }
                }
            }

            UIKitScrollView(targetOffset: $targetScrollOffset) {
                VStack(spacing: 0) {
                    ForEach(0..<100) { i in
                        color(fraction: Double(i) / 100)
                            .frame(height: 32)
                    }
                }
            }

            Button("Top") {
                withAnimation {
                    // 计算滚动到顶部的偏移量
                    targetScrollOffset = CGPoint(x: 0, y: -topButtonGlobalFrame.minY + 32)
                }
            }
            .id(bottomID)
        }
    }

    func color(fraction: Double) -> Color {
        Color(red: fraction, green: 1 - fraction, blue: 0.5)
    }
}

这个方案的核心是直接操作底层UIScrollView的setContentOffset方法，这个方法的优先级比用户的拖拽手势更高，所以不管用户是否正在滚动，都会立刻执行滚动操作。

额外小提示 #

• 如果你的项目已经适配iOS 17及以上，强烈推荐使用方案一，因为它是SwiftUI原生实现，代码更简洁也更符合SwiftUI的设计理念。
• 方案二中的位置计算可能需要根据你的实际布局调整偏移量，比如考虑导航栏、TabBar的高度，避免滚动位置不准确。

内容来源于stack exchange