19.4_结合手势驱动可交互的转场动画

引入手势交互的魅力 ✨

将手势引入转场动画，无疑是提升用户体验的关键一步。想象一下，用户可以通过滑动屏幕来控制视图的出现或消失，这种直观的交互方式令人惊叹！这不仅让应用感觉更流畅，也赋予了用户更多的掌控感。

交互式转场动画的核心概念

交互式转场动画的核心在于 UIPercentDrivenInteractiveTransition。这个类允许你根据手势的进度来驱动动画的完成度。例如，当用户滑动屏幕时，你可以将滑动的距离转换为动画的百分比，从而实现动画的实时控制。这就像拥有一个动画的“油门踏板”！⛽️

实现步骤概览

要实现手势驱动的交互式转场动画，你需要遵循几个关键步骤。这包括设置手势识别器、实现交互式转场对象，并将其与你的自定义转场动画结合起来。

1. 添加手势识别器：首先，你需要为你的视图控制器添加一个手势识别器，例如 UIScreenEdgePanGestureRecognizer 或 UIPanGestureRecognizer。
2. 创建交互式转场对象：实例化 UIPercentDrivenInteractiveTransition 的子类，并将其作为你的交互控制器。
3. 更新动画进度：在手势识别器的回调方法中，根据手势的移动距离来更新交互式转场对象的进度。

编写手势驱动的转场代码

让我们深入了解如何编写代码。假设你正在创建一个自定义的 Present 动画。

class InteractiveTransition: UIPercentDrivenInteractiveTransition {
    var shouldComplete = false
    var viewController: UIViewController!

    func attach(to viewController: UIViewController) {
        self.viewController = viewController
        let gesture = UIScreenEdgePanGestureRecognizer(target: self, action: #selector(handleGesture(_:)))
        gesture.edges = .left
        viewController.view.addGestureRecognizer(gesture)
    }

    @objc func handleGesture(_ gesture: UIScreenEdgePanGestureRecognizer) {
        let translation = gesture.translation(in: gesture.view)
        let percent = translation.x / gesture.view!.bounds.width
        
        switch gesture.state {
        case .began:
            // 开始交互
            break
        case .changed:
            update(percent)
        case .ended:
            shouldComplete = percent > 0.5
            if shouldComplete {
                finish()
            } else {
                cancel()
            }
        case .cancelled:
            cancel()
        default:
            break
        }
    }
}

在上面的代码中，handleGesture 方法是核心。它根据手势的 translation.x 计算出动画的完成百分比。当手势结束时，如果滑动距离超过一半，动画就会完成；否则，它将取消。这种精细的控制让用户体验达到了一个新的高度！🚀

结合自定义转场动画

最后一步是将这个交互式转场对象与你的自定义转场动画结合起来。在你的 UIViewControllerTransitioningDelegate 或 UINavigationControllerDelegate 中，你需要提供这个交互式转场对象。

func interactionControllerForDismissal(using animator: UIViewControllerAnimatedTransitioning) -> UIViewControllerInteractiveTransitioning? {
    return interactiveTransition.shouldComplete ? nil : interactiveTransition // 只有在未完成时才返回交互控制器
}

通过这种方式，当用户开始手势时，系统会询问你是否提供一个交互控制器。如果提供了，动画就会由你的手势来驱动。这使得你的应用变得异常灵活和响应迅速。

提升用户体验的秘诀 🌟

交互式转场动画不仅仅是技术实现，更是用户体验的艺术。研究表明，具有流畅交互的应用能显著提升用户满意度，甚至可以提高用户留存率达 20%！通过手势驱动，你让用户感觉他们是应用的一部分，而不是旁观者。这种沉浸感是现代应用设计的精髓。继续探索，你会发现更多令人兴奋的可能性！