使用与 iOS13 兼容的 SwiftUI 放置自定义按钮以在屏幕之间返回

Question

我想创建自己的按钮，允许我在不使用默认 NavigationBar 的情况下返回上一个屏幕，做研究我看到有人使用 @Environment 但它与 iOS 13 不兼容，我还需要一个功能允许我制作 x 数量的屏幕

这就是我所拥有的：

struct KnowMoreView: View {
  // MARK: - PROPERTY
  
  // MARK: - BODY
    var body: some View {
      ZStack {
        Color.white
          .edgesIgnoringSafeArea(.top)
        Color(UIColor.ray239)
          .edgesIgnoringSafeArea(.bottom)
        VStack {
          LabeledHeaderView(label: "know_more_about_us".localized, showBackButton: true) {
            // Here goes the back method
          }
          Divider()
            .frame(height: 2)
            .overlay(Color("gray151"))
            .padding(.top, -10)
          Image("knowMore")
            .resizable()
            .scaledToFit()
            .padding(.horizontal, 16)
            .padding(.top, 12)
            .cornerRadius(24)
          
          Text("explore_my_fund".localized.uppercased())
            .foregroundColor(Color("gray143"))
            .font(.custom(Fonts.GothamMedium.rawValue, size: 24))
            .padding(.top, 12)
          
          HStack {
            Spacer()
            
            SquareButton(label: "who_we_are".localized, image: "whoWeAre", action: {
              
            })
            
            Spacer()
            
            SquareButton(label: "faqs".localized, image: "faqs", action: {
              
            })
            
            Spacer()
            
            SquareButton(label: "our_products".localized, image: "ourProducts", action: {
              
            })
            
            Spacer()
            
          }
          .padding(.top, 12)
          
          Spacer()
        }
      }
      .navigationBarBackButtonHidden(true)
      .background(BackButtonHandler { })
    }
}

标题：

struct LabeledHeaderView: View {
  
  // MARK: - PROPERTY
  let label: String
  var showBackButton: Bool
  let action: () -> Void
  
  // MARK: - BODY
    var body: some View {
      ZStack {
        Color.white
          .edgesIgnoringSafeArea(.all)
        
        VStack {
          
          Image("fullLogo")
            .resizable()
            .scaledToFit()
            .frame(width: 270)
            .padding(.bottom, 18)
            .padding(.top, 6)
          
          HStack {
            if showBackButton {
              Button(action: {
                action()
              }) {
                Image(systemName: "chevron.left")
                  .resizable()
                  .foregroundColor(Color("gray81"))
                  .aspectRatio(contentMode: .fit)
                  .frame(width: 20, height: 20)
                
              }
              .padding(.leading, 16)
              .padding(.trailing, -30)
            } else {
              Spacer()
            }
            
            Spacer()
            
            Text(label)
              .foregroundColor(Color("gray81"))
              .font(.custom(Fonts.AtleticoRegular.rawValue, size: 20))
              .bold()
            Spacer()
          }
          .padding(.bottom, 18)
        }
      }
      .frame(height: 120)
    }
}

Answer 1

请参考以下代码，

 struct KnowMoreView: View {

    @Environment(\.dismiss) private var dismiss

    var body: some View {
        ZStack {
             Color.white
              .edgesIgnoringSafeArea(.top)
        Color(UIColor.ray239)
          .edgesIgnoringSafeArea(.bottom)
        VStack {
          LabeledHeaderView(label: "know_more_about_us".localized, showBackButton: true) {
            // Here goes the back method
          }
          Divider()
            .frame(height: 2)
            .overlay(Color("gray151"))
            .padding(.top, -10)
          Image("knowMore")
            .resizable()
            .scaledToFit()
            .padding(.horizontal, 16)
            .padding(.top, 12)
            .cornerRadius(24)
          
          Text("explore_my_fund".localized.uppercased())
            .foregroundColor(Color("gray143"))
            .font(.custom(Fonts.GothamMedium.rawValue, size: 24))
            .padding(.top, 12)
          
          HStack {
            Spacer()
            
            SquareButton(label: "who_we_are".localized, image: "whoWeAre", action: {
              
            })
            
            Spacer()
            
            SquareButton(label: "faqs".localized, image: "faqs", action: {
              
            })
            
            Spacer()
            
            SquareButton(label: "our_products".localized, image: "ourProducts", action: {
              
            })
            
            Spacer()
            
          }
          .padding(.top, 12)
          
          Spacer()
        }
      }
      .navigationBarBackButtonHidden(true)
      .navigationBarItems(leading: backButton)
    }

}

    var backButton: some View {
            Button(action: {
                self.dismiss()
            }) {
                HStack(spacing: 0) {
                    Image(systemName: "chevron.left")
                        .foregroundColor(.white)
                    Text("Back")
                        .foregroundColor(.white)
                        .padding(.leading, 2)
                }
                .padding(.leading, -4.0)
            }
        }
    }
    
    }