在 SwiftUI 中单击 NavigationLink 后隐藏 TabView

Question

当我有一个TabView{} 并且第一个选项卡有一个NavigationView 时，当我点击Row 时，我希望TabView{} 消失。我该怎么做？

同样的问题：How to hide the TabBar when navigate with NavigationLink in SwiftUI?

但遗憾的是没有解决方案。

Answer 1

目前没有办法做到这一点。例如，NavigationView 响应其后代的 .navigationBarHidden(_:) 方法，但没有与 TabView 等效的方法。

如果这是你想看到的，let Apple know。

Answer 2

没有办法隐藏 TabView，所以我不得不在 ZStack 中添加 TabView，如下所示：

var body: some View {
    ZStack {
        TabView {
            TabBar1().environmentObject(self.userData)
                .tabItem {
                    Image(systemName: "1.square.fill")
                    Text("First")
            }
            TabBar2()
                .tabItem {
                    Image(systemName: "2.square.fill")
                    Text("Second")
            }
        }

        if self.userData.showFullScreen {
            FullScreen().environmentObject(self.userData)

        }
    }
}

用户数据：

  final class UserData: ObservableObject {
    @Published var showFullScreen = false}

标签栏1：

struct TabBar1: View {
    @EnvironmentObject var userData: UserData

    var body: some View {
        Text("TabBar 1")
            .edgesIgnoringSafeArea(.all)
            .frame(width: UIScreen.main.bounds.width, height: UIScreen.main.bounds.height)
            .background(Color.green)
            .onTapGesture {
                self.userData.showFullScreen.toggle()
        }
    }
}

全屏：

struct FullScreen: View {
    @EnvironmentObject var userData: UserData

    var body: some View {
        Text("FullScreen")
            .edgesIgnoringSafeArea(.all)
            .frame(width: UIScreen.main.bounds.width, height: UIScreen.main.bounds.height)
            .background(Color.red)
            .onTapGesture {
                self.userData.showFullScreen.toggle()
        }
    }
}

在Github查看完整代码

还有其他一些方法，但取决于视图的结构

Answer 3

为了解决这个限制，我提出了这种方法：

• 创建了一个枚举来识别标签

enum Tabs: Int {
    case tab1
    case tab2
    
    var title: String {
        switch self {
        case .tab1: return "Tab 1 Title"
        case .tab2: return "Tab 2 Title"
        }
    }

    var imageName: String {
        switch self {
        case .tab1: return "star" // Example using SF Symbol
        case .tab2: return "ellipsis.circle"
        }
    }
}

• 在视图里面，比如ContentView.swift，添加了这样一个属性：

@State private var selectedTab = Tabs.tab1

• 体内：

NavigationView {
    TabView(selection: $selectedTab) {
        ViewExample1()
            .tabItem {
                Image(systemName: Tabs.tab1.imageName)
                Text(Tabs.tab1.title)
        }.tag(Tabs.tab1)
        
        ViewExample2()
            .tabItem {
                Image(systemName: Tabs.tab2.imageName)
                Text(Tabs.tab2.title)
        }.tag(Tabs.tab2)
    }
    .navigationBarTitle(selectedTab.title)
}

就是这样。我希望这可能会有所帮助。

注意：请注意，此解决方法将 TabView 隐藏在任何和所有子视图中，如果您只想隐藏在特定视图中，这不会为您提供所需的结果.

希望 Apple 很快实现一个（官方和适当的）选项来隐藏 TabView。