'How can I limit a Custom Shape to safe area in SwiftUI?

I have 2 Shapes CustomShape1 is limited to safeArea and it is okay, but CustomShape2 is ignores safeArea out of the box, which I am not okay with it. In CustomShape1 I could pass the origin and size to limit my Shape available Space to SafeArea, but I do not have or I do not see a way to pass origin or size for CustomShape2 which is just a Circle, so how can I solve this issue, that CustomShape2 respect safeArea as well right of the box?

I found out adding padding modifier would solve the issue not in the way I wanted, I do not want use view modifier to solve shape issue. As you can see adding .padding(.vertical, 0.1) would limit the view to safeArea, I do know should I call this a bug or what!

struct ContentView: View {
    var body: some View {

        ZStack {
            
            CustomShape1()
                .fill(Color.red)
            
            CustomShape2()
                .fill(Color.blue)
                .background(Color.black.opacity(0.8))
                //.padding(.vertical, 0.1) // Adding This Would solve the issue!
            
        }

    }
}


struct CustomShape1: Shape {
    func path(in rect: CGRect) -> Path {
        Path { path in
            path.addRect(CGRect(origin: rect.origin, size: rect.size))
        }
    }
}


struct CustomShape2: Shape {
    func path(in rect: CGRect) -> Path {
        Path { path in
            path.addArc(center: CGPoint(x: rect.midX, y: rect.midY), radius: 50, startAngle: Angle(degrees: 0), endAngle: Angle(degrees: 360), clockwise: true)
        }
    }
}

enter image description here



Solution 1:[1]

Set .clipped().

.background(Color.blue.opacity(0.8).clipped()) // <===Here

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Raja Kishan