SwiftUI How to Navigate to Multiple Possible Views Depending on Conditional?

Question

Creating a Study App, if I click on the tabs Cue Card, Multiple Choice Test, or Practice Test I want to navigate to three different views possibly but I want to do that all from one Tab View where I have a navigationLink that is a variable or something that depends on whether I clicked the tab Cue Card, Multiple Choice Test, or Practice Test.

I also already tried doing this in the enum method from the video https://www.youtube.com/watch?v=sGiFR0IZCz4&t=53s but could not figure it out.

import SwiftUI

struct SelectionView: View {
    
var body: some View {
    NavigationView{
        VStack {
            TabsView(selection: "Cue Cards")
            TabsView(selection: "Multiple Choice")
            TabsView(selection: "Practice Test")
            

        }.navigationBarBackButtonHidden(true)
        
    }
    
    
}





struct SelectionView_Previews: PreviewProvider {
    static var previews: some View {
        Group {
            SelectionView().previewDevice("iPhone 8")
            SelectionView().previewDevice("iPhone 11 Pro")
            SelectionView().previewDevice("iPhone 11 Pro Max")
            
        }
    }
   }
}
import SwiftUI


struct TabsView: View {

@State private var isActive = false
 var selection = ""

var body: some View {

    VStack{
        //WANT CUECARDCATEGORYVIEW() TO BE A VARIABLE OR SOMETHING THAT CAN 
 LEAD TO CUE CARD VIEW, MULTIPLE CHOICE TEST VIEW, OR PRACTICE TEST VIEW.
        NavigationLink(destination: CueCardCategoryView(), isActive: 
$isActive)
        {
            Button(action: {isActive = true }) {
                HStack{
                    Text("\(selection)")
                        .font(.system(size: 28, weight: .semibold))
                        .multilineTextAlignment(.center)
                    Spacer()
                }
            }
        }.buttonStyle(PrimaryButtonStyle(fillColor: .primaryButton))
        
    }.padding(15)
}

}

struct TabsView_Previews: PreviewProvider {
static var previews: some View {
    NavigationView{
        TabsView()
    }.environment(\.colorScheme, .dark)
    .environment(\.colorScheme, .light)
    
  }
}

Answer 1

You can try this:

SelectionView

enum TabSelection {
    case cueCards, multipleChoice, practiceTest
}

struct SelectionView: View {
    
    var body: some View {
        NavigationView {
            VStack {
                TabsView(title: "Cue Card", selection: .cueCards)
                TabsView(title: "Multiple Choice", selection: .multipleChoice)
                TabsView(title: "Practice Test", selection: .practiceTest)
                
            }.navigationBarBackButtonHidden(true)
        }
    }
    
    
    struct SelectionView_Previews: PreviewProvider {
        static var previews: some View {
            Group {
                SelectionView().previewDevice("iPhone 8")
                SelectionView().previewDevice("iPhone 11 Pro")
                SelectionView().previewDevice("iPhone 11 Pro Max")
            }
        }
    }
}

Tabs View

import SwiftUI


struct TabsView: View {
    @State private var isActive = false
    var title: String
    var selection: TabSelection
    
    var body: some View {
        
        switch selection {
        case .cueCards:
            NavigationLink(destination: Text("My Custom View 1"), isActive: $isActive, label: {
                HStack{
                    Text(title)
                        .font(.system(size: 28, weight: .semibold))
                        .multilineTextAlignment(.center)
                    Spacer()
                }
            })
        case .multipleChoice:
            NavigationLink(destination: Text("My Custom View 2"), isActive: $isActive, label: {
                HStack{
                    Text(title)
                        .font(.system(size: 28, weight: .semibold))
                        .multilineTextAlignment(.center)
                    Spacer()
                }
            })
        case .practiceTest:
            NavigationLink(destination: Text("My Custom View 3"), isActive: $isActive, label: {
                HStack{
                    Text(title)
                        .font(.system(size: 28, weight: .semibold))
                        .multilineTextAlignment(.center)
                    Spacer()
                }
            })
        }
    }
}


struct TabsView_Previews: PreviewProvider {
    static var previews: some View {
        NavigationView{
            TabsView(title: "Cue Card", selection: .cueCards)
        }.environment(\.colorScheme, .dark)
        .environment(\.colorScheme, .light)
    }
}

Replace the Text("My Custom View 1") / 2 / 3 with your destination views.