《Flutter 动画系列一》25种动画组件超全总结

 ## 动画运行的原理 任何程序的动画原理都是一样的，即：视觉暂留，视觉暂留又叫视觉暂停，人眼在观察景物时，光信号传入大脑神经，需经过一段短暂的时间，光的作用结束后，视觉形象并不立即消失，这种残留的视觉称“后像”，视觉的这一现象则被称为“视觉暂留”。 电影就是依靠视觉暂留，在感官上电影是连续的。使动画有流畅的感觉，帧率至少要达到24帧，即：每秒播放24个图像，因此动画有一个非常关键的性能参数FPS（Frame Per Second），即帧率，达到24fps，画面就比较流畅了，Flutter的FPS理论上可以达到60fps，超过48fps，将会感到丝滑般的顺畅。 ## Flutter动画系统 为了方便开发者进行动画的开发，Flutter将动画系统进行封装，抽象出4个概念：Animation、Curve、AnimationController、Tween。 - Animation：Flutter动画中的核心类，此类是抽象类，通常情况下使用其子类：AnimationController，可以获取当前动画的状态和值，也可以添加其状态变化监听和值变化监听。 - Curve：决定动画执行的曲线，和Android中的Interpolator（差值器）是一样的，负责控制动画变化的速率，系统已经封装了10多种动画曲线，详见`Curves`类。 - AnimationController：动画控制器，控制动画的开始、停止。继承自Animation。 - Tween：映射生成不同范围的值，AnimationController的动画值是double类型的，如果需要颜色的变化，Tween可以完成此工作。 将Container控件的大小由100变为300，代码如下： ```dart class AnimationDemo extends StatefulWidget { @override State