如何让水平ScrollView自适应内容高度？

默认情况下水平ScrollView会抢占所有垂直可用空间，要让它自动匹配内部内容的高度，有两种常用方案：

方法一：使用fixedSize修饰符（简单场景首选） #

给ScrollView添加.fixedSize(horizontal: false, vertical: true)修饰符，参数设置意为保留横向滚动能力，垂直方向根据内容自动调整高度，直接解决问题。

修改后的代码：

struct ContentView: View {
    var numbers = 1...100
    var body: some View {
        ScrollView(.horizontal) {
            LazyHStack {
                ForEach(numbers, id: \.self) {
                    Text("\($0)")
                        .font(.largeTitle)
                }
            }
        }
        .fixedSize(horizontal: false, vertical: true) // 添加该行实现高度适配
    }
}

这个修饰符会让ScrollView放弃垂直方向的空间抢占，转而以内部LazyHStack的实际高度作为自身高度，同时不影响横向滚动功能。

方法二：自定义PreferenceKey获取高度（复杂场景适用） #

如果内部视图高度动态变化、fixedSize无法满足需求，可以通过PreferenceKey捕获内容高度，再手动设置ScrollView的frame：

1. 定义用于传递高度的PreferenceKey：

struct ContentHeightPreferenceKey: PreferenceKey {
    static var defaultValue: CGFloat = 0
    static func reduce(value: inout CGFloat, nextValue: () -> CGFloat) {
        value = max(value, nextValue())
    }
}

2. 监听内容高度并设置给ScrollView：

struct ContentView: View {
    var numbers = 1...100
    @State private var contentHeight: CGFloat = 0
    
    var body: some View {
        ScrollView(.horizontal) {
            LazyHStack {
                ForEach(numbers, id: \.self) {
                    Text("\($0)")
                        .font(.largeTitle)
                }
                .background(
                    GeometryReader { proxy in
                        Color.clear
                            .preference(key: ContentHeightPreferenceKey.self, value: proxy.size.height)
                    }
                )
            }
        }
        .frame(height: contentHeight)
        .onPreferenceChange(ContentHeightPreferenceKey.self) { newHeight in
            contentHeight = newHeight
        }
    }
}

通过GeometryReader获取LazyHStack的实际高度，再通过PreferenceKey将高度值传递给父视图，最终把该高度设置为ScrollView的frame高度，实现精确适配。

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