SwiftUI中如何同时控制ScrollView的横向与纵向滚动位置？

你的代码中左右移动选中项时ScrollView不触发水平滚动，核心原因是ScrollView默认的滚动目标行为未适配LazyVGrid的水平布局逻辑。以下是具体解决方法：

关键修改点 #

• 给ScrollView添加.scrollTargetBehavior(.viewAligned)，让ScrollView将每个网格单元格视为独立滚动目标，支持水平、垂直方向的精准定位。
• 可选：完善changeSelection方法，处理行边界切换逻辑（比如行尾右移跳转到下一行开头，避免选中无效索引）。

修改后的完整代码 #

struct ScrollControlIssueDemoView: View {
    
    let columnCount = 6
    let rowCount = 20
    var numberOfCells: Int { columnCount * rowCount }
    var cells: [Int] { (0..<numberOfCells).map { $0 } }
    let cellSize: CGFloat = 100
    var columns: [GridItem] { Array(repeating: GridItem(.fixed(cellSize), spacing: 0), count: columnCount) }
    @State private var selectedCell = 2
    
    var body: some View {
        HStack {
            Button("Left") { changeSelection(by: -1) }
            Button("Up") { changeSelection(by: -columnCount) }
            Button("Down") { changeSelection(by: columnCount) }
            Button("Right") { changeSelection(by: 1) }
        }
        ScrollViewReader { scrollViewProxy in
            ScrollView([.horizontal, .vertical]) {
                LazyVGrid(columns: columns) {
                    ForEach(cells, id: \.self) { cell in
                        Text("\(cell)")
                            .frame(width: cellSize, height: cellSize)
                            .background(cell == selectedCell ? .red : .clear)
                    }
                }
                .scrollTargetLayout()
            }
            // 启用视图对齐的滚动目标行为，支持水平垂直双向滚动定位
            .scrollTargetBehavior(.viewAligned)
            .onChange(of: selectedCell) {
                Task {
                    scrollViewProxy.scrollTo(selectedCell, anchor: .center)
                }
            }
        }
    }
    
    func changeSelection(by delta: Int) {
        let newSelection = selectedCell + delta
        
        // 处理行边界：左移到行首跳转到上一行末尾，右移到行尾跳转到下一行开头
        let currentRow = selectedCell / columnCount
        let newRow = newSelection / columnCount
        
        var adjustedSelection = newSelection
        if delta == -1 && selectedCell % columnCount == 0 {
            adjustedSelection = selectedCell + columnCount - 1
        } else if delta == 1 && (selectedCell + 1) % columnCount == 0 {
            adjustedSelection = selectedCell - columnCount + 1
        }
        
        // 确保选中索引在有效范围内
        if adjustedSelection >= 0 && adjustedSelection < numberOfCells {
            selectedCell = adjustedSelection
        }
    }
}

原理说明 #

.scrollTargetBehavior(.viewAligned)会让ScrollView将.scrollTargetLayout()标记的子视图（即LazyVGrid的每个单元格）作为滚动对齐目标，调用scrollTo时，ScrollView会自动调整水平、垂直方向的偏移，确保目标视图出现在指定锚点位置（这里是.center）。

完善后的changeSelection方法处理了行边界切换逻辑，让左右移动的交互更符合用户预期，避免出现无效选中索引的情况。

内容的提问来源于stack exchange，提问作者Philip Pegden