网络知识 娱乐 Unity Dotween插件的运动曲线(Ease)介绍Ease选项Ease效果示例以及C#修改动画曲线功能

Unity Dotween插件的运动曲线(Ease)介绍Ease选项Ease效果示例以及C#修改动画曲线功能

前言

我们在制作动画时经常使用这个Dotween插件,在移动、旋转、透明度等等参数的控制都可以使用该插件,而且在这个插件上的控制动画可以设置曲线,内置的曲线有这些:
在这里插入图片描述

内置曲线

以InOutSine的曲线进行往右移动:
在这里插入图片描述

效果是这样的:
在这里插入图片描述

能看出开始是从0提速,最后是慢慢减速至0的效果。

4个类型的效果:
In: 从0开始加速;
Out: 减速到0;
lnOut:前半段从0开始加速,后半段减速到0的缓动
Linear: 直线效果,匀速的效果;

不同的缓动方式:
Flash: 闪烁效果,时而快时而慢(个人认为的)
Quad:二次方的;
Cubic:三次方的;
Quart:四次方的;
Quint:五次方的;
Sin:正弦曲线的缓动( sin(t)) ;
Expo:指数曲线的缓动(2At) ;
Circ:圆形曲线的缓动( sqrt(1-t^2)) ;
Elastic :指数衰减的正弦曲线缓动;
Back:超过范围的三次方缓动((s+1)tN3 - st^2) ;
Bounce:指数衰减的反弹缓动。

以上方式的组合形成了这些内置的曲线。

各个曲线的效果图:
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

以上效果图转自:https://zhuanlan.zhihu.com/p/161106076

脚本修改内置曲线

主要就是通过SetEase()(有重载)函数设置即可:

Ease easeType = Ease.OutQuad;
tween.SetEase(easeType);

自定义曲线

不过最后一个选项(::AnimationCurve)可以进行自定义的曲线,这里随意拖拽一个曲线:
在这里插入图片描述

效果是这样的:

在这里插入图片描述

动画定义的是按钮延x方向移动600(向右),但是自定义的曲线开始为负值,所以动画是先向左移动了才往右移动。

脚本自定义曲线

该方式是通过定义AnimationCurve(动画曲线)类型,设置动画曲线实现:

AnimationCurve easeCurve = new AnimationCurve(new Keyframe(0, 0), new Keyframe(1, 1));
tween.SetEase(easeCurve);

其它脚本设置曲线

设置曲线支持的所有函数如图:

在这里插入图片描述

可以看出也可以通过设置EaseFunction的方法来实现。