📜  惯性后退按钮 (1)

📅  最后修改于: 2023-12-03 15:39:37.708000             🧑  作者: Mango

惯性后退按钮介绍

惯性后退按钮是一种用户界面设计模式,它允许用户在导航视图中滑动页面时,以某种方式对应用程序历史记录进行导航。这个模式非常常见,在许多应用程序和网站上都可以找到。

通常情况下,惯性后退按钮会显示在屏幕上方的导航栏内。当用户滑动屏幕时,该按钮会根据时间和距离平滑地产生惯性效果,以提供更好的用户体验。当用户点击惯性后退按钮时,它会执行一个后退操作,并将用户带回到上一个视图或页面。

实现

在实现惯性后退按钮时,可以使用iOS中内置的导航栏或自定义导航栏。使用内置导航栏时,可以通过设置导航控制器的delegate属性来实现后退按钮的行为。例如:

class ViewController: UIViewController, UINavigationControllerDelegate {
    
    override func viewDidLoad() {
        super.viewDidLoad()
        navigationController?.delegate = self
    }
    
    func navigationController(_ navigationController: UINavigationController, didShow viewController: UIViewController, animated: Bool) {
        if let navController = navigationController as? CustomNavigationController {
            navController.enableInteractivePopGesture()
        }
    }
    
    func navigationController(_ navigationController: UINavigationController, interactionControllerFor animationController: UIViewControllerAnimatedTransitioning) -> UIViewControllerInteractiveTransitioning? {
        return interactivePopTransition
    }
    
    var interactivePopTransition: UIPercentDrivenInteractiveTransition?
    
    @objc func didPan(_ gesture: UIPanGestureRecognizer) {
        switch gesture.state {
        case .began:
            interactivePopTransition = UIPercentDrivenInteractiveTransition()
            navigationController?.popViewController(animated: true)
        case .changed:
            let translation = gesture.translation(in: gesture.view)
            let completionProgress = translation.x / UIScreen.main.bounds.width
            interactivePopTransition?.update(completionProgress)
        case .ended:
            if gesture.velocity(in: gesture.view).x > 0 {
                interactivePopTransition?.finish()
            } else {
                interactivePopTransition?.cancel()
            }
            interactivePopTransition = nil
        default:
            break
        }
    }
}

使用自定义导航栏时,可以添加一个手势识别器并在手势开始时执行后退操作。例如:

class CustomNavigationController: UINavigationController {

    var interactivePopGestureRecognizer: UIPanGestureRecognizer?

    override func viewDidLoad() {
        super.viewDidLoad()
        setupInteractivePopGesture()
    }

    func setupInteractivePopGesture() {
        interavtivePopGestureRecognizer = UIPanGestureRecognizer(target: self, action: #selector(didPan(_:)))
        view.addGestureRecognizer(interavtivePopGestureRecognizer!)
    }

    @objc func didPan(_ gesture: UIPanGestureRecognizer) {
        switch gesture.state {
        case .began:
            popViewController(animated: true)
        case .changed:
            let translation = gesture.translation(in: gesture.view)
            let completionPercentage = max(0, min(1, translation.x / view.bounds.width))
            update(completionPercentage)
        case .ended:
            if gesture.velocity(in: gesture.view).x > 0 {
                finish()
            } else {
                cancel()
            }
        default:
            break
        }
    }

}
总结

惯性后退按钮是一种流行的用户界面设计模式,它允许用户在导航视图中使用手势进行导航。在iOS中,使用内置的导航栏或自定义导航栏可以实现惯性后退按钮。无论使用哪种方式,该模式都可以提供更好的用户体验。