SwiftUI：水平ScrollView内视图伸缩不影响父HStack布局方案

问题根源是HStack的高度由内部最高子视图决定，当第二个视图展开后，整个HStack高度被拉高，切换到其他视图时，这些视图会被拉伸填满HStack的高度。以下是可靠的解决方法：

方法：通过滚动位置跟踪自动收起展开视图 #

利用iOS 17+的scrollPosition绑定跟踪当前显示的页面，当页面切换至非第二个视图时，自动重置展开状态变量，让HStack高度恢复正常。

代码示例

struct ContentView: View {
    @State private var showExchangeRates = false
    @State private var showExpand = false
    @State private var scrollPosition: Int? = 0 // 跟踪当前滚动到的视图索引

    var body: some View {
        ScrollView(.horizontal) {
            HStack(spacing: 0) {
                // 第一个视图
                Color.blue
                    .frame(width: UIScreen.main.bounds.width - 16)
                    .overlay(Text("第一个视图"))
                
                // 第二个视图（高度可变）
                VStack {
                    Button("切换展开状态") {
                        showExchangeRates.toggle()
                        showExpand.toggle()
                    }
                    if showExpand {
                        Color.yellow
                            .frame(height: 300)
                            .overlay(Text("展开内容"))
                    }
                }
                .frame(width: UIScreen.main.bounds.width - 16)
                .background(Color.green)
                
                // 第三个视图
                Color.purple
                    .frame(width: UIScreen.main.bounds.width - 16)
                    .overlay(Text("第三个视图"))
            }
            .scrollTargetLayout()
        }
        .scrollPosition(id: $scrollPosition)
        .contentMargins(.horizontal, 8, for: .scrollContent)
        .scrollTargetBehavior(.paging)
        .onChange(of: scrollPosition) { _, newIndex in
            // 当切换到非第二个视图时，收起展开状态
            if newIndex != 1 {
                showExchangeRates = false
                showExpand = false
            }
        }
    }
}

关键说明 #

1. scrollPosition绑定：直接跟踪当前显示的视图索引，比onAppear/onDisappear更可靠——因为HStack内的视图可能提前加载，onDisappear不会触发，但滚动位置变化一定会被捕捉到。
2. 视图宽度设置：每个子视图宽度设为屏幕宽度 - 16，抵消contentMargins的左右8pt，保证分页滑动时每个视图刚好占满屏幕。
3. 状态重置时机：在滚动位置变化的回调中重置展开变量，确保切换页面时HStack高度立即恢复，避免其他视图被异常拉伸。

如果需要兼容iOS 16及以下版本，可以使用ScrollViewReader结合onChange监听滚动偏移，或者通过UIScrollView的代理计算当前页面，但scrollPosition是最简洁的方案。

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