I have the following code:
struct TestListView: View {
var body: some View {
Text("the list view")
VStack {
List {
ForEach(0..<10) { n in
CellView(number: n)
}
}
}
}
}
struct CellView:View {
let number:Int
var body: some View {
/// DOES NOT WORK:
GeometryReader { geo in
ZStack {
Rectangle().fill(.brown)
Text("Number: \(number)")
}
.frame(width: geo.size.width, height: geo.size.width * CGFloat.random(in: 0.5...1) )
}
/// WORKS:
// ZStack {
// Rectangle().fill(.brown)
// Text("Number: \(number)")
// }
// .frame(width: 200, height: 200 * CGFloat.random(in: 0.5...1) )
}
}
It renders this:
If I change the CellView
to this:
struct CellView:View {
let number:Int
var body: some View {
/// DOES NOT WORK:
// GeometryReader { geo in
// ZStack {
// Rectangle().fill(.brown)
// Text("Number: \(number)")
// }
// .frame(width: geo.size.width, height: geo.size.width * CGFloat.random(in: 0.5...1) )
// }
/// WORKS:
ZStack {
Rectangle().fill(.brown)
Text("Number: \(number)")
}
.frame(width: 200, height: 200 * CGFloat.random(in: 0.5...1) )
}
}
Then the cell is able lot set its own height:
Why is using GeometryReader
breaking things? How can I allow the cell to use geometry reader size information to then set its height in this case according to custom cell logic?