I have a very simple View with NavigationBar and a List in a VStack. If I scroll up on the list, the list contents will appear behind the NavigationBar with a nice blur effect by default. This behavior is correct.
I would also like to have some fixed text below my list that doesn't scroll. However, if I add the following single line of code Text("bottom")
below the list, the blur effect on the NavigationBar doesn't work anymore.
struct ContentView: View {
var body: some View {
NavigationView {
VStack {
List {
Text("Hello, world!")
.foregroundColor(.red)
.font(.system(size: 70))
}
.listStyle(.plain)
.border(.red)
Text("bottom") // remove this and the blur works
}
.background(.black)
.navigationBarTitle("test", displayMode: .inline)
}
}
}
Why is this happening, and how can I get content below my list while retaining the blur effect?