ios – Is there a way to make .ignoresSafeArea() work? Simply colored, centered ZStacks are placed in wrong position

0
189


struct HomeContainerView: View {
    var body: some View {
        GeometryReader { geometry in
            ZStack {
                ZStack {
                    
                }
                .frame(width: geometry.size.width - 20, height: geometry.size.height - 20)
                .background(Color.orange)
                
                ZStack {
                    
                }
                .frame(width: geometry.size.width - 40, height: geometry.size.height - 40)
                .background(Color.gray)
                
                ZStack {
                    
                }
                .frame(width: geometry.size.width - 60, height: geometry.size.height - 60)
                .background(Color.red)
            }
            .frame(width: geometry.size.width, height: geometry.size.height, alignment: Alignment(horizontal: .center, vertical: .center))
            .background(Color.indigo)
        }
    }
}

With safe area.

By simple adding .ignoresSafeArea(), the whole thing does not size to the size of the device screen?

struct HomeContainerView: View {
    var body: some View {
        GeometryReader { geometry in
            ZStack {
                ZStack {
                    
                }
                .frame(width: geometry.size.width - 20, height: geometry.size.height - 20)
                .background(Color.orange)
                
                ZStack {
                    
                }
                .frame(width: geometry.size.width - 40, height: geometry.size.height - 40)
                .background(Color.gray)
                
                ZStack {
                    
                }
                .frame(width: geometry.size.width - 60, height: geometry.size.height - 60)
                .background(Color.red)
            }
            .frame(width: geometry.size.width, height: geometry.size.height, alignment: Alignment(horizontal: .center, vertical: .center))
            .background(Color.indigo)
        }
        .ignoresSafeArea()
    }
}

Ignoring safe area.

This is making it impossible for me to set up an app with SwiftUI. Is there a way to ignore the safe area and have the inner-contents size to the size of the device minus the safe area? I have spent a long time trying to de-riddle this. Thanks!