在我制作的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)
}
}