Displaying a NavigationBar, inside a NavigationView, inside a TabView, after a NavigationLink. SwiftUI

Question

I'm making an App in which user needs to Log In and after that take me to a TabView in which I have 3 different views (Navigation Views).

The problem is after I Log In, and use a NavigationLink to send me to the TabView, to display me the 3 different views, in which I have NavigationBarTitles; it also creates another (empty) NavigationBarTitle over mine.

Already tried to use the usual method of: Inside this individual views, eliminate the NavigationView property, as it would usually work, but not in this case.

LOGIN VIEW

import SwiftUI

struct LogInView: View {
    var body: some View {
        NavigationView {
            VStack {
                NavigationLink (destination: ContentView()) {
                    Text("Log In")
                        .foregroundColor(.white)
                        .padding(15)
                        .background(Color.blue)
                        .cornerRadius(10)
                }
            }.navigationBarTitle("Log In View")
        }
    }
}

struct LogInView_Previews: PreviewProvider {
    static var previews: some View {
        LogInView()
    }
}

TABVIEW

import SwiftUI

struct ContentView: View {
    @State private var selection = 0

    var body: some View {
        TabView(selection: $selection){

            DetailView()
                .font(.title)
                .tabItem {
                    VStack {
                        Image("first")
                        Text("First")
                    }
                }
                .tag(0)

        }.edgesIgnoringSafeArea(.top)
        .navigationBarBackButtonHidden(true)
        .navigationBarHidden(true)
    }
}

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

DETAIL VIEW

import SwiftUI

struct DetailView: View {
    var body: some View {
        NavigationView {
            List {
                Text("Hi")
                Text("Hi")
                Text("Hi")
            }.navigationBarTitle("DetailView")
        }
    }
}

struct DetailView_Previews: PreviewProvider {
    static var previews: some View {
        DetailView()
    }
}

This is how it looks

score 1 · Answer 1 · answered Nov 26 '19 at 20:47

1

A child view should not be wrapped in a NavigationView if its parent (or its parent's parent..) is wrapped in one. You simply have two NavigationViews on the photo shown, so remove the one in DetailView, it will still have on inherited from LogInView:

struct DetailView: View {
    var body: some View {
        List {
            Text("Hi")
            Text("Hi")
            Text("Hi")
        }
        .navigationBarTitle("DetailView")
    }
}

answered Nov 26 '19 at 20:47

LuLuGaGa

13,089
6
49
57

I've try this before, but the problem is that I took away the "empty NavigationBarTitle", but it doesn't display my "DetailView NavigationBarTitle" either. It just gets empty again, but with the NavigationBarTitleSpace. – Pablo Carmona Nov 27 '19 at 04:09

score 0 · Answer 2 · answered Nov 26 '19 at 17:50

You may optimize everything in ContentView not the detailView. Although the reasoning is alright in your current work, the logics behind presentation may involve some tweaks.

 struct ContentView: View {
@State private var selection = 0

var body: some View {
    TabView(selection: $selection){

        DetailView()
            .font(.title)
            .tabItem {
                VStack {
                    Image("first")
                    Text("First")
                }
            }
            .tag(0)

        }.edgesIgnoringSafeArea(.top)
        .navigationBarBackButtonHidden(true).navigationBarTitle("DetailView", displayMode: .inline).navigationBarHidden(true)

}
}


struct DetailView: View {
var body: some View {
        List {
            Text("Hi")
            Text("Hi")
            Text("Hi")
        }

}
}

The logic here is correct, but the problem is that when I add more than one "Detail View" in my "TabView" I cannot change the NavigationBarTitleText, for each "DetailView". — Pablo Carmona, Nov 27 '19 at 04:11
you can add an array for the title names: `navigationBarTitle(DetailViewNames[selection]), display: .inline)` — E.Coms, Nov 27 '19 at 04:21

Displaying a NavigationBar, inside a NavigationView, inside a TabView, after a NavigationLink. SwiftUI

2 Answers2