SwiftUI 如何根据条件导航到多个可能的视图？

Posted 2023-02-24

【中文标题】SwiftUI 如何根据条件导航到多个可能的视图？

【英文标题】：SwiftUI How to Navigate to Multiple Possible Views Depending on Conditional?

【发布时间】：2020-11-16 07:37:06

【问题描述】：

创建一个学习应用程序，如果我单击选项卡提示卡、多项选择测试或练习测试，我可能想导航到三个不同的视图，但我想从一个选项卡视图中完成这一切，我有一个导航链接是变量还是取决于我单击的是提示卡、多项选择测试还是练习测试选项卡。

我也已经尝试在视频https://www.youtube.com/watch?v=sGiFR0IZCz4&t=53s 中的枚举方法中执行此操作，但无法弄清楚。

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)
    
  

【问题讨论】：

您会将您的代码作为 code 添加到问题中吗？

【参考方案1】：

你可以试试这个：

选择视图

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

标签视图

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)
    

将 Text("My Custom View 1") / 2 / 3 替换为您的目标视图。

【讨论】：

太完美了！正是我想要的。谢谢你！快速提问：Selection 类中声明了一个枚举 TabSelection，但是您在 TabsView 中设置了 var selection TabSelection。如果在一个文件中声明，枚举在所有文件之间都是可读的？ （我对编码很陌生。我认为它就像一个类/结构，你必须在另一个类中声明它才能使用它的功能）。

答案是否定的。您需要在要使用的每个视图中声明它们。我们也在 TabsView 中执行此操作，但方式略有不同。这就是我们在 SelectionView 中创建新的 TabsView 时所做的。例如，当我们创建这个 TabsView 时： TabsView(title: "Cue Card", selection: .cueCards) 我们实际上在 TabsView 中用值 ".cueCards" 声明了 "var selection"