DOTween动画插件超详解(保姆级巨细)

请添加图片描述

文章目录

  • 一、前言
  • 二、DOTween简介与安装
    • (一)什么是DOTween?
    • (二)下载安装
  • 三、DOTween 的使用(基础)
    • (一)使用前注意事项
      • 1. 引入命名空间
      • 2. 进行初始化
      • 3. 清除遗留
      • 4. 设置timeScale对动画的影响
      • 5. 类型介绍
    • (二)基础API介绍
      • 1. Move 移动过渡
      • 2. Rotate 旋转过渡
      • 3. Scale 缩放过渡
      • 4. Punch 冲击
      • 5. Text 文本动画
      • 6. Shake 震动效果
      • 7. Color 颜色过渡
      • 8. Fade 透明度
  • 四、DOTWeen 的高阶用法
    • (一)DOTween.To()
    • (二)From()
    • (三).Set方法
    • (四)控制和回调
      • 1. 开始、暂停和结束动画
      • 2. 回调函数
    • (五)ID使用
    • (六)序列动画
  • 五、授人以渔
  • 六、结语

一、前言

在日常的开发中是少不了过渡动画的,从0直接到1在视觉上未免显得过于生硬,但是用协程也可以去写一些过渡的动画,但是开发的效率会大大的降低,我们自己可以做封装,也可以直接用插件,有大佬写好的轮子当然直接拿来用了,这个轮子就是 DOTween 。😎

这篇文章的篇幅很长,内容也很全,几乎涵盖了所有开发中遇到的情况。我自己在开发中也是经常用DOTween,但是难免会遇到没用过的API或者有些API记不住需要查阅文档资料的,所以就索性写了这一篇文章,用来记录和查阅。

二、DOTween简介与安装

(一)什么是DOTween?

DOTween 是一个高效且功能强大的 Unity 动画和时间控制库,广泛用于游戏开发中。它由 Demigiant 开发,旨在简化和优化在 Unity 中创建和管理动画的过程。简单说一下它的几个特点:

  • 简单易用: 其提供了直观的 API,使得动画的创建和控制变得简单。我们可以通过链式调用来设置动画属性。
  • 高性能: 相较于其他的库来说,它是一个轻量级的库,优化了性能,适合在游戏中频繁使用。
  • 类型多样: 出了支持最常用的位置、旋转、缩放、颜色、透明度等,它还支持对 UI 元素的动画。
  • 时间控制: 其封装的API允许开发者控制动画的时间,包括持续时间、延迟、反向播放和循环等。
  • 回调和事件: 他的API还提供了丰富的回调功能,允许在动画开始、完成、暂停或取消时执行特定的代码。
  • 序列动画: 允许将多个动画组合成序列,方便管理复杂的动画效果。
  • 插件支持:扩展性强,支持多种插件和自定义功能,开发者可以根据需要扩展其功能。

(二)下载安装

这个库在资源商店就可以下载,官方已经将其收购了(忘了在哪一篇文章看到的了)。

选择点击 Window --> Asset Store,打开资源商店,在搜索栏中输入DOTween,点击搜索,找到下面这个插件。(你可能发现还有一个Pro版本的,我们这里直接用Free的基础版就够用了,毕竟免费😄)

在这里插入图片描述

然后点击这个卡片,选择添加到我的资源,添加完成之后进入unity中,
选择点击 Window --> Package Manager,出现窗口之后,Packages选择My Assets,搜索框中输入DOTween,出现插件之后点击Download,然后再点击Import

在这里插入图片描述

再点击All,然后Import。

在这里插入图片描述

导入之后,编辑器会出现插件的面板,点击面板中间的、Setup DOTween… 进行初始化配置一下,然后关掉即可。不初始化配置的话后面他会一直弹窗提示你😄

在这里插入图片描述
再点击Apply,完成之后就可以关掉了。
在这里插入图片描述

如果后续想再次打开,可以在编辑器上面的工具栏中选择Tools --> Demigiant --> DOTween Utility Panel 打开。
在这里插入图片描述

三、DOTween 的使用(基础)

(一)使用前注意事项

1. 引入命名空间

要用插件库首先得需要引入,所以在使用DOTween前需要引入对应的命名空间:

using DG.Tweening;

2. 进行初始化

然后就是初始化,我们先看一下官方是什么描述的。

在这里插入图片描述

英语不好的直接上翻译(我英语不好也是用的翻译😴),大致意思就是说:第一次创建tween时,DOTween将使用默认值自动初始化。如果您更喜欢自己初始化它(推荐),请在创建任何tween之前调用此方法一次(之后调用它将无效)。考虑到您仍然可以通过使用DOTween的全局设置随时更改所有init设置您可以选择将SetCapacity链接到Init方法,该方法允许设置最大Tweeners/Sequences初始容量(这与稍后调用DOTween.SetTweensCapacity相同)。

它可以自动初始化,也可以手动调用DOTween.Init();进行初始化,他还有三个可选参数,但是一般使用的时候可以直接DOTween.Init();就可以。

