简单的动画

Simple Animations 是一个 Flutter 包,通过简化动画创建方式来提高您的动画生产力。

项目目标

Flutter 拥有强大而灵活的动画能力基础。

但即使是小的动画也显得冗长,并且膨胀了你的代码库。
动画是 Flutter 中最受欢迎的方面之一,但
很难掌握。

简单动画的目标是解决这个问题,通过

  • 简化创建自定义动画的方式,
  • 温和地引导开发者进入动画主题,
  • 提供大量的文档示例

示例

打字机效果

这个自定义动画看起来很简单,但实际上相当复杂

hello-flutter-example

结合了一个交错动画序列和一个持续动画

  • 一开始它会动画化一个框的高度。之后它会增加宽度
  • 在增加宽度的同时,一个类似打字机的动画下划线出现并持续存在。
  • 在宽度接近最终大小时,它开始输入文本

使用传统的 Flutter 动画类,这将导致一个巨大的
StatefulWidget,包含多个 AnimationController、Tweens 以及所有这些。
initState 和 onDispose 开销。

使用 simple_animation,你可以使用
一些精巧的 ControlledAnimation 组件以无状态的方式实现它。

整个动画只需要大约 60 行代码,同时
保持可读性(你可以在这里找到源代码
我只计算了负责动画的代码行数。)

Pub 示例选项卡

这是来自 示例页面 (pub.dartlang.org) 的示例

pub-example-tab

示例应用

你可以在 示例应用 中找到这些和其他示例。

fancy-background

fade-in

GitHub

https://github.com/felixblaschke/simple_animations