SwiftUI 如何让ScrollView随高度扩展的TextField自动滚动展示新内容

核心原因 #

你的代码不生效是因为onChange的触发时机早于Text视图的高度重绘完成时机，ScrollViewProxy执行滚动时，拿到的还是文本更新前的视图高度，所以滚动位置计算错误。

解决方案 #

按以下三点调整即可实现预期效果：

• 固定滚动锚点ID，不要使用动态生成的值，建议定义为全局常量字符串
• 在Text底部添加一个透明占位视图作为滚动锚点，比直接锚定Text本身的底部更准确
• 给滚动操作增加极短的异步延迟，等待视图布局更新完成后再执行滚动

修改后可运行代码 #

// 全局定义固定锚点ID，避免动态生成
let textBottomAnchorId = "textBottom"

ScrollViewReader { proxy in
    ScrollView(.vertical, showsIndicators: false) {
        Text(newMessageText)
            .frame(width: 230, alignment: .center)
            .font(.system(size: 46))
            .foregroundColor(.black)
            .multilineTextAlignment(.leading)
            .lineLimit(nil)
            .padding()
        // 底部透明锚点视图
        Color.clear
            .frame(height: 1)
            .id(textBottomAnchorId)
    }
    .onChange(of: newMessageText) { _ in
        // 延迟0.1秒等待布局更新完成后滚动
        DispatchQueue.main.asyncAfter(deadline: .now() + 0.1) {
            // 可选：添加动画让滚动更顺滑
            withAnimation(.easeOut(duration: 0.2)) {
                proxy.scrollTo(textBottomAnchorId, anchor: .bottom)
            }
        }
    }
}

如果不需要滚动动画，删掉withAnimation包裹层即可。

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