SpringBoot+Vue3 项目实战，打造企业级在线办公系统圣安地列斯

download：SpringBoot+Vue3 项目实战，打造企业级在线办公系统圣安地列斯

颤振动画分析
动画定义
早期的动画片使用大量的画面快速切换，以达到看似连续的动画效果。这是最早的帧动画，是人类视觉延迟产生的连续效果。其实这也是现在动画的原理。屏幕有规律地同时渲染多次。渲染的次数越多，动画就会越流畅，也就是我们通常所说的屏幕刷新率。
目的让大家在使用颤振动画的过程中得心应手，不需要分析具体的源代码。
动画的关键属性:动画持续时间和动画轨迹。
实际上，动画是物体在指定时间内特定的规律性运动的表现。所以我们需要关心的核心属性是动画时长和动画轨迹。
了解动画实现的原理，所谓“万物变化”和颤振动画是一样的。让我们先来看看在Flutter中使用的动画的几个关键类。
动画核心类:
动画控制器动画控制器
用于设置动画的持续时间、动画的开始和结束值，以及控制动画的开始和结束。
方法和常用方法:
_controller =动画控制器(
Vsync: this，//设置跑马灯动画帧的回调函数
Duration: Const Duration(毫秒:2000)，//正动画的持续时间//2s
反向持续时间:常量持续时间(百万:2000)，//反向动画持续时间//2s
LowerBound: 0，//开始动画数值double类型
UpperBound: 1.0，// end动画数值double类型
animation behavior:animation behavior . normal，//动画师行为是否重复动画的两个枚举值？
DebugLabel:“缩放动画”，//动画过多时调试标签动画方便，toString时显示。
//_ controller . tostring；
//输出:动画控制器# 9d 121(0.000；用于缩放动画)补间(0.0 → 1.0) 0.0
);
//常用方法:
//监控动画运动
_ controller . add listener((){ })；
//监控动画开始、停止等。
_controller.addStatusListener((状态){
//解散动画停在起点。
//正向动画正在正向执行。
//反向动画正在反向执行。
//完成的动画在终点停止
if(status = = animation status . completed){
_ controller . reverse()；//反向执行100-0
} else if(status = = animation status . discarded){
_ controller . forward()；//正向执行0-100
}
});
//开始播放动画
//_ controller . forward()；//正向启动动画
//_ controller . reverse()；//反向播放动画
_ controller . repeat()；//无限循环开始动画

复制代码
vsync参数需要类别混合:
SingleTickerProviderStateMixin或TickerProviderStateMixin，如果页面中只有一个动画控制器使用第一个，多个控制器使用第二个。
AnimatedBuilder实现动画组件的核心类
总的来说，我们需要在需要动画效果的组件上包裹一层AnimatedBuilder来监控动画控制器的更新数据，内部的实现也是通过有状态组件监控不断刷新页面来实现的。
施工方法:
常量动画生成器({
钥匙？钥匙，
必需的Listenable动画，///动画控制器
必选this.builder，//返回动画
This.child，//传递给build的子组件
})
复制代码
以上两个组件可以实现简单的动画效果。让我们使用AnimationController和AnimatedBuilder来实现一个简单的缩放动画。使FlutterLogo组件大小不断变化。
//打开动画
_ controller . repeat()；//无限循环开始动画

中心(
child: AnimatedBuilder(
child: FlutterLogo()，
动画:_控制器，
构建器:(上下文，子级){
返回容器(
宽度:100 * _controller.value，
高度:100 * _controller.value，
孩子:孩子，
);
}),
)