在 SwiftUI 中的多个导航视图的情况下隐藏导航栏

Posted 2023-02-24

【中文标题】在 SwiftUI 中的多个导航视图的情况下隐藏导航栏

【英文标题】：Hiding Navigation Bar in case of multiple Navigation Views in SwiftUI

【发布时间】：2020-06-30 11:52:32

【问题描述】：

如果有多个导航视图，我无法隐藏导航栏。我希望导航栏出现在第一个和第二个屏幕上，但不在第三个屏幕上。

struct FirstView: View 

    init() 
        UINavigationBar.appearance().backgroundColor = UIColor.green
    

    var body: some View 
        NavigationView 
                NavigationLink(destination: SecondView()) 
                    Text("Second View")
            .navigationBarTitle("First View")
        
    

 
// Second View

struct SecondView: View 
    var body: some View 
        NavigationLink(destination: ThirdView()) 
            Text("Third View")
        
    


// Third View 

struct ThirdView: View 

    var body: some View 
        
            Text("Welcome")
            .navigationBarTitle("")
            .navigationBarHidden(true)
        
    

我尝试使用上述代码将导航栏隐藏在第三个屏幕上，但它不起作用:(

【问题讨论】：

每个导航堆栈应该只有 一个 NavigationView。

【参考方案1】：

如果您想在第三个视图中完全隐藏导航栏，可以采用这种方法。 （注意：顺便说一句，在一个视图层次结构中必须只有一个 NavigationView，因此在 ThirdView 中不需要另一个）

使用 Xcode 11.4 / ios 13.4 测试

class HideBarViewModel: ObservableObject 
    @Published var isHidden = false


struct FirstView: View 
    @ObservedObject var vm = HideBarViewModel()
    init() 
        UINavigationBar.appearance().backgroundColor = UIColor.green
    

    var body: some View 
        NavigationView 
                NavigationLink(destination: SecondView()) 
                    Text("Second View")
            .navigationBarTitle("First View")
            .navigationBarHidden(vm.isHidden)
        .environmentObject(vm)
    


// Second View

struct SecondView: View 
    var body: some View 
        NavigationLink(destination: ThirdView()) 
            Text("Third View")
        
    


// Third View

struct ThirdView: View 
    @EnvironmentObject var vm: HideBarViewModel
    var body: some View 
        Text("Welcome")
            .onAppear 
                self.vm.isHidden = true
            
    

【讨论】：

它如何帮助我隐藏第三屏的导航栏？您建议的解决方案也只是将标题添加到第二个屏幕。尝试了您的解决方案，但它没有解决我想要实现的目标:(