当 window 使用 GeometryReader 调整大小时，调整 SwiftUI 中矩形网格的大小

Question

我正在编写一个 SwiftUI 视图来充当无限单元格网格的视口。 我希望视图中显示的行数和列数取决于 window（这是一个 mac 应用程序）的大小。

当我用硬编码的行数和列数（例如， ForEach(0..<10) ）编写它时，它工作得很好。 但是当我切换到使用GeometryReader计算行数和列数时，矩形消失了。

struct ContentView: View {
    let cellSize: CGFloat = 40
    var body: some View {
        GeometryReader { geometry in
            VStack {
                ForEach(0..<Int(geometry.size.height / self.cellSize)) { _ in
                    HStack {
                        ForEach(0..<Int(geometry.size.width / self.cellSize)) { _ in
                            Rectangle()
                                .fill(Color.red)
                        }
                    }
                }
            }
        }
    }
}

Answer 1

我认为问题出在常量ForEach （即基于范围的构造函数）中。 如果要更改视图数量，我们应该使用动态ForEach 。 这是可能的解决方案。 使用 Xcode 11.4 / macOS 10.15.5 测试。

var body: some View {
    GeometryReader { geometry in
        VStack {
            ForEach(Array(repeating: 0, count: 
                    Int(geometry.size.height / self.cellSize)), id: \.self) { _ in
                HStack {
                    ForEach(Array(repeating: 0, count: 
                            Int(geometry.size.width / self.cellSize)), id: \.self) { _ in
                        Rectangle()
                            .fill(Color.red)
                    }
                }
            }
        }
    }
}