SwiftUI: set background color of the presenting view of a sheet

Question

Is there a way I can specify the background color of the view used to display a sheet in SwiftUI? I know I can set .background on my view, but on iPhone X that doesn't affect the safe area. I also could use .edgesIgnoringSafeArea to fill the area, but I'd prefer not to mess with that.

Answer 1

In the end you need to deal with edgesIgnoringSafeArea since you need to go beyond the safe area (you'd have to do the same in UIKit). The important thing is, that you only ignore the safe area for your background. So in terms of SwiftUI, you only need to apply edgesIgnoringSafeArea to the view you pass to background:

struct ContentView: View {
    var body: some View {
        VStack {
            Text("hey there")
            Text("Another line")
        }.background(Color.blue.edgesIgnoringSafeArea(.all))
    }
}

However, this requires that the view you use background on already requests all of the available space (which is not the case in my sample code above), since background only draws a background of the view and does not fill the screen by itself. If that's not the case for you, you need to use e.g. a ZStack as shown in your answer.

Answer 2

Messed with this some more and landed on this solution

struct BackgroundFillView<Content: View>: View {
    let backgroundColor: Color
    let content: () -> Content

    var body: some View {
        ZStack {
            self.backgroundColor.edgesIgnoringSafeArea(.all)
            self.content()
        }
    }
}