Since upgrading to Monterey I am seeing a bug in my app where items in a LazyVGrid row do not have matching heights anymore.
Prior to Monterey, each item in the row would have the height of the tallest item (purple) and the Spacer would allow the smaller ones to stretch.
Is this a bug that we can expect to be fixed or should I try to achieve this layout in a different way?
Here is a simple example demonstrating it:
import SwiftUI
import PlaygroundSupport
struct ContentView: View {
var columns: [GridItem] {
[GridItem(.adaptive(minimum: 80), spacing: 16, alignment: .top)]
}
var body: some View {
LazyVGrid(columns: columns, alignment: .leading, spacing: 16) {
VStack {
Text("red")
Spacer()
Color.red.frame(height: 20)
}
.border(.red)
VStack {
Text("orange")
Spacer()
Color.orange.frame(height: 10)
}
.border(.orange)
VStack {
Text("yellow")
Spacer()
Color.yellow.frame(height: 5)
}
.border(Color.yellow)
VStack {
Text("green")
Spacer()
Color.green.frame(height: 15)
}
.border(Color.green)
VStack {
Text("blue")
Spacer()
Color.blue.frame(height: 25)
}
.border(Color.blue)
VStack {
Text("purple")
Spacer()
Color.purple.frame(height: 30)
}
.border(Color.purple)
}
.frame(width: 600)
.border(.black)
}
}
PlaygroundPage.current.setLiveView(ContentView())