Navigating to different views within SwiftUI

Question

In my example code below, I have two tabs and within the main tab (Tab A) there are two "buttons" on the front page to allow the user to navigate to two views (View 1 or View 2) using navigationlinks. Within each of view 1 and view 2 there are further navigation links so my code (purposefully) resets the navigation stack for each view when you switch tabs and then return to the tab. Also, if you navigate to view 1 or view 2 (while still on the main tab (tab A)), tapping the main tab button (tab A) again brings you back to the front page (which presents the two buttons). This behaviour is what I need. The problem I now have is that the navigation links (to view 1 and view 2) don't work as intended. Sometimes clicking the view 1 button takes you to view 2 and sometimes it takes you to view 1. The same happens with the view 2 button. This must have something to do with how I reset the navigation stack for my other needs, but I'm not sure how to solve this. I include some minimal code to show this. Does anyone have an idea how to solve this? Thanks

struct ContentView: View {

@State var activeView: Int = 0
@State var showNavigation: Bool = false


let items = ["View1", "View2"]


var body: some View {
    TabView(selection: Binding<Int> (
                get: {
                    activeView
                }, set: {
                    activeView = $0
                    showNavigation = false
                   
                }))
    {
        NavigationView {
                        HStack {
                            VStack {
                            NavigationLink(
                                destination: View1(), isActive: $showNavigation, label: {
                                    Rectangle()
                                        .fill(Color.red)
                                .cornerRadius(12)
                                .frame(width: 70, height: 70)
                                }).isDetailLink(false)
                                
                        Text(items[0])
                            
                            }
                            
                            VStack{
                                NavigationLink(
                                    destination: View2(), isActive: $showNavigation, label: {
                                        Rectangle()
                                            .fill(Color.red)
                                    .cornerRadius(12)
                                    .frame(width: 70, height: 70)
                                    }).isDetailLink(false)
                                    
                            Text(items[1])
                                
                            }
                            
        
            }.navigationTitle("")
            .navigationBarHidden(true)
                                      }
                                     .tabItem {
                                        Image(systemName: "a.circle")
                                                        Text("Main")
                                      }
                                      .tag(0)
                                      
                                      View3()
                                      .padding()
                                      .tabItem {
                                          Image(systemName: "b.circle")
                                          Text("View 3")
                                      }
                                      .tag(1)
                                  }

}

}

Answer 1

The problem seems to be that you're using the same showNavigation variable for both NavigationLinks.

I've changed the variable around a bit to hold an id and added a custom Binding to keep track of which NavigationLink should be active:

struct ContentView: View {
    
    @State var activeView: Int = 0
    @State var activeNavigationLink: Int = 0 //<-- Here
    
    let items = ["View1", "View2"]
    
    func navigationLinkBinding(id: Int) -> Binding<Bool> {  //<-- Here
        .init { () -> Bool in
            activeNavigationLink == id
        } set: { (newValue) in
            if newValue {
                activeNavigationLink = id
            } else {
                activeNavigationLink = 0
            }
        }
    }
    
    var body: some View {
        TabView(selection: Binding<Int> (
                    get: {
                        activeView
                    }, set: {
                        activeView = $0
                        activeNavigationLink = 0  //<-- Here
                    }))
        {
            NavigationView {
                HStack {
                    VStack {
                        NavigationLink(
                            destination: Text("View 1"), isActive: navigationLinkBinding(id: 1), label: {  //<-- Here
                                Rectangle()
                                    .fill(Color.red)
                                    .cornerRadius(12)
                                    .frame(width: 70, height: 70)
                            }).isDetailLink(false)
                        
                        Text(items[0])
                        
                    }
                    
                    VStack{
                        NavigationLink(
                            destination: Text("View 2"), isActive: navigationLinkBinding(id: 2), label: {  //<-- Here
                                Rectangle()
                                    .fill(Color.red)
                                    .cornerRadius(12)
                                    .frame(width: 70, height: 70)
                            }).isDetailLink(false)
                        
                        Text(items[1])
                        
                    }
                    
                    
                }.navigationTitle("")
                .navigationBarHidden(true)
            }
            .tabItem {
                Image(systemName: "a.circle")
                Text("Main")
            }
            .tag(0)
            
            Text("View 3")
                .padding()
                .tabItem {
                    Image(systemName: "b.circle")
                    Text("View 3")
                }
                .tag(1)
        }
        
    }
}