一、过程简介
这里首先你需要会普通的用代码做Dotween的动画,这里我们只需要学习如何组合起来。
原理:DOtween里面带了一个功能叫做队列,可以连续做动画,需要写代码。
基本过程:
1.它和平时声明其他东西一样,别人是Int i;这个是Sequence sequence;名称也是可以和i一样,可以自己起的。
2.和数组一样,需要先初始化一下,于是就有了sequence = DOTween.Sequence();
3.你需要往里面添加你想要添加的动画。
二、动画添加方式
<一>、普通连续动画(放大图片;缩小图片;再放大图片)
基本逻辑:
1.创建一个队列
2.在队列里按照顺序列出想要连续播放的动画
制作过程:
//先创建一个队列
Sequence sequence = DOTween.Sequence();
//在队列里按顺序加入想要播放的动画
sequence.Append(_transform.DOScale(new Vector3(1.2f,1.2f,1.2f),0.8f));//放大图片
sequence.Append(_transform.DOScale(new Vector3(1f, 1f, 1f), 0.5f));//缩小图片
sequence.Append(_transform.DOScale(new Vector3(1.2f,1.2f,1.2f),0.8f));//再放大图片
<二>、常用功能(等待、循环播放)
如果说我们动画和动画之间需要等待:
(放大图片;在这等一秒再放下一个;缩小图片;在这等两秒在放下一个;再放大图片)
这个插件也带了一个专用的代码:sequence.AppendInterval();
那么代码将会变成:
//先创建一个队列
Sequence sequence = DOTween.Sequence();
//在队列里按顺序加入想要播放的动画
sequence.Append(_transform.DOScale(new Vector3(1.2f,1.2f,1.2f),0.8f));//放大图片
sequence.AppendInterval(1);
sequence.Append(_transform.DOScale(new Vector3(1f, 1f, 1f), 0.5f));//缩小图片
sequence.AppendInterval(2);
sequence.Append(_transform.DOScale(new Vector3(1.2f,1.2f,1.2f),0.8f));//再放大图片
如果我们希望这个队列不停地循环播放,我们也可以设置;
//先创建一个队列
Sequence sequence = DOTween.Sequence();
//在队列里按顺序加入想要播放的动画
sequence.Append(_transform.DOScale(new Vector3(1.2f,1.2f,1.2f),0.8f));//放大图片
sequence.AppendInterval(1);
sequence.Append(_transform.DOScale(new Vector3(1f, 1f, 1f), 0.5f));//缩小图片
sequence.AppendInterval(2);
sequence.Append(_transform.DOScale(new Vector3(1.2f,1.2f,1.2f),0.8f));//再放大图片
//这个队列循环播放
sequence.SetLoops(-1);
<三>、组合使用(等待、循环播放)
技巧:如果我们希望每次播完这一套动画;等5秒再播放下一次
可以在开头或者结尾直接写上等待时间,就可以做到啦。
//先创建一个队列
Sequence sequence = DOTween.Sequence();
//在队列里按顺序加入想要播放的动画
sequence.Append(_transform.DOScale(new Vector3(1.2f,1.2f,1.2f),0.8f));//放大图片
sequence.AppendInterval(1);
sequence.Append(_transform.DOScale(new Vector3(1f, 1f, 1f), 0.5f));//缩小图片
sequence.AppendInterval(2);
sequence.Append(_transform.DOScale(new Vector3(1.2f,1.2f,1.2f),0.8f));//再放大图片
sequence.AppendInterval(5); //希望等待五秒再重播
//这个队列循环播放
sequence.SetLoops(-1);//这里也可以不写-1,写其他数字就是循环播放几次以后就不播了
三、队列常用方法
<一>、同时进行两个动画
以上的连续动画是第一个放完播放第二个,有时候我们希望两个动画同时播放
方法:sequence.Join()
详细解释:这个代码的意思是和上一个代码一起播放,所以它是上一行开始,它就开始
需求:放大图片的同时,图片消失
//先创建一个队列
Sequence sequence = DOTween.Sequence();
//在队列里按顺序加入想要播放的动画
sequence.Append(_transform.DOScale(new Vector3(1.2f,1.2f,1.2f),0.8f));//放大图片
sequence.Join(_transform.GetComponent<CanvasGroup>().DOFade(0, 1)); //图片消失
<二>、动画执行到某一步,执行一个方法
这里以按钮为例,经常需要按钮放大、跳转页面、按钮再缩小
分析:“跳到下一个界面”是一个方法,不是一个动画了
总结:队列里放方法的代码为sequence.AppendCallback(方法名称);
详解:下面提供四种写法
如果方法为(纯方法)
void Apple(){}
//队列为
Sequence sequence = DOTween.Sequence();
sequence.AppendCallback(Apple);
如果方法为(带了参数)
void Apple(int a){}
//队列为
int b = 5;
Sequence sequence = DOTween.Sequence();
sequence.AppendCallback(()=>Apple(b));
如果方法为(只有一行,想直接写)
Transform c;
c.gameObject.SetActive(false);
//队列为
Sequence sequence = DOTween.Sequence();
sequence.AppendCallback(() => c.gameObject.SetActive(false));
如果方法为(有好多行,但也想直接写)
Transform c;
c.gameObject.SetActive(false);
c.gameObject.SetActive(true);
c.gameObject.SetActive(false);
//队列为
Sequence sequence = DOTween.Sequence();
sequence.AppendCallback(() =>
{c.gameObject.SetActive(false);
c.gameObject.SetActive(true);
c.gameObject.SetActive(false);});
//这里可以继续往下面加
注:这些方法都是在上一个动画完成才执行的,如果你问,如果希望和动画同时进行怎么办?那你可以把方法放在动画上面,动画用Join。
四、sequence的方法
<一>、常用方法
上面是写好了一个动画,第一步干什么,第二步干什么,下面来控制这个动画。
sequence.Play(); //动画播放
sequence.Pause(); //动画暂停
sequence.Restart(); //动画重播
sequence.Rewind(); //动画回到开始
sequence.Kill(); //删除动画
以上等(写的不全)都是可以应用的
但是,sequence.AppendCallback,这个里面我们是放的方法,所以,一旦这个方法被执行,是没办法用动画的形式暂停或者停止的这个方法的。
sequence.AppendCallback(() => transform.DOScale(0, 1).SetLoops(-1));
以上例:虽然我写的是一个动画,但是是用方法的形式去写的,那么后面无论你清除,重播还是删除sequence还是对这个队列做其他操作也好,transform.DOScale(0, 1).SetLoops(-1),这个行为是没办法通过sequence消除了。
<二>、使用备注
你创建的动画是默认自动播放的,同时也是默认播放完自动删除上面的动画的,所以如果你希望重复使用的的动画,你就不能让他们把它删了。在创建动画的时候,就要把自动删除这个功能关掉,代码如下。
sequence.SetAutoKill(false);
五、一些小坑
小坑一:
//有时候当fade和scale,放在一起执行时,必须把fade放在前面才行,原因不明
sequence.Append(puzzle_now.GetComponent<CanvasGroup>().DOFade(0, 0.5f));
sequence.Join(puzzle_now.transform.DOScale(new Vector3(2f, 2f, 2f), 0.5f));
小坑二:
//这个代码执行失败
sequence.AppendCallback(() => picNext.GetComponent<Image>().fillOrigin = 1);
小坑三:
用循环时,括号里面不能有太多索引
//这样写就可能失效
for (int i = 0; i < contentsequenceNum; i++)
{
contentSequence[i].AppendCallback(() => secondaryInterfaceP.GetChild(i).GetComponent<CanvasGroup>().blocksRaycasts = false);
}
//改成下面这样既可
for (int i = 0; i < contentsequenceNum; i++)
{
Transform tran = secondaryInterfaceP.GetChild(i);
contentSequence[i].AppendCallback(() => tran.GetComponent<CanvasGroup>().blocksRaycasts = false);
}