【问题标题】:How to switch between views using @State and fullScreenCover in SwiftUI如何在 SwiftUI 中使用 @State 和 fullScreenCover 在视图之间切换
【发布时间】:2021-02-12 15:55:46
【问题描述】:

我试图弄清楚如何在 SwiftUI 中使用 @State 和 fullScreenCover 在视图之间切换

我有一个主视图和 2 个简单视图(View1View2)。 View1 必须在点击"Show view 1" 按钮时打开,View2"Show view 2" 按钮上键入时打开。我还为此创建了 2 个@State 变量,并使用.View1ActiveFullscreenview 枚举)对其进行了初始化:

 @State private var showFullscreenView = false
 @State private var activeFullscreenView: ActiveFullscreenView = .View1

问题在于,即使我点击Show view 2 按钮,它也会不断显示View1。 我认为当点击按钮并将 activeFullscreenView 变量的值设为 .View2 时,它应该更改变量并显示 fullScreenView

我以为是因为我调用了showFullscreenView,它改变了变量,之后默认值为.View1,所以它没有改变它。

也试过了:

 self.showFullscreenView = true
 self.activeFullscreenView = .View2
          

第二个假设是我不应该给这个变量初始值。但在这种情况下,它添加了一些不方便的额外初始化代码:

 @State private var activeFullscreenView: ActiveFullscreenView = .View1 

目前,我有以下代码存在所描述的问题:

import SwiftUI

struct MainView: View {
    
    enum ActiveFullscreenView {
        case View1, View2
    }
    
    @State private var showFullscreenView = false
    @State private var activeFullscreenView: ActiveFullscreenView = .View1
    
    var body: some View {
        
        ZStack {
            
            VStack {
            
            // Button to show View 1 in FullScreen
            Button("Show view 1", action: {
                
                self.activeFullscreenView = .View1
                self.showFullscreenView = true
               
            })
            
            // Button to show View 2 in FullScreen
            Button("Show view 2", action: {
                
                self.activeFullscreenView = .View2
                self.showFullscreenView = true
               
            })
                
            }
            
        }
        .fullScreenCover(isPresented: $showFullscreenView) {
            
            switch self.activeFullscreenView {
            case .View1:
                
                Text("View1")
       
            case .View2:
                
                Text("View2")
             
            }
            
        }
        
    }
}

struct MainView_Previews: PreviewProvider {
    static var previews: some View {
        MainView()
    }
}

任何与解决问题相关的帮助表示赞赏。关于如何实现使用 fullscreenCover 显示单独视图的相同结果的便捷方法表示赞赏。

使用 Xcode 12.4,最新的 iOS 14

【问题讨论】:

  • 这是否回答了您的问题stackoverflow.com/a/65480211/12299030? (你需要fullScreenCover(item:...
  • @Asperi 嗨,谢谢。我试过了,但出错了,无法正确实现。根据您的示例,我尝试创建 @State var selectedFullscreenView: ActiveFullscreenView? 并使用 .fullScreenCover(item: $selectedFullscreenView) { _ in switch selectedFullscreenView { case .View1: Text("View1") case .View2: Text("View2") }} 但出现错误:Instance method 'fullScreenCover(item:onDismiss:content:)' 要求 'MainView.ActiveFullscreenView' 符合 'Identifiable ' .
  • 你必须让ActiveFullScreenView Identifiable - 在这个问题的回答中查看我是如何做到ActiveSheet 的:stackoverflow.com/questions/66162219/… 如果你需要更多,请告诉我
  • 感谢@jnpdx,您的链接帮助很大

标签: swift swiftui xcode12 swiftui-environment swiftui-state


【解决方案1】:

在提供的@jnpdx 的帮助下 This Answer that is Similar to My problem 问题解决了。这是代码。只要 fullScreenCover 和 sheet 都是模态的,我就将枚举重命名为 ModalView:

struct MainView: View {
    
    // enum to decide which view to present:
    enum ModalView: String, Identifiable { // Identifiable
        
        case View1, View2
        
        var id: String {
            return self.rawValue
        }
    }
    
    @State var activeModalView : ModalView? = nil
    
    var body: some View {
        
        ZStack {
            
            VStack {
                
                // Button to show View 1
                Button("Show view 1", action: {
                    
                    self.activeModalView = .View1
                    
                })
                
                // Button to show View 2
                Button("Show view 2", action: {
                    
                    self.activeModalView = .View2
                    
                })
                
            }
            
        } // use fullScreenCover or sheet depending on your needs
        .fullScreenCover(item: $activeModalView) { activeModalValue in
            
            switch activeModalValue {
            case .View1:
                
                Text("View1")

            case .View2:
                
                Text("View2")
                
            }
        }
        
    }
    
}

【讨论】:

  • 很高兴它对你有用 - 如果你觉得它有帮助但你还没有,你可以投票给我指出你的答案
  • @jnpdx 已经投票了,再次感谢您的快速帮助!!!
  • @jnpdx btw 还检查了您的音乐和应用程序,干得好!我也有点喜欢音乐,下载一些你的音乐应用程序在我的音乐制作程序中使用。坚持下去
  • 哇 -- 非常感谢您查看它们!
猜你喜欢
  • 1970-01-01
  • 2021-03-06
  • 1970-01-01
  • 1970-01-01
  • 2020-03-27
  • 2018-07-19
  • 2011-09-26
  • 2014-01-31
  • 2020-04-01
相关资源
最近更新 更多