zoukankan      html  css  js  c++  java
  • 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

  • 相关阅读:
    共享经济
    滑动用hammer
    js 数组去重 的5种方法
    js ajax上传图片到服务器
    js url图片转bese64
    去除移动端 a标签 点击有一个 阴影效果
    css 文字超出变 ... 点点点
    h5手势库 hammer.js
    xshell linux传文件
    IO流(Properties存取)
  • 原文地址:https://www.cnblogs.com/xyptechnology/p/7574890.html
Copyright © 2011-2022 走看看