It seems the behavior of LazyVGrid has changed a bit in Xcode 13. For my use case, I need a grid with each item's height being variable.
Here is the implementation:
struct ExampleLazyVGrid: View {
private let columns = Array(repeating: GridItem(.flexible(), spacing: 24), count: 4)
private let sizes: [CGFloat] = [100, 150, 80, 110, 50, 120, 90, 40, 130, 140, 70, 60]
var body: some View {
LazyVGrid(columns: columns, alignment: .leading, spacing: 24) {
ForEach(sizes, id: \.self) { size in
VStack(spacing: 0) {
Rectangle()
.fill(Color.gray)
.frame(width: size, height: size)
Spacer()
}
}
}
.background(Color.gray.opacity(0.5))
}
}
In Xcode 12.5, the rectangles are aligned at the top as expected as shown here:
In Xcode 13, the Spacer() is ignored and the rectangles are no longer top aligned as shown here:
So same code, just different behavior between Xcode 12.5 and Xcode 13. I'm experimenting with a workaround, but seems like a bug to me?