时间戳

首页 > 解决方案 > 当视图在 SwiftUI 中的 TabView 中时，NavigationView 标题不会出现

ios - 当视图在 SwiftUI 中的 TabView 中时，NavigationView 标题不会出现

问题描述

我有两个视图，每个视图都包含带有标题的 NavigationView。我创建了一个 TabBar 视图，它上面也有一个 NavigationView。

struct TabbarView: View {
var body: some View {
    NavigationView{
    TabView {
        MainContentView()
            .tabItem {
                VStack {
                    Text("Main")
                }
        }.tag(0)

        SearchContentView()
            .tabItem {
                VStack {
                    Text("Search")
                }
        }.tag(1)
    }
    }.navigationBarBackButtonHidden(true)
    .navigationBarHidden(true)
}

}

我曾尝试隐藏此视图的导航栏，但这不起作用。仅显示此视图的导航栏。

这是MainContentView()

struct MainContentView: View {

var body: some View {
    NavigationView {
        Text("Some Content View")
        }
    .navigationBarTitle("Travel")
}

}

任何想法如何去做。谢谢！

更新：基本上当我点击登录按钮时，我通过 NavigationLink 传递 TabBarView()。

   NavigationLink(destination: TabbarView()) {
                        HStack {
                            Text("Log In")
                        }
                        .padding()
                        .frame(width: geometry.size.width - 40, height: 40)
                        .foregroundColor(Color.white)
                        .background(Color.blue)
                        .cornerRadius(5)
                }.padding(.bottom, 40)

在这样做时，它显示了带有子视图的 TabbarView()，这就是我所看到的：“Travel”上方的空间（childView 的navigationBarTitle）是标签栏的导航栏，因为我将它推入了navigationStack。

在此处输入图像描述

标签： iosswiftswiftuinavigationview

解决方案

这里首先要指出的是，您在代码中拥有的所有导航栏修饰符都应该是 . 内部视图上的NavigationView修饰符，而不是NavigationView本身的修饰符。从 的文档中.navigationBarTitle，例如：

此修饰符仅在此视图位于 NavigationView 内部且可见时才生效。

此外，没有必要在你NavigationView的. 这只会导致嵌套导航栏，您绝对不希望这样。相反，只需使用一个. 我还建议你不要把身体放在里面。TabViewMainContentViewNavigationViewNavigationViewMainContentView

我已经重构了你的代码以显示我在说什么，虽然我不确定你在哪里尝试使用.navigationBarBackButtonHiddenand .navigationBarHidden，所以我省略了它们。请记住，它们的功能就像.navigationBarTitle- 您需要将它们用作内部视图的修饰符NavigationView，而不是NavigationView本身。

struct TabBarView: View {
    var body: some View {
        TabView {
            NavigationView {
                MainContentView()
            }
                .tag(0)
                .tabItem {
                    Text("Main")
                }

            SearchContentView()
                .tag(1)
                .tabItem {
                    Text("Search")
                }
        }
    }
}

struct MainContentView: View {
    var body: some View {
        Text("Some Content View")
            .navigationBarTitle("Travel")
    }
}

您可能会注意到，我还删除了VStackfrom .tabItem。您可以在不需要 a 的情况下将两者Text都放在Image里面，如果我没记错的话，忽略任何不存在的东西或无论如何。.tabItemVStack.tabItemTextImage

推荐阅读