导航栏前面的SwiftUI视图

时间:2020-08-21 22:46:05

标签: ios swift uinavigationcontroller swiftui

在我制作的iOS应用中,我使用NavigationLink从主视图转到另一个视图。我希望两个视图的导航栏中都存在一个按钮,该按钮会将模糊效果覆盖在视图中所有内容的顶部。在主视图中,模糊效果很好,但是在第二个视图中,导航栏和导航栏标题不会变得模糊,而是位于模糊视图的顶部。

如何使“导航”视图出现在第二个视图的模糊之下?

主视图:

var body: some View {
    ZStack {
        NavigationView {
            ScrollView(.vertical) {
                . . .
            }
            .navigationBarItems(
            leading: Button(action: {
                    showBlurView.toggle()
                }) {
                    Text("Show blur view")
                }
            ),
            trailing: Button(action: {
                    NavigationLink(destination: SecondView()) {
                        Text("2nd view")
                    }
                }
            )
        }
        
        BlurEffectView(style: .systemThinMaterial)
            .edgesIgnoringSafeArea(.all)
            .hidden(showBlurView == true ? false : true)

    }
}

第二个视图:

var body: some View {
    ZStack {
        VStack {
            ...
        }.navigationBarTitle("Second View")

    BlurEffectView(style: .systemThinMaterial)
            .edgesIgnoringSafeArea(.all)
            .hidden(showBlurView == true ? false : true)
            
    }
}

以及BlurEffectView的代码:

struct BlurEffectView: UIViewRepresentable {
    let style: UIBlurEffect.Style = .systemMaterial

    func makeUIView(context: Context) -> UIVisualEffectView {
        return UIVisualEffectView(effect: UIBlurEffect(style: style))
    }

    func updateUIView(_ uiView: UIVisualEffectView, context: Context) {
        uiView.effect = UIBlurEffect(style: style)
    }
}

0 个答案:

没有答案
相关问题