DOTween.Init(bool recycleAllByDefault = false, bool useSafeMode = true, LogBehaviour logBehaviour = LogBehaviour.ErrorsOnly)
DOTween.Init();

我们来看下这些参数的作用:(动画、过渡、渐变、补间都是一个意思)
recycleAllByDefault:如果设为true,所有创建的动画在调用完后被回收,即不会直接被销毁,而是会放入对象池中等待下次重用,而不是每次创建新的动画。
useSafeMode:如果设为true,动画会稍微慢一些,但更加安全,允许DOTween在动画运行时自动处理目标被销毁破坏之类的事情,让动画仍然可以执行,不受其影响。
logBehaviour:根据选择的模式,DOTween将只记录错误、错误和警告,或者所有内容加上附加信息。

这是官方对初始化API的描述,想了解更清楚的话可以看一下。(蓝底参数表示可选的意思)
在这里插入图片描述

3. 清除遗留

什么是清除遗留?

就是如果游戏对象上的当前DOTween动画没播放完的时候,在游戏对象上再次创建了一个动画,会导致动画创建或者播放报错。就好比我们在游戏对象上添加了事件监听,在游戏对象销毁的时候需要移除事件,都是相同的逻辑。所以在每次执行动画之前,先.DOKill()杀掉上一个动画。

//先去掉上一个动画进程
transform.DOKill();
//再创建新的动画
transform.DOMove();

4. 设置timeScale对动画的影响

正常情况下,也就是默认情况,当你设置Time.timeScale = 0 暂停游戏时,Tween动画也会被暂停,但是在特殊情况下,我们需要在游戏暂停的时候,动画要继续执行,这个时候在创建的动画后加上 .SetUpdate(true) 方法就可以,这样在游戏暂停的时候动画依旧在运行,直到动画结束。

transform.DOMoveX(5f, 2).SetUpdate(true);

5. 类型介绍

我们创建的动画都会有一个返回值,返回值的类型是 Tween ,表示补间动画,我们可以用这个类型声明一个变量来接收创建的动画,用于动画的一些扩展,灵活性更好。

Tween tween = transform.DOMoveX(5f, 2).SetUpdate(true);

(二)基础API介绍

首先介绍几个比较常用的,例如移动、旋转、缩放、颜色渐变等

1. Move 移动过渡

物体移动到指定位置。(世界坐标)

transform.DOMove(new Vector3(10f, 2f, 0), 2f, false);
transform.DOMove(Vector3 to, float duration, bool snapping)
	参数说明:
		Vector3 to               目标位置
		float   duration         动画持续时间
		bool    snapping         默认为false,设为true时平滑地将所有值变为整数,即每次移动整数值。

沿着X/Y/Z轴移动到指定位置。(世界坐标)

transform.DOMoveX(10, 2f, false);
transform.DOMoveY(10, 2f, false);
transform.DOMoveZ(10, 2f, false);
transform.DOMoveX/DOMoveY/DOMoveZ(float to, float duration, bool snapping)
	参数说明:
		float   to				  要移动到的坐标值
		float   duration         动画持续时间
		bool    snapping         默认为false,设为true时平滑地将所有值变为整数,即每次移动整数值。

物体移动到指定位置。(自身坐标)

transform.DOLocalMove(new Vector3(10f, 2f, 0), 10f, false);
transform.DOLocalMove(Vector3 to, float duration, bool snapping)
 	参数说明:
 		Vector3 to               要移动到的位置
		float   duration         动画持续时间
		bool    snapping         默认为false,设为true时平滑地将所有值变为整数,即每次移动整数值。

沿着X/Y/Z轴移动到指定位置。(自身坐标)

transform.DOLocalMoveX(10, 2f, false);
transform.DOLocalMoveY(10, 2f, false);
transform.DOLocalMoveZ(10, 2f, false);
transform.DOLocalMoveX/DOLocalMoveY/DOLocalMoveZ(float to, float duration, bool snapping)
	参数说明:
		float   to				  要移动到的轴的坐标
		float   duration         动画持续时间
		bool    snapping         默认为false,设为true时平滑地将所有值变为整数,即每次移动整数值。

跳跃到指定位置。(世界坐标)
这里可能有点抽象,为什么是跳跃?跳跃也是移动?
举个例子你就明白了,麻雀大家都见过吧,他是怎么移动的?是不是一跳一跳的往前走。《我的世界》都玩过吧,里面的史莱姆怎么移动的?是不是跳跃,官方文档里也罢Jump放到了Move一栏,所以这里也这么罗列了。

transform.DOJump(new Vector3(5, 0, 0), 10, 3, 1f, false);
transform.DOJump(Vector3 endValue, float jumpPower, int numJumps, float duration, bool snapping)
	参数说明:
		 Vector3 endValue         最终要跳跃到的位置
		 float   jumpPower        跳跃的强度,决定跳跃的高度(当前位置Y加上该值)
		 int     numJumps         跳跃的次数
		 float   duration         动画持续时间
		 bool    snapping         默认为false,设为true时平滑地将所有值变为整数,即每次移动整数值。

