How to make edgesIgnoringSafeArea in swiftUI work?

Question

The following code makes a view where a rectangle is at the bottom of the view. I put.edgesIgnoringSafeArea(.bottom) so the rectangle goes all the way down but it doesn't work. Im simulating this on an Iphone 11 and always leaves a blank space below.

struct ContentView: View {
    var body: some View {
        NavigationView {
            VStack {
                List {
                    Text("Hello, World!")
                }
                
                Spacer()
                
                Rectangle()
                    .frame(height: 150)
                    .edgesIgnoringSafeArea(.bottom)
            }
        }
    }
}

Answer 1

The rectangle is inside a VStack , and the VStack doesn't ignore the safe area. Even if the rectangle ignores the safe area, it can't extend beyond its parent to fill the whole screen.

You should put edgesIgnoringSafeArea after the VStack , and the rectangle will naturally fill the VStack , hence filling the whole screen.

var body: some View {
    NavigationView {
        VStack {
            List {
                Text("Hello, World!")
            }
            
            Spacer()
            
            Rectangle()
                .frame(height: 150)
        }
        .edgesIgnoringSafeArea(.bottom)
    }
}