SwiftUI sheet modal background not working with edgesIgnoreSafeArea(.all) - WHY?

user_11826174 0
Viewed 1489

I'm running iOS 13 simulator with a SwiftUI sheet modal - trying to paint the sheet background and ignore safe areas - but there's still white sheet showing. Any ideas on how to do this properly?


    var body: some View {
        VStack(alignment: .center, spacing: 0) {

... redacted ...

 }   // VStack
            .background(Color.gray.edgesIgnoringSafeArea(.all))

iPhone Simulator with sheet modal

See the image (attached)

Any ideas what I'm doing wrong?

swiftui background
2 Answers

Expand top container (VStack in your case) to full sheet area, like

VStack {
    // ... your content
}
.frame(maxWidth: .infinity, maxHeight: .infinity)      // << here !!
.background(Color.gray.edgesIgnoringSafeArea(.all))
user_122990300

Best way to paint the background is using a ZStack:

    var body: some View {
        ZStack {
            // replace with the color you want
            Color.green
                .edgesIgnoringSafeArea(.all)
            

            VStack {
                // put view's Content here
            }
        }
    }
user_118373410
Related