swiftui - SwiftUI ScrollView はカスタム StaggeredGrid の高さを計算しません

Question

高さが可変のカードを表示するために、SwiftUI で新しいグリッド構造を作成しようとしています。その範囲で、いくつかLazyVStackの を aHStackで使用し、データ項目を正しい順序で表示する条件を設定しています。このビューは単独で機能し、列の数を画面のサイズに合わせますが、 で使用するとScrollView、サイズが適切に計算されず、次のビューがグリッドの下ではなくグリッドの下になります。グリッドに使用したコードは次のとおりです。

struct StaggeredGrid<Element, Content>: View where Content: View {

    var preferredItemWidth: CGFloat
    var data: [Element] = []

    var content: (Element) -> Content

    init(preferredItemWidth: CGFloat, data: [Element], @ViewBuilder content: @escaping (Element) -> Content) {
        self.preferredItemWidth = preferredItemWidth
        self.data = data
        self.content = content
    }

    var body: some View {
        GeometryReader { geometry in
            HStack(alignment: .top, spacing: 20) {
                ForEach(1...Int(geometry.size.width / preferredItemWidth), id: \.self) { number in
                    LazyVStack(spacing: 20) {
                        ForEach(0..<data.count, id: \.self) { index in
                            if (index+1) % Int(geometry.size.width / preferredItemWidth) == number % Int(geometry.size.width / preferredItemWidth) {
                                content(data[index])
                            }
                        }
                    }
                }
            }
            .padding([.horizontal])
        }
    }
}

そして、動作を表示するプレビュー:

struct StaggeredGrid_Previews: PreviewProvider {
    static var previews: some View {
        ScrollView {
            VStack {
                StaggeredGrid(preferredItemWidth: 160, data: (1...10).map{"Item \($0)"}) { item in
                    Text(item)
                        .foregroundColor(.blue)
                }
                Text("I should be below the grid")
            }
        }
    }
}

プレビューの写真は 次のとおりです。

そして、ScrollViewコメントアウトされたときの写真: 予想される動作、ScrollView が削除されました

私が理解していないこの動作についての助けや手がかりを事前にありがとう.