SwiftUI中如何让TabBar与NavigationBar在同一视图共存？

你的问题出在标签页配置的位置错误：原代码里把.tag和.tabItem加在了CustomTableView上，但它们应该直接修饰TabView的子视图（也就是NavigationView）。TabView只会识别直接子视图上的标签配置，内部视图的配置不会生效，导致TabBar无法正常渲染。

修正后的代码 #

var body: some View {
    TabView(selection: $selectedTab) {
        // 每个标签页是一个独立的NavigationView
        NavigationView {
            CustomTableView(lang: $lang)
                .navigationBarTitleDisplayMode(.inline)
                .toolbar {
                    ToolbarItem(placement: .principal) {
                        Text("Title")
                            .font(.title)
                    }
                    
                    ToolbarItem(placement: .navigationBarTrailing) {
                        Image(Constants.logoImage)
                            .resizable()
                            .scaledToFit()
                            .frame(width: 100, height: 50)
                    }
                }
        }
        .tag(0) // 把tag移到NavigationView上
        .tabItem { // 把tabItem移到NavigationView上
            Text("Home")
            Image(systemName: "house.fill")
        }
        
        // 可继续添加其他标签页，每个都用NavigationView包裹
        NavigationView {
            Text("Second Tab")
        }
        .tag(1)
        .tabItem {
            Text("Profile")
            Image(systemName: "person.fill")
        }
    }
}

关键修改说明 #

• 标签配置上移：.tag和.tabItem必须直接作用于TabView的直接子视图（这里是NavigationView），TabView才能识别并渲染对应的TabBar项。
• NavigationView内部配置：导航栏的标题、工具栏等修饰符，需要加在NavigationView内部的内容视图上（比如CustomTableView），确保导航栏正常显示。

调整后，TabBar会显示在屏幕底部，每个标签页的NavigationBar会在顶部正常渲染，两者可以同时存在。

内容的提问来源于stack exchange，提问作者Aviram Netanel