使用 GeometryReader 调整窗口大小时，在 SwiftUI 中调整矩形网格的大小

Question

我正在编写一个 SwiftUI 视图，以充当无限单元格网格的视口。我希望视图中显示的行数和列数取决于窗口的大小(这是一个 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)
}
}
}
}
}
}