最近顺手整理了一个 Flutter 动画 Demo，代码放在。一开始的想法很简单，就是把平时常见的几类动画能力串一下做一个方便自己回看的小页面：隐式动画、显式动画、交织动画、AnimatedWidgetHero再顺手补一点自定义曲线和自绘的内容。

说到痛点。面试里的“到底谁在驱动”

写着写着发现，这种 Demo 还挺适合拿来复盘面试题。因为 Flutter 动画这件事，表面上看是在用几个组件。考得往往不只是“会不会写一个 AnimatedContainer”。面试里更常见的问题 usually 是：

• 动画是谁在驱动的？
• Tween、Curve、AnimationController 分别在做什么？
• 隐式动画和显式动画怎么选？
• AnimatedBuilder 和 AnimatedWidget 差别在哪里？
• Hero 为什么能跨页面飞起来？
• 自定义动画为什么容易在边界条件上踩坑？

如果你现在正准备面试，这些问题往往会让你抓狂；按理说，如果你只想快速达到效果，却又不想被细节绊倒，也会感到无从下手。

先别急着记组件，先理解“时间-数值-映射”三层结构

I now prefer to think of Flutter animation as three layers:

1. 时间提供者：Ticker & AnimationController
2. 数值变化：Tween / Curve / CurvedAnimation / Interval
3. 界面映射：Transform / Opacity / Container / CustomPainter / Hero 等展示层组件

This perspective turns seemingly unrelated APIs into a coherent pipeline:

• The controller drives a global progress value.
• Tweens map that progress into specific values .
• The Curve shapes pace .
• The widget draws current value.

隐式动画的观点是。 让“自然过渡”变成默认行为

再看适用场景，

• 卡片展开/收起；按钮高亮切换，小元素位置移动；文本字号或颜色轻量变化，

隐式动画不需要你手动管理 TickerMixin/AnimationController;只要把属性改成新的值，框架就帮你插值并驱动 UI。它的价值不是功能弱，而是省心省力、代码短小且易于维护。

选择建议这方面。

如果你只关心结果，不需要暂停、反向或监听进度，那么隐式动画是第一选择。 它让业务代码保持简洁，同时降低认知成本。只有当你需要更细粒度的控制时再考虑显式方案。

说到显式动画，真正接触 Flutter 动画骨架

A typical explicit demo I built demonstrates interleaved animations: scale,rotation,translation,color change and opacity—all driven by a single AnimationController。split via Tween + Interval + CurvedAnimation.

P.S. 如果所有属性都跟随同一条线性节奏走。动画会显得很平淡，真正有趣的地方在于结合 CurvedAnimation + Interval : Curve 决定节奏感；Interval 决定某个属性在全局时间轴上的生效区间。

AnimatedBuilder 与 AnimatedWidget——工程感差异化选择

Email-style tip: If you’re writing an ad-hoc animation inside a page that doesn’t need to be reused elsewhere,lean towards AnimatedBuilder\.* If you want a reusable widget that encapsulates its own animation logic。go with AnimatedWidget\.* This keeps your build tree tidy and promotes component reuse.

• ① 使用场景：Coding directly inside build method for one-off effects........ . . . . . .. . .* .* .* .* .* .* .*