跳跃到指定位置。(自身坐标)

transform.DOLocalJump(new Vector3(10, 0, 0), 10, 3, 2f, false);
transform.DOLocalJump(Vector3 endValue, float jumpPower, int numJumps, float duration, bool snapping)
	参数说明:
		 Vector3 endValue         最终要跳跃到的位置
		 float   jumpPower        跳跃的强度,决定跳跃的高度(当前位置Y加上该值)
		 int     numJumps         跳跃的次数
		 float   duration         动画持续时间
		 bool    snapping         默认为false,设为true时平滑地将所有值变为整数,即每次移动整数值。

Rigidbody和Rigidbody2D也有上面的一些方法。
在这里插入图片描述

2. Rotate 旋转过渡

旋转到指定的值(根据欧拉角),世界坐标

transform.DORotate(new Vector3(0, 90, 0), 0.1f, RotateMode.Fast);
transform.DORotate(Vector3 to, float duration, RotateMode mode)
	参数:
		Vector3		to				旋转的目标值
		float		duration		旋转过渡时间
		RotateMode	mode
				Fast				(默认值)采用最短路径,即旋转不会超过360°
				FastBeyond360		旋转超过360°
				WorldAxisAdd		与transform.Rotate(new Vector3(20, 0, 0),Space.World)作用类似,最终值始终被视为相对值
				LocalAxisAdd		与transform.Rotate(new Vector3(20, 0, 0),Space.Self)作用类似,最终值始终被视为相对值

旋转到指定的值(四元数),世界坐标

Quaternion targetRotation = Quaternion.Euler(0, 90, 0);//表示绕 Y 轴旋转 90 度
transform.DORotateQuaternion(targetRotation, 1f);
transform.DORotateQuaternion(Quaternion to, float duration)
	参数:
		Quaternion	to				要旋转到的目标值四元数
		float		duration		旋转的过渡时间

旋转到指定的值(根据欧拉角),自身坐标

transform.DOLocalRotate(new Vector3(0, 90, 0), 0.5f, RotateMode.Fast);
transform.DOLocalRotate(Vector3 to, float duration, RotateMode mode)
	参数:
		Vector3		to				旋转的目标值
		float		duration		旋转的过渡时间
		RotateMode	mode
				Fast				(默认值)采用最短路径,即旋转不会超过360°
				FastBeyond360		旋转超过360°
				WorldAxisAdd		与transform.Rotate(new Vector3(20, 0, 0),Space.World)作用类似,最终值始终被视为相对值
				LocalAxisAdd		与transform.Rotate(new Vector3(20, 0, 0),Space.Self)作用类似,最终值始终被视为相对值

旋转到指定的值(四元数),自身坐标

Quaternion targetRotation = Quaternion.Euler(0, 90, 0);//表示绕 Y 轴旋转 90 度
transform.DOLocalRotateQuaternion(targetRotation, 0.5f);
transform.DOLocalRotateQuaternion(Quaternion to, float duration)
	参数:
		Quaternion	to				要旋转到的目标值四元数
		float		duration		旋转的过渡时间

朝向目标方向,Look At看向谁,即旋转目标使其朝向指定的位置方向。

transform.DOLookAt(new Vector3(0, 90, 0), 0.5f, AxisConstraint.None, Vector3.up);
transform.DOLookAt(Vector3 towards, float duration, AxisConstraint axisConstraint = AxisConstraint.None, Vector3 up = Vector3.up)
	参数:
		 Vector3			 towards			旋转目标值
		 float	    		 duration			旋转总用时
		 AxisConstraint		 axisConstraint 	旋转最终轴约束,只旋转此轴。(默认值为AxisConstraint.None)
		 Vector3             up                 定义向上方向的矢量。(默认值为Vector3.up)

朝向目标方向,Look At看向谁,即旋转目标使其朝向指定的位置方向,每帧更新 lookAt 位置(与此相反,当补间开始时,只计算一次 lookAt 旋转)

transform.DODynamicLookAt(new Vector3(0, 90, 0), 0.5f, AxisConstraint.None, Vector3.up);
transform.DODynamicLookAt(Vector3 towards, float duration, AxisConstraint axisConstraint = AxisConstraint.None, Vector3 up = Vector3.up)
	参数:
		 Vector3			 towards			旋转目标值
		 float	    		 duration			旋转总用时
		 AxisConstraint		 axisConstraint 	旋转最终轴约束,只旋转此轴(默认值为AxisConstraint.None)
		 Vector3             up                 定义向上方向的矢量(默认值为Vector3.up)

3. Scale 缩放过渡

将物体放大(缩小)到指定的倍数或大小

transform.DOScale(new Vector3(1.5, 1.5, 1.5), 0.5f);
transform.DOScale(2f, 0.5f);
transform.DOScale(float/Vector3 to, float duration)
	参数:
		float/Vector3 			to					浮点数为倍数,向量为指定大小
		float 					duration			放大/缩小总消耗时间

对物体的某一轴方向进行放大(缩小)

