使用 NavigationLink 打开新视图时如何隐藏 TabView？

Question

假设我们有一个 SwiftUI 视图包含

struct ContentView: View {
    var body: some View {
        TabView {
            FirstView().tabItem {
                // tabItem image and text
            }
            SecondView().tabItem {
                // tabItem image and text
            }
        }
    }
}

现在，假设 FirstView 包含一个 NavigationView，每个元素都使用 NavigationLink 来滚动内容。我怎样才能让它在触发 NavigationLink 目的地时（即打开子视图）接管整个页面（全屏）并因此隐藏 TabView？

理想情况下我想支持iOS 13+。

我已尝试遵循 Hacking with Swift 中的指导，但无济于事。

我也听从了中的建议，但发现顶级解决方案的性能不是很好，所以我希望能实现一个没有延迟出现的解决方案。

Answer 1

一个解决方案是从 child 视图（FirstView 和 SecondView）中删除 NavigationView，然后在 TabView.[=15 之外放置一个 NavigationView =]

NavigationView {
    TabView {
        //...
    }
}

这会适当地将您的 TabView 放入导航堆栈，而不是将 parent 放入导航堆栈。这可能会产生不良结果，包括导航栏标题和 UI 更改，因为您将导航堆栈的根移动到上游，但这对我的用例有效。

Answer 2

将 tabitem 的内容包含在检查共享状态的 if 条件中：

struct ContentView: View {

    @StateObject private var state = State()

    var body: some View {
        TabView {
            FirstView().tabItem {
                if !state.hideTabView {
                    // tabItem image and text
                }
            }
            SecondView().tabItem {
                if !state.hideTabView {
                    // tabItem image and text
                }
            }
        }
        .environmentObject(state)
    }
}

其中 State 是 ObservableObject 这样的：

class State: ObservableObject {
    @Published hideTabView: Bool = false
}

然后您可以在通过 NavigationLink 链接到的视图上使用 onAppear（例如在 FirstView 中）：

struct FirstView: View {
    
    @EnvironmentObject private var state: State
    var body: some View {
        VStack {
            // ... some content
        }
        .onAppear(perform: { state.hideTabView = true })
        .onDisappear(perform: { state.hideTabView = false })
    }
}

当您按下“<返回”时，再次出现的 TabView 会稍有延迟，如果这真的困扰您，那么您可以制作一个自定义的“返回”按钮并将此 state.hideTabView = false 移动到点击那个的事件按钮。

这是我能想到的一种方法 :) 此外，您可能会发现有帮助。

使用 NavigationLink 打开新视图时如何隐藏 TabView？

How to hide TabView when opening a new view with NavigationLink?

ios

swiftui

swiftui-navigationlink

swiftui-tabview

swiftui-navigationview