标签: navigation

  • SwiftUI中如何自定义Navigation返回按钮

    iOS15+

    // 自定义的返回按钮,按照你的需求自己定制
    struct NavBackButton: View {
        let dismiss: DismissAction
        
        var body: some View {
            Button {
                dismiss()
            } label: {
                Image("...custom back button here")
            }
        }
    }
    
    // 在要使用的view下,加入如下modifier
    .navigationBarBackButtonHidden(true) // Hide default button
    .navigationBarItems(leading: NavBackButton(dismiss: self.dismiss)) // Attach custom button
    在引入了上述逻辑后,就会在child view中显示你的自定义的按钮,但同时,左滑返回的手势会失效,如果你需要保留这个手势,则还需要加入如下的代码:
    // 让使用自定义返回按钮时,左滑返回的动画不失效,同时对child view是scrollview等也需要监听drag gesture的情况做了兼容
    extension UINavigationController: UIGestureRecognizerDelegate {
        override open func viewDidLoad() {
            super.viewDidLoad()
            interactivePopGestureRecognizer?.delegate = self
        }
    
        public func gestureRecognizerShouldBegin(_ gestureRecognizer: UIGestureRecognizer) -> Bool {
            return viewControllers.count > 1
        }
    
        // To make it works also with ScrollView
        public func gestureRecognizer(_ gestureRecognizer: UIGestureRecognizer, shouldRecognizeSimultaneouslyWith otherGestureRecognizer: UIGestureRecognizer) -> Bool {
            true
        }
    }

    iOS15之前

    struct SampleDetails: View {
        @Environment(\.presentationMode) var presentationMode: Binding<PresentationMode>
    
        var btnBack : some View { Button(action: {
            self.presentationMode.wrappedValue.dismiss()
            }) {
                HStack {
                Image("ic_back") // set image here
                    .aspectRatio(contentMode: .fit)
                    .foregroundColor(.white)
                    Text("Go back")
                }
            }
        }
        
        var body: some View {
                List {
                    Text("sample code")
            }
            .navigationBarBackButtonHidden(true)
            .navigationBarItems(leading: btnBack)
        }
    }