transform.DOScaleX/DOScaleY/DOScaleZ(1.5f, 1.5f);
transform.DOScaleX/DOScaleY/DOScaleZ(float to, float duration)
	参数:
		float					to					放大到的倍数
		float 					duration			放大/缩小总消耗时间

4. Punch 冲击

受到冲击后的回弹效果
transform.DOPunchPosition();
transform.DOPunchPosition(Vector3 punch, float duration, int vibrato, float elasticity, bool snapping)
	参数:
		Vector3					punch 				要被击打到的最远位置(相对值,相对于局部坐标)
		float					duration			总持续时间
		int						vibrato				物体振动频率
		float					elasticity			值一般在01之间,0表示起点到冲击方向的震荡,1表示为一个完整的震荡,可能会超过起点,个人感觉后者效果更好。
		bool					snapping			是否进行平滑插值

受到冲击后旋转效果
transform.DOPunchRotation()
transform.DOPunchRotation(Vector3 punch, float duration, int vibrato, float elasticity)
	参数:
		Vector3					punch 				要被击打到的角度(相对值,相对于局部坐标)
		float					duration			总持续时间
		int						vibrato				物体旋转频率
		float					elasticity			值一般在01之间,0表示最初角度到最大角度的旋转,1表示为一个完整的旋转,可能会超过最远角度。

实现一个弹性效果,反复弹,最终复原。
transform.DOPunchScale()
transform.DOPunchScale(Vector3 punch, float duration, int vibrato, float elasticity)
	参数
		Vector3					punch 				弹到的大小
		float					duration			总持续时间
		int						vibrato				物体放缩频率
		float					elasticity			值一般在01之间,0表示最初角度到目标大小的放缩,1会产生负值,出现警告。

5. Text 文本动画

如果文本框内之前没有文字,在2s内逐字显示文字。如果原先有文字,则逐字覆盖掉原先文字,显示新文字,就像这样。

GetComponent<Text>().DOText("今天天气真不错!", 2);

请添加图片描述
请添加图片描述

6. Shake 震动效果

挂载在摄像机上面

//持续时间,其余默认
transform.DOShakePosition(1);
//持续时间、强度(下为只在X、Y方向上震动)
transform.DOShakePosition(1,new Vector3(3,3,0));

请添加图片描述

7. Color 颜色过渡

文字的颜色会从原本颜色缓慢变为红色,过渡时间为1秒

GetComponent<Text>().DOColor(Color.red, 1);

8. Fade 透明度

文字的透明度会在2s内从原来的透明度变为1

GetComponent<Text>().DOFade(1, 2);

四、DOTWeen 的高阶用法

(一)DOTween.To()

DOTween.To() 是 DOTween 插件中的一个非常灵活且常用的 API,用于创建和控制动画。具体用法像这样:

Vector3 myvalue = new Vector3(0, 0, 0);
DOTween.To(() => myvalue, x => myvalue = x, new Vector3(10, 10, 10), 2);
                 要移动的初始值                目标值                时间
DOTween.To(getter, setter, endValue, duration);
	参数说明
		getter			一个函数,用于获取当前值。它应该返回一个 float、Vector3、Color 等类型的值,具体取决于你要动画化的属性。
		setter			一个函数,用于设置目标值。它接受一个参数(目标值),并将其应用于对象的属性。
		endValue		动画的结束值。即动画完成时,属性应该达到的值。
		duration		动画的持续时间,单位为秒。

再看一些示例深入理解一下用法:

示例 1: 动画化 float 值,targetValue 将在 2 秒内从 0 动画到 1float targetValue = 0f;
DOTween.To(() => targetValue, x => targetValue = x, 1f, 2f);


示例 2: 动画化 Vector3 值,物体的位置将在 3 秒内从当前的位置移动到 (0, 10, 0)Vector3 targetPosition = new Vector3(0, 0, 0);
Transform myTransform = gameObject.transform;
DOTween.To(() => myTransform.position, x => myTransform.position = x, new Vector3(0, 10, 0), 3f);


示例 3: 动画化 Color 值,物体的材质颜色将在 1 秒内变为红色。
Renderer myRenderer = GetComponent<Renderer>();
Color targetColor = Color.red;
DOTween.To(() => myRenderer.material.color, x => myRenderer.material.color = x, targetColor, 1f);

(二)From()

从目标位置,移动到当前位置

绝对位置,若当前坐标(1,0,0),即从5运动到1,先从1闪现到5然后再在指定的时间内移动到1
transform.DOMoveX(5, 1).From();
transform.DOMoveX(5, 1).From(false);

相对位置,若当前坐标(1,0,0),即从6运动到16-1=5,相对位移5)
transform.DOMoveX(5, 1).From(true);

(三).Set方法

Tween tween = transform.DOMoveX(5, 2);

.SetDelay(float delay):
作用: 设置动画开始前的延迟时间(以秒为单位)。
示例:
tween.SetDelay(1f); // 延迟1秒后开始

.SetEase(Ease easeType):
作用: 设置动画的缓动类型(如线性、加速、减速等,类似设置PPT动画的出现效果)。
示例:
tween.SetEase(Ease.InOutQuad); // 使用 InOutQuad 缓动

