swiftui - ScrollView 无法使用几何阅读器正确显示视图

Question

在需要呈现的视图中使用 GeometryReader 时，SwiftUI 中的 ScrollView 存在问题。我有一个简单的视图 DetailsS​​ectionViews，我想在 ScrollView 中显示它。这个 DetailsS​​ectionViews 需要一个 Geometry reader 来查看屏幕的宽度，因此它可以调整自身内部的视图。对于手头的问题，我简化了这个 DetailsS​​ectionViews 的代码。

import SwiftUI

struct DetailSectionViews: View {
    
    // Mark: - Properties
    // Used variables
    var showSplits = false
    
    // Used contants
    let columns = [GridItem(.flexible()), GridItem(.flexible())]
    let shadowColor = TrackColors.baseColor.opacity(0.3)
    let cellHeigthConstant = 0.5943

    var body: some View {
        GeometryReader { geo in
            VStack(alignment: .center, spacing: 25) {
                Text("This should be the header.")
                    .bold()
                
                LazyVGrid(columns: columns, alignment: .center, spacing: 10) {
                    ForEach(0..<6) { index in
                        if index % 2 == 0 {
                            Text("These are the even columns in the grid.")
                                .frame(width: 165, height: 88)
                        } else {
                            Text("These are the odd columns in the grid come.")
                                .frame(width: 165, height: 88)
                        }
                    }
                }
            }
            .background(Color(red: 247/255, green: 249/255, blue: 251/255))
        }
    }
}

现在我想在 ScrollView 中显示这个 DetailsS​​ectionViews，如下所示：

import SwiftUI

struct ContentView: View {
    
    // MARK: Properties
    // Used variables
    @State private var shouldDismissView = false
    
    // Used constants
    let shadowColor = TrackColors.baseColor.opacity(0.3)
    let headerTitle =
        NSLocalizedString(Track.trackType.uppercased(), comment: "Track type localized") +
        NSLocalizedString(" STATS", comment: "Stats localized.")

    var body: some View {
        
        VStack {
            TopBarRow(
                hasFinishedRecording: true,
                runDate: "28 okt. 2021 07:26",
                shouldDismisView: $shouldDismissView
            )
            
            TrackTitleView(trackName: "Some name goes in here", time: "1:07:22")
                .shadow(color: shadowColor, radius: 5, x: 1, y: 1)
                .padding(20)

            ScrollView {
                ForEach(0..<3) { _ in
                    DetailSectionViews()
                }
            }
        }
        .background(Color(red: 247/255, green: 249/255, blue: 251/255))
    }
}

结果是如下图所示的屏幕：

显然，由于 GeometryReader，ScrollView 无法估计 DetailsS​​ectionViews 的高度。如果我删除 DetailsS​​ectionViews 中的 GeometryReader，屏幕在 ScrollView 中看起来与预期一样。

谁能告诉我 ScrollView 与 GeometryReader 的问题以及如何处理？请不要给我不使用 GeometryReader 的替代方法，我想了解 ScrollView 与 GeometryReader 的问题。

谢谢， MacUserT