隐式动画与显式动画 (Implicit & Explicit Animations)

模块：六 - 动画系统
预计阅读时间：25 分钟

---

前言

Flutter 的动画系统是其最令人着迷的特性之一。与其他框架不同，Flutter 从底层设计了一套完整的动画架构，将"动画是什么"（描述层）与"动画如何运行"（执行层）完全分离。

理解 Flutter 动画的第一步，是搞清楚两大阵营的边界：

• 隐式动画（Implicit Animations）：你只需要改变目标值，Flutter 自动处理过渡
• 显式动画（Explicit Animations）：你完全掌控动画的播放、暂停、反转和每一帧的值

本文从底层机制出发，彻底讲透这两套系统的设计哲学、实现原理与最佳实践。

---

一、动画的底层基础：Ticker 与 vsync

在讲隐式/显式动画之前，必须先理解 Flutter 动画的驱动力。

1.1 Ticker：帧回调的原始驱动

Ticker 是 Flutter 动画的最底层机制。每一帧屏幕刷新时，Ticker 会触发一次回调，传入自上次开始以来的 Duration：

class MyWidget extends StatefulWidget { ... }

class _MyWidgetState extends State<MyWidget> {
  late Ticker _ticker;
  Duration _elapsed = Duration.zero;

  @override
  void initState() {
    super.initState();
    // 直接使用 Ticker（通常你不需要这样做）
    _ticker = Ticker((elapsed) {
      setState(() {
        _elapsed = elapsed;
      });
    });
    _ticker.start();
  }

  @override
  void dispose() {
    _ticker.dispose(); // 必须释放！
    super.dispose();
  }
}

关键理解：Ticker 只是一个计时器，它本身不知道什么是"动画值"。AnimationController 正是在 Ticker 之上构建的，它将 elapsed 时间映射到 [0.0, 1.0] 的进度值。