.SetLoops(int loops, LoopType loopType):
作用: 设置动画的循环次数和循环类型(如循环、反向循环等)。
示例:
tween.SetLoops(3, LoopType.Yoyo); // 循环3次,反向循环

.SetAutoKill(bool autoKill):
作用: 设置动画完成后是否自动销毁。
示例:
tween.SetAutoKill(false); // 动画完成后不自动销毁

.SetId(object id):
作用: 设置动画的 ID,以便后续查找和管理。
示例:
tween.SetId("myTween"); // 设置 ID 为 "myTween"

.SetUpdate(bool isIndependent):
作用: 设置动画是否独立于时间更新(用于在时间暂停时仍然更新)。
示例:
tween.SetUpdate(true); // 在时间暂停时仍然更新

上面的 .SetEase() 方法来设置动画的缓动类型。我搜集了一下缓动类型,还挺多😂

Ease.Linear: 匀速运动,速度不变。
Ease.InQuad: 加速的二次方曲线。
Ease.OutQuad: 减速的二次方曲线。
Ease.InOutQuad: 先加速后减速的二次方曲线。
Ease.InCubic: 加速的三次方曲线。
Ease.OutCubic: 减速的三次方曲线。
Ease.InOutCubic: 先加速后减速的三次方曲线。
Ease.InQuart: 加速的四次方曲线。
Ease.OutQuart: 减速的四次方曲线。
Ease.InOutQuart: 先加速后减速的四次方曲线。
Ease.InQuint: 加速的五次方曲线。
Ease.OutQuint: 减速的五次方曲线。
Ease.InOutQuint: 先加速后减速的五次方曲线。
Ease.InSine: 使用正弦函数加速。
Ease.OutSine: 使用正弦函数减速。
Ease.InOutSine: 使用正弦函数加速和减速。
Ease.InExpo: 指数加速。
Ease.OutExpo: 指数减速。
Ease.InOutExpo: 指数加速和减速。
Ease.InCirc: 圆形加速。
Ease.OutCirc: 圆形减速。
Ease.InOutCirc: 圆形加速和减速。
Ease.InBounce: 先加速后弹跳。
Ease.OutBounce: 先弹跳后减速。
Ease.InOutBounce: 先加速后弹跳再减速。
Ease.InBack: 加速并略微超出目标。
Ease.OutBack: 减速并略微超出目标。
Ease.InOutBack: 先加速后减速并略微超出目标。
Ease.Flash: 短暂的闪烁效果。

(四)控制和回调

1. 开始、暂停和结束动画

开始动画:
通常通过调用动画方法来开始,例如 DOMove、DOFade 等。
示例:
Tween tween = transform.DOMove(target.position, duration);

暂停动画:
使用 Pause() 方法暂停动画。
示例:
tween.Pause(); // 暂停动画

恢复动画:
使用 Play() 方法恢复动画。
示例:
tween.Play(); // 恢复动画

结束动画:
使用 Kill() 方法结束动画,并可选择是否销毁。
示例:
tween.Kill(); // 结束并销毁动画

重启动画:
使用 Restart() 方法重新开始动画。
示例:
tween.Restart(); // 重新开始动画

5 Pause、DOPlay、DOPlayForward、DOPlayBackwards、DORestart
动画暂停、动画播放、动画向前播放、动画倒放

//DOTween播放会生成动画,动画保存在Tweener信息中,默认动画播放完会被销毁,要想倒放,必须设为不被销毁
//tweener也会播放动画
Tweener tweener= transform.DOLocalMove(new Vector3(1, 1, 1), 1);
tweener.SetAutoKill(false);
//暂停动画
tweener.Pause();
//播放动画,只播放一次,再次调用不可播放
transform.DOPlay();
//向前播放动画
transform.DOPlayForward();
//动画倒放
transform.DOPlayBackwards();
//重新播放动画:若用的可视化编辑,需取消AutoKill
transform.DORestart();

2. 回调函数

类似生命周期函数,从开始创建到结束的一系列过程

.OnStart(Action onStart):
作用: 在动画开始时执行的回调。
示例:
tween.OnStart(() => Debug.Log("动画开始"));

.OnPlay(Action onPlay):
作用: 在动画播放时执行的回调。
示例:
tween.OnPlay(() => Debug.Log("动画播放"));

.OnUpdate(Action onUpdate):
作用: 在每一帧更新时执行的回调。
示例:
tween.OnUpdate(() => Debug.Log("动画更新"));

.OnComplete(Action onComplete):
作用: 在动画完成时执行的回调。
示例:
tween.OnComplete(() => Debug.Log("动画完成"));

.OnKill(Action onKill):
作用: 在动画被杀死时执行的回调。
示例:
tween.OnKill(() => Debug.Log("动画被杀死"));

事件函数
动画播放完成事件函数

Tweener tweener = transform.DOLocalMoveX(0, 5);
//动画播放完成调用事件函数
tweener.OnComplete(你的方法);

//动画销毁调用事件函数
tweener.OnKill(你的方法);

