在 SwiftUI 的同一个视图中具有标签栏和导航栏? [英] Having Tab bar and Navigationbar in the same View in SwiftUI?

问题描述

我正在尝试学习 SwiftUI，但我想知道是否可以在同一个项目中同时拥有导航栏和标签栏?

I'm trying to learn SwiftUI and I'm wondering its possible to have both Navigation bar and a Tabbar in the same project?

我目前有一个标签栏，但我需要有一个导航栏，中间有一些按钮和徽标.

I currently have a tabbar but I need to to have a Navigation bar with some buttons and a logo in the middle.

我如何实现这一目标?

这是我当前的代码:

struct ContentView: View {
    var body: some View {
    

        
        
        TabView {
            
             NavigationView{
                 FirstView()
                
             }
             .tabItem {
                 VStack{
                    Image(systemName: "house.fill")
                    Text("Home")
                
                 }

    
             }
             
             NavigationView{
                 SecondView()
             }
             .tabItem {
                 VStack{
                     Image("second")
                     Text("Second")
                 }
             }
         }
        
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
        
    }
}

推荐答案

使用以下组件navigationBarItems、navigationBarTitle、toolbar 和 ToolbarItem

Use the following component navigationBarItems, navigationBarTitle, toolbar and ToolbarItem

struct ContentViewTab: View {
    var body: some View {
        
        TabView {
            NavigationView{
                Color.red
                    .navigationBarTitle("Home", displayMode: .inline)
                    .toolbar {
                        ToolbarItem(placement: .principal) {
                            Image(systemName: "star.fill")
                        }
                    }
                    .navigationBarItems(leading: Button("Left") {}, trailing: Button("Right") {})
            }
            .tabItem {
                VStack{
                    Image(systemName: "house.fill")
                    Text("Home")
                }
            }
            
            NavigationView{
                Color.green
                    //                    .item
                    .navigationBarTitle("Second", displayMode: .inline)
            }
            .tabItem {
                VStack{
                    Image("second")
                    Text("Second")
                }
            }
        }
        
    }
}

这篇关于在 SwiftUI 的同一个视图中具有标签栏和导航栏?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！