Unity 中使用DoTween插件

DoTween簡介

DoTween分 免費版 和 Pro版 兩個版本 
DoTween官網：http://dotween.demigiant.com/index.php 
免費版下載：http://dotween.demigiant.com/download.php 
Pro版下載：http://dotween.demigiant.com/pro.php 
DoTween官方文檔所有API用法以及說明都可以到官方文檔查看：http://dotween.demigiant.com/documentation.php

Pro版本DOTween Animation和DOTween Path這兩個組件，支持可視化編輯

破解版的DoTween插件僅供學習使用：https://pan.baidu.com/s/1coypie

 

1.主要的方法

1.以DO開頭的方法：就是補間動畫的方法。例如：transform.DOMoveX(100,1)

2.以Set開頭的方法：設置補間動畫的一些屬性。例如：myTween.SetLoops(4, LoopType.Yoyo)

3.以On開頭的方法：補間動畫的回調方法。例如：myTween.OnStart(myStartFunction)

2.命名法

Tweener：補間動畫

Sequence：相當於一個Tweener的鏈表，可以通過執行一個Sequence來順序執行組合的Tweener

Tween：Tweener + Sequence

Nested tween：Sequence中的一個Tweener稱為一個Nested tween

3.動畫組合方式

Sequence.Append構建緩動序列，同時Join方法支持並行緩動。

Append是在序列的末端插入一個Tweener，如果前面的Tweener都執行完了，就執行這個Tweener。

Join也是在序列末端插入一個Tweener，不同的是，這個Tweener將與前一個非Join加進來的Tweener並行執行。

 

3.動畫插入介紹  

sequence.Append(Tween tween)   添加一個動畫到序列末尾。(意思就是當序列前面動畫播放完畢時此動畫才開始播放) 順序播放

   
sequence.AppendCallback(TweenCallback cb) 添加回調函數到序列末尾。(當序列前面動畫播放完畢時會執行此方法)

sequence.AppeedInterval(float interval) 添加一段空時間到序列末尾。(當序列前面動畫播放完畢時會延遲一段時間)

sequenve.Insert(float time,Tween tween)  插入一段動畫到指定時間。(注意動畫是和原序列當前時間動畫合並重疊)(可以隨意的控制加入tween的時間節點)

sequenve.InsertCallback(float time,TweenCallback cb)    插入回調函數到序列指定時間。

sequenve.Join(Tween tween)  插入動畫與序列最后一個動畫(這里的最后是指最后加入序列而非序列末尾)同時播放。

sequenve.Prepend、sequenve.PrependCallback、sequenve.PrependInterval 和前面三個類似，這里是加入到序列開頭。

動畫插入注意事項：
1.以上方法只能在序列剛被創建之后執行也就是必須是在創建序列同一個代碼塊,或者是當序列暫停時執行。否則無效。
2.一個動畫必須是完全被創建之后才能加入到序列之中,因為加入到序列之后該動畫將會被鎖定。
3.無限循環的動畫是不能被加入到序列中。
4.你可以創建一個序列只有回調函數和延遲，這樣這個序列就當做了一個計時器使用。

4.動畫回調介紹

   1.OnComplete

例：transform.DOMoveX(4, 1).OnComplete(MyCallback);／／設置回調，在tween到達完成時觸發，所有循環都包含在內。

2.OnKill

例：transform.DOMoveX(4, 1).OnKill(MyCallback);／／設置一個回調，在tween被刪除的那一刻被觸發

3.OnPlay

例：transform.DOMoveX(4, 1).OnPlay(MyCallback);／／設置一個回調，當動畫設置為播放狀態時，在任何最終延遲之后將被觸發。每次動畫從暫停狀態恢復播放時也稱為。

4.OnPause 

例：transform.DOMoveX(4, 1).OnPause(MyCallback);／／設置回調，當動畫狀態從播放狀態更改為暫停時將被觸發

5.OnRewind

例：transform.DOMoveX(4, 1).OnRewind(MyCallback);／／設置一個回調播放時通過調用或到達起始位置來重新播放時觸發

6.OnStart

例：transform.DOMoveX(4, 1).OnStart(MyCallback);／／設置一個回調，當動畫開始時將被觸發

7.OnStepComplete

例：transform.DOMoveX(4, 1).OnStepComplete(MyCallback);／／設置一個回調，每次動畫完成一個循環循環后將被觸發。

8.OnUpdate

例：transform.DOMoveX(4, 1).OnUpdate(MyCallback);//設置一個回調，將在每次動畫更新時觸發。

9.OnWaypointChange設置當路徑補間的當前路點更改時將觸發的回調。 這是一個特殊的回調，與其他回調相反，需要接受類型的參數int

void Start() { transform.DOPath(waypoints, 1).OnWaypointChange(MyCallback); } void MyCallback(int waypointIndex) { Debug.Log("Waypoint index changed to " + waypointIndex); }

注意：附加到嵌套動畫的回調依然會按照正確的順序工作。

下面加入幾個例子來溫習一下上面介紹的動畫 組合（飄字效果制作）

 

 

 

 分析：其實整個動畫就是三部分(當然為了使得效果更加漂亮可以加更多的細節在里面,比如放大縮小)
                    a.字體向上移動同時顏色Alpha從0漸變到1。
                    b.延遲1秒，字體顯示一秒鍾。
                    c.字體向上移動同時顏色Alpha從1漸變到0。
             

 

using UnityEngine;
using System.Collections;
using UnityEngine.UI;
using DG.Tweening;
public class FlyText : MonoBehaviour {