//动画播放时调用事件函数(一直调用)
tweener.OnPlay(你的方法);

//动画暂停时调用事件函数
tweener.OnPause(你的方法);

//动画重置时调用事件函数
tweener.OnRewind(你的方法);

//动画开始播放时调用事件函数
tweener.OnStart(你的方法);

//动画播放时调用事件函数(一次)
tweener.OnPlay(你的方法);

这里再插一句,因为大家可能会有疑问:怎么会有两个很像的东西 TweenTweener 。雀食两个长得很像,在 DOTween 动画库中,TweenTweener 是两个相关但又不太一样的概念,这里我们稍微做一下解释。

Tween: 一个通用的动画对象,表示一个动画的实例。它可以是任何类型的动画,比如位置、旋转、缩放、颜色等。他是所有动画的基类,它可以被用来控制动画的播放状态(如播放、暂停、停止等)、设置回调、链式动画等。

Tweener: 是 Tween 的一个特化、特例、专门分支,表示一种特定类型的动画,通常用于数值类型的动画(如浮点数、整数等)。允许你在动画中设置开始值和结束值,它通常用于需要从一个数值变化到另一个数值的情况。

总结一下就是:

  1. 类型上: Tween 是一个更广泛的概念,而 Tweener 是 Tween 的一种特化,特指数值类型的动画。
  2. 使用场景上: Tween 可以用于所有类型的动画,而 Tweener 主要用于需要在数值之间进行插值的动画。

(五)ID使用

在 DOTween 中,设置动画的ID是一个非常好用的功能,可以帮助你管理和查找特定的动画。通过 ID 可以方便地对某个特定的动画进行操作,比如暂停、恢复、停止或销毁。使用场景一般用于:

  • 管理动画: 当你有多个动画时,可以通过 ID 来区分和管理它们。
  • 批量操作: 可以通过 ID 批量暂停或停止具有相同 ID 的所有动画。
  • 状态管理: 在游戏中,可以根据不同的状态来控制相应的动画。

看一下示例更容易理解

创建一个动画并设置 ID
Tween tween1 = transform.DOMove(target.position, duration)
	.SetId("moveTween")
	.OnComplete(() => Debug.Log("动画1完成"));

创建另一个动画并设置相同的 ID
Tween tween2 = transform.DORotate(new Vector3(0, 180, 0), duration)
	.SetId("moveTween") // 设置相同的 ID
	.OnComplete(() => Debug.Log("动画2完成"));


暂停所有 ID 为 "moveTween" 的动画
DOTween.Pause("moveTween");

恢复所有 ID 为 "moveTween" 的动画
DOTween.Play("moveTween");

杀死所有 ID 为 "moveTween" 的动画
DOTween.Kill("moveTween");

(六)序列动画

DOTween.Sequence() 是 DOTween 中的一个方法,用于创建序列动画。

什么是序列动画?
序列动画(Sequence Animation) 允许你将多个动画组合在一起,以特定的顺序依次执行。适用于需要在特定时间顺序内执行多个动画的场景,例如:角色的攻击动作,可能包括移动、旋转和缩放等多个动作,可以使用序列来组织这些动画。当然,角色的动作几乎不会用DOTween来实现,那再比如说一个UI元素的出现,先进行淡入效果,然后移动到特定位置,最后进行缩放,这些都可以通过序列来实现。其作用有这几点:

  • 顺序执行: 你可以将多个动画添加到序列中,确保它们按照你希望的顺序依次执行。
  • 组合动画: 可以将不同类型的动画(如移动、旋转、缩放等)组合在一起,形成一个复杂的动画效果。
  • 控制时间: 你可以设置每个动画的延迟、持续时间等参数,使得整个序列动画的表现更加丰富。

看一下示例代码:


//创建一个序列动画
Sequence loopTween = DOTween.Sequence();

//添加第一个动画:移动到目标位置
loopTween.Append(transform.DOMove(target.position, 1f).SetEase(Ease.Linear));

//添加第二个动画:旋转
loopTween.Append(transform.DORotate(new Vector3(0, 180, 0), 1f).SetEase(Ease.OutBounce));

//添加第三个动画:缩放
loopTween.Append(transform.DOScale(new Vector3(2, 2, 2), 1f).SetEase(Ease.OutElastic));

//播放序列动画
loopTween.Play();

//暂停序列动画
loopTween.Pause();

//停止序列动画
loopTween.Kill();

//重播序列动画
loopTween.Restart();

// 添加一个回调,在序列完成时执行
loopTween.OnComplete(() => Debug.Log("序列动画完成"));

看完示例是不是有个疑问:跟 Tween 类的方法好像啊,的确,他俩在控制方法上有很多相似之处。但是实际上,SequenceTween 的一个特化,主要用于处理一系列动画的组合,所以 Tween 有的方法 Sequence 也有,Sequence 有的方法, Tween 不一定有,下面是
Sequence 特有的方法:

Sequence loopTween = DOTween.Sequence();
将一个新的动画添加到序列的末尾。
loopTween.Append(Tween tween);

