web-dev-qa-db-fra.com

Le titre NavigationView n'apparaît pas lorsque les vues sont dans TabView dans SwiftUI

J'ai deux vues et chacune d'elles contient NavigationView avec titre. J'ai créé une vue TabBar qui a également une NavigationView dessus.

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)
}

}

J'ai essayé de masquer la barre de navigation pour cette vue, mais cela ne fonctionne pas. Seule la barre de navigation de cette vue apparaît.

C'est MainContentView()

struct MainContentView: View {

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

}

Toute idée de comment procéder. Merci!

Mise à jour: Fondamentalement, lorsque je tape sur un bouton Connexion , je passe TabBarView () via NavigationLink.

   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)

Ce faisant, il montre le TabbarView () avec des vues enfant, voici ce que je vois: L'espace au-dessus de "Travel" (navigationBarTitle du childView) est le navigationBar de la barre de tabulations depuis que je le pousse dans navigationStack.

enter image description here

iosswiftswiftuinavigationview
9
Osama Naeem

La première chose à souligner ici est que tous les modificateurs de barre de navigation que vous avez dans votre code doivent être des modificateurs sur une vue à l'intérieur de NavigationView, et non des modificateurs sur NavigationView lui-même. À partir de la documentation de .navigationBarTitle, par exemple:

Ce modificateur ne prend effet que lorsque cette vue est à l'intérieur et visible dans une NavigationView.

De plus, il n'est pas nécessaire d'avoir un NavigationView enveloppant votre TabView puis un autre à l'intérieur de votre MainContentView. Cela ne mènera qu'à des barres de navigation imbriquées, et vous ne voulez certainement pas cela. À la place, utilisez simplement un NavigationView. Je suggérerais également de ne pas mettre le NavigationView à l'intérieur du corps de MainContentView.

J'ai refactorisé votre code pour montrer de quoi je parle, même si je ne savais pas où vous essayiez d'utiliser .navigationBarBackButtonHidden et .navigationBarHidden, donc je les ai omis. Gardez juste à l'esprit qu'ils fonctionnent comme .navigationBarTitle - vous devez les utiliser comme modificateurs sur une vue à l'intérieur de NavigationView, pas sur NavigationView lui-même.

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")
    }
}

Comme vous le remarquerez peut-être, j'ai également supprimé le VStack de .tabItem. Vous pouvez mettre à la fois Text et Image dans .tabItem sans avoir besoin d'un VStack, et si je ne me trompe pas, .tabItem ignore tout ce qui n'est pas Text ou Image de toute façon.

10
graycampbell

Si vous avez besoin de la vue Connexion/Inscription avant de visualiser les onglets, n'utilisez pas NavigationView pour l'envelopper. Dans la vue Connexion/Inscription

@EnvironmentObject var authService:AuthService

var body: some View{
    ZStack{
        if(!authService.isSignedIn){
            Button(action: {
                self.authService.signIn()
            }) {
                Text("Login")
            }
        }
        else{
            TabBarView()
        }
    }
}

Dans les sous-vues, vous pouvez contrôler la variable isSignedIn avec @EnvironmentObject Et modifier cette valeur lorsque vous vous déconnectez. Voici un exemple de la TabBarView() utilisée auparavant:

var body: some View {
    TabView {
        NavigationView{
            FirstView()
        }
        .tabItem {
            VStack{
                Image("first")
                Text("First")
            }
        }
        NavigationView{
            SecondView()
        }
        .tabItem {
            VStack{
                Image("second")
                Text("Second")
            }
        }
    }
}

Cela pourrait être l'un des onglets:

@EnvironmentObject var authService:AuthService

var body: some View {
    TextView("Hello World")
    .navigationBarItems(trailing: LogOutButton(logOutFunction: authService.signOut))
}
1
Daniel Bastidas