动画不要一开始写复杂
Flutter 动画能力很强,但多数业务场景用隐式动画就够了。隐式动画由组件自己管理过程,你只要改变目标值,例如宽高、颜色、透明度。
隐式动画示例
AnimatedContainer(
duration: const Duration(milliseconds: 250),
curve: Curves.easeOut,
width: expanded ? 240 : 120,
height: 48,
alignment: Alignment.center,
child: Text(expanded ? '展开状态' : '收起'),
)显式动画适合什么
当你需要精确控制开始、暂停、反向、循环、多段曲线时,使用 AnimationController。它需要 TickerProvider,通常在 StatefulWidget 中配合 SingleTickerProviderStateMixin 使用。
Hero 动画
Hero 适合列表到详情的共享元素过渡,例如头像、商品图、封面图。关键是两边使用相同 tag,并确保 tag 唯一。