Dotween插件使用

2019-11-08 03:17:06

字體：大中小

來源：轉載

供稿：網友

原文鏈接： http://www.taidous.com/bbs/thread-38061-1-3.html1.基本介紹： a.序列和動畫一樣，但是并不是動畫屬性或是其他什么值而是作為動畫一個群體存在。 b.序列可以無層數限制地被嵌套在任意序列中。 c.序列不需要一個接一個延續，你可以將任意動畫插入到序列中。 d.一個動畫只能用于某一個序列中，意味著不能在多個序列中插入相同動畫。 e.得到主序列的時候，你不能單獨控制其中被嵌套的動畫或序列。 2.創建一個序列的兩步： a.創建一個新的序列作為存儲。 b.在序列中插入回調函數或者動畫。 3.相關方法介紹： DOTween.Sequence() 靜態,返回一個新的空序列。 sequence.Append(Tween tween) 添加一個動畫到序列末尾。(意思就是當序列前面動畫播放完畢時此動畫才開始播放) sequence.AppendCallback(TweenCallback cb) 添加回調函數到序列末尾。(當序列前面動畫播放完畢時會執行此方法) sequence.AppeedInterval(float interval) 添加一段空時間到序列末尾。(當序列前面動畫播放完畢時會延遲一段時間) sequenve.Insert(float time,Tween tween) 插入一段動畫到指定時間。(注意動畫是和原序列當前時間動畫合并重疊) sequenve.InsertCallback(float time,TweenCallback cb) 插入回調函數到序列指定時間。 sequenve.Join(Tween tween) 插入動畫與序列最后一個動畫(這里的最后是指最后加入序列而非序列末尾)同時播放。 sequenve.PRepend、sequenve.PrependCallback、sequenve.PrependInterval 和前面三個類似，這里是加入到序列開頭。 4.注意事項： a.以上方法只能在序列剛被創建之后執行也就是必須是在創建序列同一個代碼塊,或者是當序列暫停時執行。否則無效。 b.一個動畫必須是完全被創建之后才能加入到序列之中,因為加入到序列之后該動畫將會被鎖定。 c.無限循環的動畫是不能被加入到序列中。

d.你可以創建一個序列只有回調函數和延遲，這樣這個序列就當做了一個計時器使用。

5.飄字效果制作：

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

[csharp] view plain copy print?

</pre><pre name=“code” class=“csharp”>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>()); } } }

</pre><pre name="code" class="csharp">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>());        }    }} 二 . DOTween  的  Path 應用.1.基本介紹：   
          如果之前接觸過iTween之類的動畫插件應該對Path這個功能不會太陌生。主要功能就是：a.路徑點的創建和刪除。b.路徑的可視化。c.路徑動畫的控制。需要注意的是：一旦Path動畫開始播放我們就不能對Path路徑有任何修改。當然DOTween對Path集成功能越完善我們要修改就越麻煩：a.物體在Path上的移動作為動畫只有duration的概念，所以我們要模擬速度只能用Length/speed來模擬.b.如果物體和原來的Path動畫有一個定向量的偏移(例如跑酷類游戲的左右)。我們也不能直接改動畫:i.在OnUpdate里面加回調函數設置偏移量。ii.創建一個新的Path路徑然后根據當前的Path路徑加上偏移量。然后將物體定位到當前時間播放。         2.Path路徑動畫的創建：靜態創建：在需要添加Path動畫的物體上掛上 DOTweenPath 組件.a. Shift + Ctrl ： 添加路徑點b. Shift + Alt ： 刪除路徑點動態創建： transform.DOPath(vector3[] waypoints,float duration);a. waypoints ： 路徑點b. duration ： 動畫時間 c. pathtype ： 路徑類型，路徑類型分為線性或者利用CatmullRom插值算法形成的曲線。(默認參數)     d. pathmode ： 路徑模式，主要是用于對物體三個方向上的旋轉的限制。(默認參數)e. resolution ：CatmullRom算法的參數,數值越大曲線越精細,一般5足以，默認為10。(默認參數)f. gizmoColor ：輔助線的顏色,只會在動畫Running時在Secene面板上可見。 （默認參數） 3.Path路徑動畫的屬性：一般動畫有的屬性Path都有，我就介紹幾個獨特的屬性：a. Ease ：動畫類型,其實前面動畫也有這個屬性，我只是想推薦一個網址：http://robertpenner.com/easing/easing_demo.htmlb. ClosePath ：封閉路徑，如果勾選此屬性路徑將會形成一個封閉環。c. LocalMovement ：局部移動，如果勾選此屬性將會按照局部坐標移動。d. Orientation ：運動朝向，分為ToPath朝向路線LookAtTran朝向Tran和LookatPos朝向點.e. LookAhead ：朝向前瞻性，數值越大朝向約向靠近更前方的點。f. Relative ：點相對，表示路徑點是否與物體為相對的。4.Path路徑動畫的相關方法：一般動畫有的方法Path都有，我就介紹幾個獨特的方法：a. SetOptions(bool closePath,AxisConstraint lockPos,AxisConstraint lockRota);i.第一個參數不用說上面有。ii.路徑上三個維度的位置限制，給的參數為AxisConstraint.X,那么路徑在X上位置不會變化。ii.路徑上三個維度的方向限制，給的參數為AxisConstraint.X,那么路徑在X上方向不會變化。b. SetLookAt()  設置Path動畫 Orientation 屬性的。c. PathLength()  返回路徑長度。d. PathGetPoint(float pathPecentage); 參數為0~1小數,返回路徑上小數百分比對應的點。e. PathGetDrawPoint(float pathPecentage);參數為返回構成路徑點的個數。注意d.e兩個方法，如果返回為Vector3.zero或者null.表示路徑無效、路徑尚未初始化或者這不是一個路徑動畫。5.簡易塔防的路徑創建：
a.首先創建一個地形，然后畫出路徑，根據路徑建立拉出山丘等等最后貼圖b.導入DOTween包和物體模型，然后再物體模型上添加 DOTweenPath 組件。(我這里就用一個妹子的模型)
c.利用 Shift + Ctrl 沿著路徑添加路徑點形成一條完整路徑。(因為這里所有點都在同一Y軸上建議用Top視角)
d.設置一下Orientation為To Path 以及 duration 。e.調整Camera的位置，就可以直接運行查看效果了。