一、动画的分类
在flutter中主要分为两类
补间动画 :在补间动画中,定义了开始点和结束点、时间线以及转换时间和速度的曲线。然后由框架计算如何从开始点过度到结束点。
物理动画:在基于物理掉动画中,运动被模拟为与真实世界的行为相似。
二、动画中常见的核心类
a. Animation:用来监听动画的状态 和获取动画变化值。
b. Aniamtable:根据给出的开始值和结束值用来计算动画 真正的值
c. AnimationController:动画控制器,控制动画掉开始、暂停、结束等状态。继承Animation。需要传递一个vsync参数,存在vsync时防止屏幕外动画消耗不必要的资源。
d. Tween:变化值重载器,例如颜色变化值,数值变化值。继承Animatable
e. addListeners和addStatusListeners:前者主要用来监听动画值的变化,后者主要用来监听动画状态掉变化,比如暂停、开始、结束、完成。
f. CurvedAnimation:用于定义非线性曲线动画,比如加速、匀速、加速再减速等等,表示动画的运行方式。继承自Animation,相当于对动画值得包装,通过.value可以直接获得动画的插值后的值。
g.Curve:动画插值器(用来实现动画的值的变化,例如计算出动画的当前值,将它当做x值放入函数计算出y的值)自定义插值器就继承它
三、动画的使用
伪代码
AnimationController _controller;
Animation<double> _animation;
@override
void initState() {
super.initState();
_controller = AnimationController(
duration: Duration(milliseconds: 2000), vsync: this);
_animation = CurvedAnimation(
parent: _controller,
curve: Curves.fastOutSlowIn,
);
_animation =
Tween(begin: 0 end: 100).animate(_animation);
_controller.addListener((){
setState(() {
});
}} ;
_controller.forward();
}
@override
Widget build(BuildContext context) {
return Container(
width: _animation.value,
color: Colors.red,
);
}
四、总结
这样写的动画,有一个很大的缺点,那就是需要通过setState来根据动画值来不断的刷新页面,
当页面比较复杂掉时候,搞不好的话就会导致性能问题,所以就需要把他抽出来。这就是后面要讲到的两个官方封装好的动画类,就是AnimatedWidget和AnimatedBuilder。