将一个新的动画添加到序列的开头。
loopTween.Prepend(Tween tween);

将一个新的动画添加到序列中,与当前动画同时播放。
loopTween.Join(Tween tween);

在指定时间插入一个新的动画。
loopTween.Insert(float time, Tween tween);

在序列中添加一个间隔(不执行任何动画的时间)。
loopTween.AppendInterval(float interval): 

五、授人以渔

教你看官方文档,首先打开官方文档的网址
链接: https://dotween.demigiant.com/documentation.php
链接在就说明还有库存😹😹

我们直接跳到这个部分,上面的自己可以尝试的读一下,英语不好的直接翻译,我们现在的目的是找API,所以直接看下面的部分就好

在这里插入图片描述

首先说一下结构:

  • 红色 的框是动画方法所属的组件类,例如 TransformImage 等。
  • 蓝色 的框是方法的归类,就是绿色框的归类,移动方法在这里、旋转方法在这里。
  • 绿色 的框是红色组件 Transform 所有的动画方法,用起来就是 Transform.DOMove()

在这里插入图片描述

再点开每个方法看介绍,蓝色 的框一般情况表示可选参数,如果为TRUE(If TRUE),那说明它默认为FALSE(大概率)。

在这里插入图片描述

一部分的动画方法官方文档中还用了动图进行了形象的解释
请添加图片描述

UI部分也是一样的结构逻辑。
在这里插入图片描述

六、结语

今天的内容就到这里,内容有点多,这也是我写过博客文章中内容最多,制作时间最长的一篇文章,如果在阅读过程中需要什么问题,欢迎在评论区留言告诉我,我看到之后会及时回复,那么下期见,拜拜!

请添加图片描述

🐾 个人主页 🐾

阿松爱睡觉,横竖醒不来
🏅你可以不屠龙,但不能不磨剑🗡

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/899786.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

基于Java的电商书城系统源码带本地搭建教程

技术框架&#xff1a;jQuery MySQL5.7 mybatis jsp shiro 运行环境&#xff1a;jdk8 IntelliJ IDEA maven3 宝塔面板 系统功能介绍 该系统分为前台展示和后台管理两大模块&#xff0c;前台主要是为消费者服务。该子系统实现了注册&#xff0c;登录&#xff0c; 以及…

asp.net core mvc发布时输出视图文件Views

