ScrollView 内的 SwiftUI TabView

Question

问题：我的TabView内容PageTabViewStyle具有不同的高度。我可以在不同页面之间滑动，但在页面内ScrollView我TabView会缩小到 0 高度。

预期：TabView具有最大子视图的高度。

我以前遇到过类似的问题，但只是硬编码最大视图的近似框架高度，但这似乎不是正确的方法。任何想法都非常感激。

struct ContentView: View {
    var body: some View {
//        ScrollView {
            VStack {
                TabView {
                    ForEach(1..<5, id:\.self) { index in
                        VStack {
                            DifferentSizeViews(times: index)
                            Spacer()
                        }
                    }
                }
                .tabViewStyle(PageTabViewStyle(indexDisplayMode: .never))
                
                Text("Some other content")
            }
        }
//    }
}

struct DifferentSizeViews: View {
    var times: Int
    var body: some View {
        VStack {
            ForEach(0..<times, id:\.self) { index in
                Text("some text \(index)")
            }
        }
    }
}

Answer 1

经过几个小时的痛苦后，我找到了这个解决方案。希望能帮助到你。

@State var selection: Int = 0
@State var height: CGFloat = 0

@State var sizeArray: [CGSize] = [.zero, .zero, .zero]
@State var initialHeight: CGFloat = 0

var body: some View {
    ScrollView {
        VStack(spacing: 0) {
            Color.red
                .frame(height: 100)
            
            TabView(selection: $selection) {
                Text("1\n1\n1")
                    .fixedSize()
                    .readSize(onChange: { size in
                        sizeArray[0] = size
                        if initialHeight == 0 {
                            initialHeight = size.height
                        }
                    })
                    .tag(0)
                Text("2\n2\n2\n2\n2")
                    .fixedSize()
                    .readSize(onChange: { size in
                        sizeArray[1] = size
                    })
                    .tag(1)
                Text("3")
                    .fixedSize()
                    .readSize(onChange: { size in
                        sizeArray[2] = size
                    })
                    .tag(2)
            }
            .tabViewStyle(PageTabViewStyle(indexDisplayMode: .never))
            .background(Color.white)
            .frame(height: height)
            .onChange(of: selection) { newValue in
                withAnimation {
                    height = sizeArray[newValue].height
                }
            }
            .onChange(of: initialHeight) { newValue in
                height = newValue
            }
        }
    }
    .background(Color.green)
}

及View延伸

extension View {
    func readSize(onChange: @escaping (CGSize) -> Void) -> some View {
        background(
            GeometryReader { geometryProxy in
                Color.clear
                    .preference(key: SizePreferenceKey.self, value: geometryProxy.size)
            }
        )
            .onPreferenceChange(SizePreferenceKey.self, perform: onChange)
    }
}