【Unity】DoTween插件的使用

DoTween从何而来

在NGUI中提供了UITween 来支持UI的动画编写，极度降低了代码的复杂度，然而，我们的UGUI中并没有类似UITween的功能进行支撑，所以我们用到了第三方插件 DoTween。

在我们Unity官方的UGUI的Demo中UI的动画是使用Animator来制作的，试想一下，如果我们的UI如果需要动画效果，那么就需要使用 AnimationController，除此之外，还需要去编辑动画，如果数量不多

的UI可以这样，如果UI过多的需要动画，那么工作量就有些庞大了。所以现在市面上绝大多数使用UGUI开发的公司都使用了DoTween来辅助完成UI动画的设计，当然，DoTween也可以应用到3D物体上

记得大概2014年的时候就有了这款插件，这款插件最开始的时候就是应用到3D游戏物体上的动画，后来才被扩展到UGUI中

DoTween简介

DoTween分 免费版 和 Pro版 两个版本：

DoTween官网：http://dotween.demigiant.com/index.php

免费版下载：http://dotween.demigiant.com/download.php

Pro版下载：http://dotween.demigiant.com/pro.php

DoTween官方文档：http://dotween.demigiant.com/documentation.php

Pro版本DOTween Animation和DOTween Path这两个组件，支持可视化编辑

献上一份破解版的DoTween插件仅供学习使用：https://pan.baidu.com/s/1coypie

DoTween的使用

1.首先在官网上下载DoTween的最新版

注意：从官网下载的是zip的压缩包，解压之后需要将文件夹手动拖拽到工程中去

2.成功导入之后Unity的工程中在Unity编辑器中会出现Tools一项

出现之后点击Tools->DOTween Utility Panel

3.之后会弹出DoTween的面板，点击SetUp DoTween完成自动设置

如果你不写代码的话，前面的3个步骤就完成了DoTween的配置

但是，如果你要在代码中使用DoTween，那么在代码中，使用DoTween的时候我们需要引入using DG.Tweening;

DoTween代码示例

值的渐变：

DoTween.To()提供了一个通用的方法，可以改变一个值，int，float

或者vector3等等…

using UnityEngine;
using System.Collections;
// 引入DoTween命名空间
using DG.Tweening;
public class FirstDoTween : MonoBehaviour
｛
    private float myValue = 0;
    // Use this for initialization
    void Start ()
    ｛
        // 参数1：需要改变的值
        // 参数2：x是myValue变成"endValue"的过程不断返回的值
        // 参数3：endValue 目标值
        // 参数4：myValue变成endValue需要的时间
        // 将myValue变成"endValue"所对应的值
        // DOTween.To (() => myValue, x => myValue = x, 5, 5);
        //-【简化后】------------------------------------
        DOTween.To (() => myValue, x => transform.position = new Vector3 (x, 0, 0), 5, 5);
    ｝
    // Update is called once per frame
    void Update ()
    ｛
//      transform.position = new Vector3 (myValue, 0, 0);
    ｝
｝

物体Transform属性值的改变



using UnityEngine;
using System.Collections;
using DG.Tweening;
public class MyDoMove : MonoBehaviour
｛
    // Update is called once per frame
    void Update ()
    ｛
        // 让当前物体从x=-10，移动到x=10，整个过程必须是9秒钟完成
//      transform.DOMoveX (10, 9);
        transform.DOLocalMoveX (10, 9);
//      transform.DOMoveY (5, 2);
//      transform.position = Vector3.Lerp (transform.position, new Vector3 (10, 0, 0), Time.deltaTime);
    ｝
｝

播放往返动画

重点：DoTween的每一句代码都会产生一个动画，这个动画是Tweener类型的，可以接收并用代码进行一系列设置

using UnityEngine;
using System.Collections;
using UnityEngine.UI;
using DG.Tweening;
public class MoveImage : MonoBehaviour
｛
    private Transform _imageTrans;
    // Tweener是DoTween动画的返回值类型
    private Tweener _tweener;
    // 图片是否在场景中
    private bool OnScene = false;
    void Start ()
    ｛
        _imageTrans = GameObject.Find ("Image").transform;
        // 给按钮添加点击事件
        GetComponent <Button> ().onClick.AddListener (OnButtonClick);
        //-----------------------------------------
        // 将image图片x的坐标移动到0点
        _tweener = _imageTrans.DOLocalMoveX (0, 0.5f);
        // 暂停动画播放
        _tweener.Pause ();
        // 动画播放完成之后，不自动销毁
        _tweener.SetAutoKill (false);
    ｝
    public void OnButtonClick ()
    ｛
//      // 播放动画（动画播放完成之后会自动删除DoTween动画）
//      _tweener.Play ();
        //-----------------------------------------
        // 如果Image不在场景中，就移动到Canvas中
        if (OnScene == false) ｛
            // 向前播放动画
            _tweener.PlayForward ();
            OnScene = true;
        ｝ else if (OnScene == true) ｛
            _tweener.PlayBackwards ();
            OnScene = false;
        ｝
    ｝
｝

设置动画的运动方式，如：匀速运动

设置循环次数

using UnityEngine;
using System.Collections;
using DG.Tweening;
public class MyMove4 : MonoBehaviour
｛
    // Use this for initialization
    void Start ()
    ｛
        // 从5的位置，移动到当前物体所在的位置
        //      transform.DOMoveX (5, 3).From ();
        //-----------------------------------------
        // 让物体的x坐标从当前位置移动到5的位置，在3秒钟内
        Tweener tween = transform.DOMoveX (10, 3);
        // 设置匀速移动
        tween.SetEase (Ease.Linear);
        // 设置循环次数,-1表示无限循环
//      tween.SetLoops (-1);
        // 动画播放完成之后的回调函数
        tween.OnComplete (TweenComplete);
    ｝
    public void TweenComplete ()
    ｛
        Debug.Log ("动画播放完成啦！");
    ｝
｝

控制UGUI的文本组件，文字以打印机的特效显示

using UnityEngine;
using System.Collections;
using UnityEngine.UI;
using DG.Tweening;
public class DoText : MonoBehaviour
｛
    private Text _text;
    // Use this for initialization
    void Start ()
    ｛
        string str = "主播Miss在微博上晒出一张健身照 网友评论都炸了!"; 
        _text = GetComponent <Text> ();
        _text.DOText (str, 5);
//      _text.DOColor (Color.yellow, 5);
        _text.DOBlendableColor (Color.yellow, 5);
    ｝
    // Update is called once per frame
    void Update ()
    ｛
    ｝
｝

屏幕震动效果

其实就是让摄像机的位置动了几下

using UnityEngine;
using System.Collections;
using DG.Tweening;
public class DoShake : MonoBehaviour
｛
    // Use this for initialization
    void Start ()
    ｛
        transform.DOShakePosition (2f, new Vector3 (2, 2, 3));
        transform.DOShakeScale (2, new Vector3 (3, 3, 3));
    ｝
    // Update is called once per frame
    void Update ()
    ｛
    ｝
｝

还有很多很多功能就不一一赘述了，在官网的文档里面介绍了DoTween的所有方法，几乎对所有的组件都进行了一个类似于上面的扩展，大家自行学习吧。

官方文档地址：http://dotween.demigiant.com/documentation.php