    public void FlyTo(Graphic graphic)
    {
        RectTransform rt = graphic.rectTransform;
        Color c = graphic.color;
        c.a = 0;
        graphic.color = c;                                                   //先將字體透明
        Sequence mySequence = DOTween.Sequence();                            //創建空序列
        Tweener move1 = rt.DOMoveY(rt.position.y + 20, 0.5f);                //創建向上移動的第一個動畫
        Tweener move2 = rt.DOMoveY(rt.position.y + 40, 0.5f);                //創建向上移動的第二個動畫
        Tweener alpha1 = graphic.DOColor(new Color(c.r, c.g, c.b, 1), 0.5f); //創建Alpha由0到1漸變的動畫
        Tweener alpha2 = graphic.DOColor(new Color(c.r, c.g, c.b, 0), 0.5f); //創建Alpha由1到0漸變的動畫
        mySequence.Append(move1);                  //先添加向上移動的動畫
        mySequence.Join(alpha1);                   //同時執行Alpha由0到1漸變的動畫
        mySequence.AppendInterval(1);              //延遲1秒鍾
        mySequence.Append(move2);                  //添加向上移動的動畫
        mySequence.Join(alpha2);                   //同時執行Alpha由1到0漸變的動畫
    }
    public void Update()
    {
        if(Input.GetMouseButtonDown(0))
        {
            FlyTo(GetComponent<Text>());
        }
    }
}

 

--彈窗動畫 
function CUIManager:ShowWindows(uiobj)
    local rt = uiobj.transform
    rt.transform.position = Vector3.New(0, 0, 0)                        
    rt.transform.localScale = Vector3.New(1, 1, 1)
    local scalTime = 0.05
    local m_scale = rt:DOScale(Vector3(1.1, 1.1, 1), scalTime)
    m_scale:SetEase(DG.Tweening.Ease.Linear)
    m_scale:SetLoops(2, DG.Tweening.LoopType.Yoyo) 
    m_scale = rt:DOScale(Vector3(0.9, 0.9, 1), scalTime)
    m_scale:SetEase(DG.Tweening.Ease.Linear)
    m_scale:SetLoops(2, DG.Tweening.LoopType.Yoyo) 
    rt.transform:DOShakePosition(scalTime, Vector3(10, 10, 10))
end

 

void acTest()
{
// 讓當前物體從x=-10，移動到x=10，整個過程必須是9秒鍾完成
 _tweener = _imageTrans.DOLocalMoveX (10, 9);
// 向前播放動畫
 _tweener.PlayForward ();
／／倒着播放
_tweener.PlayBackwards ();
// 設置勻速移動
_tweener.SetEase (Ease.Linear);
// 設置循環次數,-1表示無限循環
_tweener.SetLoops (-1);
// 動畫播放完成之后的回調函數
_tweener.OnComplete (TweenComplete);
   
}

 

　　

//控制UGUI的文本組件，文字以打印機的特效顯示
void PrintStr ()
{
        string str = "打印幾個字!"; 

        _text = GetComponent <Text> ();
        _text.DOText (str, 5);

        // _text.DOColor (Color.yellow, 5);
        _text.DOBlendableColor (Color.yellow, 5);
} 

 

//屏幕震動效果 
void Shake()
{
    transform.DOShakePosition (2f, new Vector3 (2, 2, 3));
    transform.DOShakeScale (2, new Vector3 (3, 3, 3));
}

 

操作Tweener(有三種方法)：

1.DOTween靜態方法
// Pauses all tweens  
DOTween.PauseAll();  
// Pauses all tweens that have "badoom" as an id  
DOTween.Pause("badoom");  
// Pauses all tweens that have someTransform as a target  
DOTween.Pause(someTransform);  

2.Tweener方法
 myTween.Pause();  

3.組件.+以DO開頭的方法
transform.DOPause();

 

5.屬性設置 

SetAs（Tween tween \ TweenParams tweenParams）

設置tween（id，ease，loops，delay，timeScale，callbacks等）的參數作為給定的參數或者給予TweenParams對象。 
注意：如果動畫已經開始，則沒有任何效果。

例：

// Store settings for an infinite looping tween with elastic ease

TweenParams tParms = new TweenParams().SetLoops(-1).SetEase(Ease.OutElastic);

// Apply them to a couple of tweens

transformA.DOMoveX(15, 1).SetAs(tParms);

transformB.DOMoveY(10, 1).SetAs(tParms);

 

tolua 中使用組合動畫 

function  StepComplete ()  
   logError("循環動畫中單次完成回調！")  
end  
  
function  Complete ()  
   logError("動畫完成回調！")  
end  
  
Panel.Light[1]:GetComponent('Image'):DOFade(0,2)  
Panel.Light[1]:GetComponent('Image'):DOColor(Color.New(1,1,1,0.5),2)  
Panel.Light[1].transform:DOLocalMoveY(-300,-100, false):SetEase(DG.Tweening.Ease.Linear):SetLoops(-1):OnStepComplete( StepComplete )  
  
local sequence = DG.Tweening.DOTween.Sequence()   --動畫列隊  
sequence:Append(  Panel.Light[1]:GetComponent("Image"):DOFade(1,1.5))  
sequence:Append(  Panel.Light[1]:GetComponent("Image"):DOFade(0,1.5))  
sequence:Play()    
sequence:OnComplete(Complete) 

 雨松Dotween使用實例：http://www.xuanyusong.com/archives/3330

更多動畫使用例子請參考強哥的私房菜博客：http://blog.csdn.net/liqiangeastsun/article/details/45892907

 更多動畫移動類型查看：http://robertpenner.com/easing/easing_demo.html

 更多動畫API使用請參考DoTween官方文檔：http://dotween.demigiant.com/documentation.php