SwiftUI-如何使用关闭按钮从其中的第二个视图关闭伪模态视图?

时间:2020-08-09 20:46:50

标签: swift swiftui

我的设计很棘手。我正在尝试关闭一个按钮,该按钮可以从“假”模态视图(由于我在网上找到的代码而全屏显示,由于全假)导致的所有视图关闭模态视图。 现在,关闭按钮在模态视图中打开的第一个视图中起作用,但是我需要它在模态视图的下一个视图中也起作用,因为我在该模态视图中有一个流程可以创建一个项目。

这是我从中启动ColorNewItemView(我的假模态视图)的视图。

struct RecapItemToAdd: View {

  @State var isPresented: Bool = false

    var body: some View {
      NavigationView {
        
        VStack {
            
            Button(action: { withAnimation { self.isPresented.toggle()}}) {
            Image(systemName: "pencil")
                .resizable()
                .renderingMode(.original)
                .frame(width: 13, height: 17)
                .foregroundColor(UIManager.hLightGrey)
            }

        }
        
        ZStack {
             VStack(alignment: .leading) {
                 ColorNewItemView(isPresenteded: self.$isPresented)

                 Spacer()
               }


         }
         .background(Color.white)
         .edgesIgnoringSafeArea(.all)
         .offset(x: 0, y: self.isPresented ? 0 : UIApplication.shared.keyWindow?.frame.height ?? 0)
    }

   }
 
}

注意:我知道“ keyWindow”已被弃用,但我不知道如何更改它。

使用ColorNewItemView启动我的全屏模式视图。在此视图中,关闭按钮起作用。

   struct ColorNewItemView: View {

   @State var selection: Int? = nil

   @Binding var isPresenteded: Bool

      var body: some View {
      NavigationStackView {
         VStack(alignment: .center) {

          Button(action: {
                  self.isPresenteded = false
              }) {
                  Image(systemName: "xmark.circle.fill")
                  .resizable()
                  .frame(width: 30, height: 30)
                  .foregroundColor(UIManager.hBlueLight)
              }
    
    Text("First View")
            .font(UIManager.einaTitle)
            .foregroundColor(UIManager.hDarkBlue)
    
    
    Image("black-hoodie")
    .resizable()
    .renderingMode(.original)
    .frame(width: 245, height: 300)
    
    PushView(destination: Color2NewItemView(isPresenteded: self.$isPresenteded), tag: 1, selection: $selection) {
                  
                 Button(action: {self.selection = 1}) {
                 Text("Avanti")
                      .font(UIManager.einaButton)
                      .foregroundColor(.white)
                      .frame(width: 291, height: 43)

                      .background(UIManager.buttonGradient)
                      .cornerRadius(6)
                      .shadow(color: UIManager.hBlueShadow, radius: 7, x: 0.0, y: 6.0)
                 }
              }

        }
    }
  }
 }

现在,我在“模态”视图中有了下一个视图,其中“关闭”按钮开始停止工作。

    struct Color2NewItemView: View {

    @Binding var isPresenteded: Bool
    @State var selection: Int? = nil

    var body: some View {
      VStack(alignment: .center) {


                 Button(action: {
                       self.isPresenteded = false
                   }) {
                       Image(systemName: "xmark.circle.fill")
                       .resizable()
                       .frame(width: 30, height: 30)
                       .foregroundColor(UIManager.hBlueLight)
                   }

        Text("Second View")
                .font(UIManager.einaTitle)
                .foregroundColor(UIManager.hDarkBlue)


        Image("black-hoodie")
            .resizable()
            .renderingMode(.original)
            .frame(width: 245, height: 300)


        PushView(destination: FabricNewItemView(isPresenteded: $isPresenteded), tag: 1, selection: $selection) {

                         Button(action: {self.selection = 1}) {
                         Text("Tessuto")
                              .font(UIManager.einaButton)
                              .foregroundColor(.white)
                              .frame(width: 291, height: 43)

                              .background(UIManager.buttonGradient)
                              .cornerRadius(6)
                              .shadow(color: UIManager.hBlueShadow, radius: 7, x: 0.0, y: 6.0)
                         }
        }

                        Spacer()
                        .frame(height: 18)


                    PopView{
                        Text("Back")
                        .font(UIManager.einaBodySemibold)
                        .foregroundColor(UIManager.hGrey)
                    }

        }
    }
}

Ps。 我还必须使用一个名为NavigationStack的库,因为我在页面底部有一个自定义的后退按钮,并且导航视图不允许我在不使用导航栏中的后退的情况下弹出。

1 个答案:

答案 0 :(得分:1)

绑定可能会在深度视图层次结构上丢失,因此更适合在接收级别上对其进行操作。

以下是使用EnvironmentKey的方法(与presentationMode的想法相同)

介绍包含一些结束符的帮助程序环境键

struct DismissModalKey: EnvironmentKey {

    typealias Value = () -> ()
    static let defaultValue = { }
}

extension EnvironmentValues {
    var dismissModal: DismissModalKey.Value {
        get {
            return self[DismissModalKey.self]
        }
        set {
            self[DismissModalKey.self] = newValue
        }
    }
}

因此,在顶部模式视图中,您可以注入层次结构回调以关闭

struct ColorNewItemView: View {

   @State var selection: Int? = nil
   @Binding var isPresented: Bool

   var body: some View {
      NavigationStackView {
          // ... other code
      }
      .environment(\.dismissModal, { self.isPresented = false} )   // << here !!
   }
}

此环境值现在可用于所有子视图,您可以将其用作

struct Color2NewItemView: View {
   @Environment(\.dismissModal) var dismissModal
   
   @State var selection: Int? = nil

   var body: some View {
      VStack(alignment: .center) {
          Button(action: {
              self.dismissModal()       // << here !!
          }) {
      
      // ... other code
   }
}