SwiftUI viewAligned滚动目标行为适配不规则子视图问题咨询

问题说明 #

使用SwiftUI的.viewAligned(limitBehavior: .always)作为ScrollView的滚动目标行为时，若scrollTargetLayout的子视图高度不固定（比如示例中随机100-300），仅第二个滚动项能正确对齐ScrollView顶部，其余项均无法正常对齐；但子视图高度固定时功能完全正常。

是否为已知限制 #

是的，目前SwiftUI原生的.viewAligned滚动目标行为存在这个限制——它的内部位置计算逻辑默认预设了子视图尺寸一致，当子视图高度动态变化时，滚动目标的位置计算会出现偏差，导致后续视图无法正确对齐顶部。

自定义ScrollTargetBehavior解决方案 #

我们可以通过自定义ScrollTargetBehavior来实现不规则高度子视图的顶部对齐需求，核心是手动计算每个滚动目标的偏移量，确保滚动停止时目标视图顶部对齐ScrollView的可见区域顶部。

1. 自定义滚动目标行为

struct CustomViewAlignedBehavior: ScrollTargetBehavior {
    func updateTarget(_ target: inout ScrollTarget, context: TargetContext) {
        // 获取ScrollView可见区域的顶部坐标
        let scrollViewTop = context.containerFrame.minY
        // 计算目标视图需要的偏移量，使其顶部对齐ScrollView顶部
        var desiredOffset = target.rect.minY - scrollViewTop
        
        // 处理滚动边界：防止内容滚动超出顶部或底部
        let maxAllowedOffset = 0.0 // 不能向上滚动超出内容顶部
        let minAllowedOffset = context.contentSize.height - context.containerFrame.height // 不能向下滚动超出内容底部
        desiredOffset = max(min(desiredOffset, maxAllowedOffset), minAllowedOffset)
        
        target.contentOffset.y = desiredOffset
    }
}

2. 替换原生行为到ScrollView

修改原代码中的.scrollTargetBehavior为自定义实现：

VStack {
    ScrollView {
        LazyVStack {
            ForEach(0..<100) { number in
                Text(verbatim: String(number))
                    .font(.largeTitle)
                    .frame(minWidth: 0, maxWidth: .infinity, minHeight: CGFloat.random(in: 100...300))
                    .background(Rectangle().fill(Color.green))
            }
        }
        .scrollTargetLayout()
    }
    .scrollTargetBehavior(CustomViewAlignedBehavior())
    .background(.red)
}
.padding(.all, 16.0)
.background(.blue)

原理说明 #

自定义行为通过重写updateTarget方法，直接基于目标视图的实际位置和ScrollView的可见区域，计算出精准的偏移量，完全规避了原生.viewAligned对固定尺寸的依赖，无论子视图高度如何变化，都能保证滚动停止时目标视图顶部与ScrollView顶部对齐。

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