Как создать прозрачный прямоугольник в SwiftUI

Question

Я хочу сделать изображение на 100% прозрачным через небольшой прямоугольник и на 50% прозрачным от всех остальных. Как будто делает маленькое отверстие, чтобы видеть сквозь маленький прямоугольник. Вот мой код ...

struct ImageScope: View {

    var body: some View {
        ZStack {
            Image("test_pic")

            Rectangle()
                .foregroundColor(Color.black.opacity(0.5))

            Rectangle()
                .frame(width: 200, height: 150)
                .foregroundColor(Color.orange.opacity(0.0))
                .overlay(RoundedRectangle(cornerRadius: 3).stroke(Color.white, lineWidth: 3))
        }
    }
}

Для облегчения понимания ...

Answer 1

Вот рабочий подход. Используется пользовательская форма и четно-нечетный стиль заливки.

Протестировано с Xcode 11.4 / iOS 13.4

Ниже демонстрация с большей контрастностью прозрачности для лучшей видимости.

struct Window: Shape {
    let size: CGSize
    func path(in rect: CGRect) -> Path {
        var path = Rectangle().path(in: rect)

        let origin = CGPoint(x: rect.midX - size.width / 2, y: rect.midY - size.height / 2)
        path.addRect(CGRect(origin: origin, size: size))
        return path
    }
}

struct ImageScope: View {

    var body: some View {
        ZStack {
            Image("test_pic")

            Rectangle()
                .foregroundColor(Color.black.opacity(0.5))
                .mask(Window(size: CGSize(width: 200, height: 150)).fill(style: FillStyle(eoFill: true)))

            RoundedRectangle(cornerRadius: 3).stroke(Color.white, lineWidth: 3)
                .frame(width: 200, height: 150)
        }
    }
}