SwiftUI Nested NavigationView navigationBar disappears

Question

I have a three views which are lists. struct MainMenuView: View { @EnvironmentObject var dataModel: DM

var body: some View {

    return NavigationView{
        List {
            Matchup()
            GameSettings()
            EnteringGame()
        }
    }
}

Inside Matchup()

struct Matchup: View {
@EnvironmentObject var dataModel: DM    

var body: some View {
    Section(header: Text("MATCH-UP")
        .fontWeight(.heavy)
        .foregroundColor(Color("TPLightGrey"))
    ) {
        NavigationLink(destination: TrendSingleSelect(
            title: .constant("TEAM"),
            col: .constant(self.dataModel.queryColumnTeam1),
            items: .constant(self.dataModel.team1Values) ,
            selection: self.$dataModel.team1ListValue
        )) {
            HStack {
                Text("TEAM")
                Spacer()
                if dataModel.team1ListValue.count == 0 {
                    Text("IS ANY").foregroundColor(Color("TPLightGrey"))
                } else {
                    Text( self.dataModel.team1ListValue.joined(separator: ", ")).foregroundColor(Color("TPOrange"))
                }
            }
        }


    }
    .listRowBackground(Color("TPDarkGrey"))
    .font(.system(size: 14))
    .navigationBarTitle("", displayMode: .inline)
    .navigationBarHidden(true)
}

}

Notice that I hide theNavBar. I want to push in a nav when the user tabs a row.: Here is the final view:

var body: some View {

    return VStack  {

        List {
            ForEach(self.items, id: \.self) { item in
                SingleSelectionRow(title: item, isSelected: self.selection.contains(item)) {

                    if self.selection.contains(item) {
                        self.selection = []
                    }
                    else {
                        self.selection = [item]

                    }
                    self.queryCallback()
                }
                .listRowBackground(Color("TPDarkGrey"))
            }//ForEach
        }//list
            .font(.system(size: 14))
    }

    .navigationBarHidden(false)
    .navigationBarTitle(title)
    .navigationBarItems(trailing:
        Button(action: {
               // Actions
                self.reset()
           }, label: {
            Text("Clear")
            }
        )
    )

}

What happens is: That when I tap the sell, I push in that section. However, when it pushes in, I see the navBar, then it gets collapsed. However,when I then tap anything in the view to trigger the view reload, it shows up.

What is causing the navbar collapse?

score 0 · Answer 1 · answered Dec 16 '19 at 23:09

try this code in MatchupView:

struct Matchup: View {
@EnvironmentObject var dataModel: DM    

var body: some View {
NavigationView {            // attention hear************
    Section(header: Text("MATCH-UP")
        .fontWeight(.heavy)
        .foregroundColor(Color("TPLightGrey"))
    ) {
        NavigationLink(destination: TrendSingleSelect(
            title: .constant("TEAM"),
            col: .constant(self.dataModel.queryColumnTeam1),
            items: .constant(self.dataModel.team1Values) ,
            selection: self.$dataModel.team1ListValue
        )) {
            HStack {
                Text("TEAM")
                Spacer()
                if dataModel.team1ListValue.count == 0 {
                    Text("IS ANY").foregroundColor(Color("TPLightGrey"))
                } else {
                    Text( self.dataModel.team1ListValue.joined(separator: ", ")).foregroundColor(Color("TPOrange"))
                }
            }
        }


    }
    .listRowBackground(Color("TPDarkGrey"))
    .font(.system(size: 14))
}                // attention hear************
    .navigationBarTitle("", displayMode: .inline)
    .navigationBarHidden(true)
}

score 0 · Answer 2 · answered Apr 09 '21 at 18:14

I couldn't compile your project, so I assume the following solution:

You can bind navigationBarHidden to variable, so that you can change the value under certain conditions. Like this: .navigationBarHidden($onOff)

struct ContentView: View {
    @State var onOff = false
    
    var body: some View {
        
        NavigationView {
            Button("Button") {
                self.onOff.toggle()
            }
            .navigationBarTitle(Text("Events"), displayMode: .inline)
            .navigationBarHidden($onOff.wrappedValue)
        }
        // that means only show one view at a time no matter what device I'm working
        .navigationViewStyle(StackNavigationViewStyle())
    }
}

score -1 · Answer 3 · answered Oct 10 '19 at 20:40

-1

Arrrgh... this was unnecessary: .navigationBarHidden(true) in MatchupView

answered Oct 10 '19 at 20:40

jimijon

2,046
1
20
39

SwiftUI Nested NavigationView navigationBar disappears

3 Answers3