在 NavigationStack 上设置角半径：SwiftUI 中无响应的内容视图区域

Question

我尝试将

cornerRadius

应用于

NavigationStack

，但结果，触摸区域被限制在初始视图位置。简而言之，如果滑块关闭，则无法通过点击将其打开，除非触摸图像中描绘的红色区域。 （

ControllerView

负责动画）

import SwiftUI

private struct ControllerView<Content: View>: View {
    private var content: Content
    @Binding var isOpen: Bool
    
    init(isOpen: Binding<Bool>, @ViewBuilder content: () -> Content) {
        self._isOpen = isOpen
        self.content = content()
    }
    
    var body: some View {
        GeometryReader { proxy in
            ZStack {
                Color.yellow.ignoresSafeArea()
                content
                    .cornerRadius(30) /// <- Here
                    .offset(x: isOpen ? 300 : 0)
            }
            .ignoresSafeArea()
        }
    }
}

private struct GreenView: View {
    @Binding var isOpen: Bool
    @Binding var navigation : [AnyHashable]
    
    var body: some View {
        NavigationStack(path: $navigation) {
            Color.green.ignoresSafeArea()
            .onTapGesture {
                print("GreenView tapped!")
                withAnimation { isOpen.toggle() }
            }
        }
    }
}


struct SwiftUIView9: View {
    @State private var isOpen = true
    
    var body: some View {
        ControllerView(isOpen: $isOpen) {
            GreenView(isOpen: $isOpen, navigation: .constant([]))
        }
    }
}

#Preview {
    SwiftUIView9()
}

Answer 1

通过反复试验，我发现首先放置

offset

可以修复它：

content
    .offset(x: isOpen ? 300 : 0)
    .cornerRadius(30)

您也可以看到这种情况发生在其他一些修饰符上，

clipped

，

colorInvert

等。这可能与在offset

之后应用的

修饰符影响视图的原始位置有关，尽管我不能解释一下它到底是如何工作的。