SwiftUI - List scrolling underneath status bar text
Inspired by Shauket Sheikh. You can directly add the .padding(.top) to the List and it's done. No need for a VStack.
struct ContentView : View {
var body: some View {
List(0..<5) { item in
HStack(alignment: VerticalAlignment.top, spacing: 5) {
Image(systemName: "photo")
VStack(alignment: HorizontalAlignment.leading, spacing: 10) {
Text("USA")
.font(.headline)
Text("This is an extremely long string that will never fit even the widest of Phones Excerpt From: Paul Hudson. “SwiftUI by Example”. Apple Books. ")
.lineLimit(nil)
.font(.subheadline)
}
}
}
.frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity)
.background(Color.red)
.onAppear() {
print("on Appear")
}.onDisappear() {
print("on Disappear")
}
.padding(.top)
}
}
I had the same problem with my ScrollView
My solution was simpler than the rest, so give this a shot:
Just add .clipped()
modifier to your List
or ScrollView
and this should prevent your content from scrolling out of its bounds.
And you can then combine this with edgesIgnoringSafeArea(.bottom)
if you want your content to still scroll off screen from the bottom. But watch out - edgesIgnoringSafeArea(.bottom)
has to come after .clipped()
if you want this effect.