SwiftUI List row's not resising to fit contents - swift

Question

I have a List View with 1) a header view, 2) dynamic ForEach views, and 3) a footer view. My issue is that the first row, in which the header view lies, won't resise to fit its contents. The code for the main view is below:
var body: some View {
List {
GeometryReader { geometry in
self.headerView(size: geometry.size)
}
ForEach(self.user.posts, id: \.self) { post in
Text(post.title)
}
Text("No more posts...")
.font(.footnote)
}
.edgesIgnoringSafeArea(.all)
}
This is the view which I am trying to achieve:
This is what I have so far...:
If it's any consolidation, the header view displays fine if it's outside of the list, however, that's not the view I'm looking for.
Thanks in advance.
P.S: Apologies for the huge images, I'm not sure how to make them appear as thumbnails...

Answer 1

Using GeometryReader is fine, but it should be used the proper way!
import SwiftUI
struct ContentView: View {
var body: some View {
// to get the size of view, we are going to use the width later
GeometryReader { p in
List {
GeometryReader { _p in
// put your image or whatever ...
// and set the frame width
Color.red.frame(width: p.size.width, alignment: .center)
}
// and finally fix the height !! to work as expected
.frame(height: 100)
Text("By by, World!")
}
}
}
}

Answer 2

I prefer to use Sections for similar purposes (sections allow to have different configuration of each), like
var body: some View {
List {
Section {
// << header view is here with own size
}
.listRowInsets(EdgeInsets()) // << to zero padding
Section { // << dynamic view is here with own settings
ForEach(self.user.posts, id: \.self) { post in
Text(post.title)
}
}
Section { // footer view is here with own size
Text("No more posts...")
.font(.footnote)
}
}
.edgesIgnoringSafeArea(.all)
}