iosswiftiphoneswiftui

Get Safe Area without any margins

Apple shows this safe area (hig, layout):

Safe Area Apple HIG Image

I want to fill the entire safe area, including the margins. Is there any way to get to this without manually measuring in every single device?

ZStack {
    Color.red
        .edgesIgnoringSafeArea(.all)
    
    Color.orange
        .edgesIgnoringSafeArea(.vertical)
}

enter image description here

This is what I want:

enter image description here

Solution

  • Quite ugly, but I went through every iOS 17+ device and fine tuned it manually. Using the Device.modelName from here.

    struct ContentView: View {
    var body: some View {
        ZStack {
            Color.white
                .edgesIgnoringSafeArea(.all)
            
            Color.black
                .padding(.horizontal, -offset)
        }
        .edgesIgnoringSafeArea(.vertical)
    }
    
    var offset: CGFloat {
        let device = Device.modelName
        
        switch device {
        case _ where device.contains("iPhone XR"):
            return 14.5
        case _ where device.contains("iPhone XS"): // & XS Max
            return 13.8
        case _ where device.contains("iPhone 11 Pro"): // & 11 Pro Max
            return 13.8
        case _ where device.contains("iPhone 11"):
            return 14.5
            
        case _ where device.contains("iPhone 12 mini"):
            return 16.8
        case _ where device.contains("iPhone 12"): // & 12 Pro & 12 Pro Max
            return 14.8
            
        case _ where device.contains("iPhone 13 mini"):
            return 13.8
        case _ where device.contains("iPhone 13"): // & 13 Pro & 13 Pro Max
            return 13.1
             
        case _ where device.contains("iPhone 14 Pro"): // & 14 Pro Max
            return 10.8
        case _ where device.contains("iPhone 14"): // & 14 Plus
            return 13.1
            
        case _ where device.contains("iPhone 15"):
            // & 15 Pro & 15 Pro Max & 15 Plus
            return 10.8
            
        case _ where device.contains("iPhone 16 Pro"): // & 16 Pro Max
            return 11.1
        case _ where device.contains("iPhone 16e"):
            return 13.1
        case _ where device.contains("iPhone 16"): // & 16 Plus
            return 10.8
            
        default:
            return 0
        }
    }
}