如何在SwiftUI中添加自定义导航栏后退按钮

时间:2020-01-11 05:36:46

标签: ios swift swiftui

我一直在尝试查找如何在SwiftUI中添加自定义导航栏后退按钮,但是却出现了这种奇怪的现象,即默认行为仍然在显示自定义按钮之前出现。有谁知道添加它的正确方法?

这是我尝试过的。

var body: some View {
        NavigationView {
            ZStack {
               Color.background.edgesIgnoringSafeArea(.all)
               NavigationLink(destination: UserDetailsView()) {
                        Text("Continue")
                            .foregroundColor(.background)
                            .font(.title)
                            .fontWeight(.semibold)
                    }
                    .frame(width: 250, height: 60, alignment: .center)
                    .background(Color.white)
                    .cornerRadius(40)
                    .padding(.top, 50)
            }
            .navigationBarTitle("", displayMode: .automatic)
            .navigationBarHidden(true)
        }
      }

在这里,当我使用以下代码隐藏后退按钮时,它甚至根本不会隐藏。

.navigationBarBackButtonHidden(true)

在详细信息屏幕中

  var body: some View {
        NavigationView {
            VStack {
                ZStack {
                    Rectangle()
                        .foregroundColor(.clear)
                        .background(gradient)
                        .edgesIgnoringSafeArea(.all)

                    Text("Hello")
                }
            }
            .navigationBarItems(leading: BackButton(presentationMode: presentationMode))
        }
    }

自定义后退按钮如下所示

struct BackButton: View {
    var presentationMode : Binding<PresentationMode>

    var body: some View {
        Button(action: {
            self.presentationMode.wrappedValue.dismiss()
        }) {
            HStack {
                Image(Icon.leftArrow)
                    .aspectRatio(contentMode: .fit)
                    .foregroundColor(.black)
            }
        }
    }
}

这是它的样子 enter image description here

3 个答案:

答案 0 :(得分:3)

以下配置有效(已通过Xcode 11.2 / iOS 13.2测试)

var body: some View {
  NavigationView {
      ZStack {
         // ...
         NavigationLink(destination:
                           UserDetailsView()
                               .navigationBarTitle("", displayMode: .inline)
                               .navigationBarHidden(true)
         ) {
                    // ...
           }
      }
      .navigationBarTitle("", displayMode: .inline)
      .navigationBarHidden(true)
      .navigationBarBackButtonHidden(true)
  }
}

答案 1 :(得分:3)

感谢您的提示。它对我有用。...添加

之后
.navigationBarItems(leading:  ... 

后退滑动不再有效。 我猜这是SwiftUI中的错误吗?

有人找到了解决方法吗?

答案 2 :(得分:0)

这对我来说很好

struct SettingsChoiseView: View {
    @Environment(\.presentationMode) var presentationMode
    var body: some View {
        List{
            ....
        }
            .navigationBarBackButtonHidden(true)
            .navigationBarItems(leading:
                    Button(action: goBack) {
                        HStack {
                            Image(systemName: "arrow.left.circle")
                            Text("Select session")
                        }                       
                    }
                ) 
    }
    func goBack(){
        //here I save CoreData context if it changes
        self.presentationMode.wrappedValue.dismiss()
    }
}