var builder WebApplication.CreateBuilder(args); builder.Services.AddRazorPages();builder.Services.AddControllersWithViews(ops > {//全局异常过滤器&#xff0c;注册ops.Filters.Add<ExceptionFilter>(); })// Views视图文件输出到发布目录&#xff0c;视图文…

使用 VSCode 通过 Remote-SSH 连接远程服务器详细教程

使用 VSCode 通过 Remote-SSH 连接远程服务器详细教程 在日常开发中&#xff0c;许多开发者需要远程连接服务器进行代码编辑和调试。Visual Studio Code&#xff08;VSCode&#xff09;提供了一个非常强大的扩展——Remote-SSH&#xff0c;它允许我们通过 SSH 协议直接连接远程…

背包九讲——完全背包问题

目录 完全背包问题 问题定义 动态规划解法 状态转移方程 初始化 遍历顺序 三种解法&#xff1a; 朴素版——枚举k 进阶版——dp正推&#xff08;一维滚动数组&#xff09; 背包问题第三讲——完全背包问题 背包问题是一类经典的组合优化问题&#xff0c;通常涉及在限定…

kafka 的高可用机制是什么?

大家好&#xff0c;我是锋哥。今天分享关于【kafka 的高可用机制是什么&#xff1f;】面试题&#xff1f;希望对大家有帮助&#xff1b; kafka 的高可用机制是什么&#xff1f; 1000道 互联网大厂Java工程师 精选面试题-Java资源分享网 Apache Kafka 是一个分布式消息系统&am…

《性能之巅:洞悉系统、企业与云计算》读书笔记-Part 1

本文是读书笔记第一部分&#xff0c;包括原书第一、二章。 绪论 性能是一门令人激动的&#xff0c;富于变化同时又充满挑战的学科。 系统性能 单台服务器上的通用系统软件栈 人员 系统性能是一项需要多类人员参与的工程。 事情 关于性能的理想执行顺序排列如下&#x…

8个方法教会你提高企业培训效率

培训成本是企业中的一个复杂问题。它完全取决于课程内容、培训方法以及成本效益。在计算培训费用时&#xff0c;公司会面临许多关于包括哪些内容、如何进行以及假设情景的问题。 企业员工培训的每个方面都会产生自己的成本。例如&#xff1a; 地点&#xff1a;我们专门找个培训…

【重拾算法第一天】质数约数欧拉筛 埃氏筛GCD

1.素数 素数&#xff08;Prime Number&#xff09;是指大于1的自然数&#xff0c;只有两个正因数&#xff1a;1和它自身。换句话说&#xff0c;素数是不能被其他自然数整除的数。 1.1小素数的判定 判定一个数是否为素数 &#xff0c;当N ≤ 时&#xff0c; 用试除法 &#…

Redis 命令集 (超级详细)

目录 Redis 常用命令集 string类型 hash类型 list类型 set类型 zset类型 bitmap 类型 geo 类型 GEOADD (添加地理位置的坐标) GEOPOS (获取地理位置的坐标) GEODIST (计算两个位置之间的距离) GEOHASH (返回一个或多个位置对象的 geohash 值) GEORADIUS (根据用户…

DAF-Net:一种基于域自适应的双分支特征分解融合网络用于红外和可见光图像融合

题目&#xff1a;DAF-Net: A Dual-Branch Feature Decomposition Fusion Network with Domain Adaptive for Infrared and Visible Image Fusion 作者&#xff1a;JianXu发表时间&#xff1a;2024年9月 面临的问题&#xff1a;红外图像擅长捕捉热辐射&#xff0c;特别是在低…

国家能源集团携手海康威视研发攻克融合光谱煤质快检技术

10月24日&#xff0c;在国家能源集团准能集团黑岱沟露天煤矿&#xff0c;安装于准能选煤厂785商品煤胶带机中部的煤质快检核心设备&#xff0c;正在对当天装车外运的商品煤煤质进行实时检测。仅两分钟后&#xff0c;涵盖发热量、水分、灰分、硫分等多项指标的数据信息已传输到到…

前端方案:播放的视频加水印或者文字最佳实践

前言&#xff1a; 很多时候&#xff0c;视频的转码工作在后端&#xff0c;我们前端是拿到可以播放的链接进行播放即可。但是总是会出现一些定制化的需求&#xff0c;比如在视频的某个区域贴上水印、标识或者文字。这个时候大部分是由前端来操作的。 直接去修改播放器里的东西…

c语言指针详解2

c语言指针详解2 1.数组名理解 数组名其实是地址&#xff0c;是数组首元素的地址&#xff08;详解1有提及&#xff09; 我们可以根据打印来确认 我们发现数组名和数组⾸元素的地址打印出的结果⼀模⼀样&#xff0c;数组名就是数组⾸元素(第⼀个元素)的地址。 但是上述结论有…

DataX简介及使用

目录 一、DataX离线同步工具DataX3.0介绍 1.1、 DataX 3.0概览 1.2、特征 1.3、DataX3.0框架设计 1.4、支持的数据元 1.5、DataX3.0核心架构 1.6、DataX 3.0六大核心优势 1.6.1、可靠的数据质量监控 1.6.2、丰富的数据转换功能 1.6.3、精准的速度控制 1.6.4、强劲的…

轻松清理 PC 微信文件,释放存储空间

软件介绍 微信在我们的日常生活中使用频率极高&#xff0c;但随着时间的推移&#xff0c;它占用的存储空间也越来越大。以一个使用了两年时间的微信为例&#xff0c;它可能会占用多达几十G的存储空间。其中大部分都是与自己无关的各大群聊中的文件、视频、图片等内容&#xff…

java导出带图形的word

先看效果图&#xff1a;方法都是一样的&#xff0c;所以数据只做了前两组 第一步需要准备模版&#xff1a; 新建一个word插入图表&#xff0c;选择想要的图表。 编辑图表&#xff1a;营业额表示数字&#xff0c;季度表示文字。其他的样式编辑可根据自己的需求更改&#xff0c;…

从 Vue 2 到 Vue 3:全面升级指南

​&#x1f308;个人主页&#xff1a;前端青山 &#x1f525;系列专栏&#xff1a;Vue篇 &#x1f516;人终将被年少不可得之物困其一生 依旧青山,本期给大家带来Vuet篇专栏内容:Vue-从 Vue 2 到 Vue 3&#xff1a;全面升级指南 前言 随着前端技术的不断发展&#xff0c;Vue.j…

基于大型语言模型的智能网页抓取

Google Gemini 是 Google AI 创建的大型语言模型 (LLM) 系列&#xff0c;可提供最先进的 AI 功能。Gemini 模型包括&#xff1a; Gemini Ultra — 最大、最强大的模型&#xff0c;擅长处理编码、逻辑推理和创意协作等复杂任务。可通过 Gemini Advanced&#xff08;原名 Bard&a…

FreeRTOS任务状态_改进播放控制 任务管理与调度 空闲任务及其钩子函数 两个Delay函数

任务状态_改进播放控制 FreeRTOS源码概述&#xff08;内存管理&#xff0c;入口函数&#xff0c;数据类型和编程规范&#xff09;创建任务&#xff08;声光色影&#xff0c;使用任务参数&#xff09;删除任务&#xff08;使用遥控器控制音乐&#xff09;-CSDN博客https://blog…

网络信息安全工程师证2024年如何报考?了解这几点让你轻松考证!收藏这一篇就够了

网络信息安全工程师是一种专门从事网络安全工作的职业。随着互联网的快速发展和普及&#xff0c;网络安全问题也日益突出&#xff0c;因此网络信息安全工程师的需求也越来越大。 网络信息安全工程师主要负责保护网络系统和数据的安全&#xff0c;防止黑客攻击、病毒侵入、数据泄…