Flutter 动画画廊

这个项目展示了最常见的 Flutter 动画 API。

预览

Animations Gallery Preview

也可作为 Flutter 网页演示

设置

  • 曲线:展示所有内置的 Flutter 动画曲线
  • 主题:主要颜色主题选择(红、靛蓝、绿、棕)
  • 时长:滑块用于设置应用中各种动画的时长

隐式动画

  • AnimatedContainer
  • AnimatedPositioned
  • TweenAnimationBuilder

显式动画

  • ScaleTransition
  • RotationTransition
  • Staggered Animations
  • 动态戒指 (AnimationController + CustomPainter)

其他特性

  • 自适应 UI:移动端竖屏下显示抽屉导航,移动端横屏或更大尺寸的设备显示分屏视图
  • 全局应用状态,使用 Riverpod 管理(选定的曲线、主题、时长)

注意:我可能会在未来添加更多示例。欢迎贡献和提交 PR。

想要更多?获取我的 Flutter 动画大师班

这门完整课程将教你如何使用完全自定义的 UI 和动画来构建一个习惯追踪应用程序。

包含:7 小时的深度内容,完整的源代码,额外的挑战等等。

Animations Gallery Preview


许可证:MIT

GitHub

查看 Github