cc.Node.动作

Posted 2020-10-22

Action动作

1.Action类是动作命令,我们创建action,然后节点运行action就能够执行Action的动作

2.Action分为两类；

(1)即时动作:       瞬时就完成    ActionInstant

(2)时间间隔动作:要一段时间才能完成ActionIntervial

3.runAction:节点运行这个action动作.

5.以下是常用action，TO和BY的区别是:

TO是目标.  BY是变化.

6.cc.MoveTo cc.MoveTo 

MoveTo:移动到指定的坐标，移动到目标位置。

MoveBy:分别移动多少. 移动指定的距离.

返回的都是一个ActionIntervial时间间隔动作

    //第一个参数就是多久执行
    //第二个参数可以是一个数,那么他第三个参数就是y
    //如果他是一个二维向量 那么不需要第三个参数。
    //这样也是可以的 cc.moveTo(3,x,y)
    var mto = cc.moveTo(3,cc,p(100,100));
this.node.runAction(mto);

7.rotateTo和rotateBy

rotateTo之后他的rotate属性就是170,

因为他的意思就是旋转到170度,耗时2秒钟.

//旋转到170度
var rto = cc.rotateTo(2,170);
this.node.runAction(rto);

rotateBy旋转变化多少度

//在原来的基础上变化75度,可正可负
var rby = cc.rotateBy(1,75);
this.node.runAction(rto);

9.scaleTo和scaleBy 缩放

按节点的大小缩放指定的倍数

放大或缩小到某一比例

这里会发生由大大小的动作:因为你当前是2,我要缩放到1.1

所以他会缩小.

this.node.scale = 2;
var sto = cc.scaleTo(1,1.1);
this.node.runAction(sto);

按指定的倍数缩放节点大小

所就是说按当前的scale来乘以指定的倍数

如果说当前scale是1 那就是1.1*scale

比如你的scale是2 那就是缩放2.2倍

这里会发生放大的动画,因为他是2的1.1倍,就是2.2倍缩放.

this.node.scale = 2;
var sby = cc.scaleBy(1,1.1);
this.node.runAction(sby);

10.fadeOut淡入,fadeIn淡出  原理就是改变透明度；

fadeTo渐变到指定的透明度

比如一个游戏人物死亡了,过一会他的尸体就慢慢消失.

淡入

//先让透明度为0
this.node.opacity = 0;
var fin = cc.fadeIn(2);
this.node.runAction(fin);

淡出 就是透明度为0 实际上这个物体还是在的

var fout = cc.fadeOut(2);
this.node.runAction(fout);

指定透明度 

var fout = cc.fadeTo(1,128);
this.node.runAction(fout);

11.callFunc 执行回调函数

这里会瞬间执行这个函数动作.

var func = cc.callFunc(function(){
console.log("call func actin!!!");
},this);
this.node.runAction(func);

12.sequence 顺序执行动作,创建的动作将按顺序依次运行

比如说我移动一个物体之后,又要隐藏这个物体.

这时候就有多个action,这个相当于动作数组,依次执行

var ac1 = cc.moveTo(1,1,100);
var ac2 = cc.fadeOut(0.5);
var seq = cc.sequence(ac1,ac2);
this.node.runAction(seq);

这时候回调函数在这里的作用就有用了,比如角色死亡渐渐

消失之后,透明度为0,但是物体还在,这时候就要用回调函数

来删除这个节点，或者做一些其他的内容.

var ac1 = cc.moveTo(1,1,100);
var ac2 = cc.fadeOut(0.5);
var cfunc = cc.callFunc(function(){
console.log("我是最后一个动作");
},this);
//将动作添加到队列
var seq = cc.sequence(ac1,ac2,cfunc);
this.node.runAction(seq);

13.一个节点可以同时运行多个action,

比如一边移动,一边慢慢隐藏

var ac1 = cc.moveTo(2,1,100);
var ac2 = cc.fadeOut(0.5);
this.node.runAction(ac1);
this.node.runAction(ac2);

14.重复执行一个动作   cc.repeat 

参数1是重复的动作,参数2是重复的次数

比如说我要他放大缩小然后重复执行

var s1 = cc.scaleTo(0.8,1.1);
var s2 = cc.scaleTo(0.8,0.8);
var seq = cc.sequence([s1,s2]);
var rep = cc.repeat(seq,4);
this.node.runAction(rep);

15.永远重复执行一个动作 cc.repeatForever()

var s1 = cc.scaleTo(0.8,1.1);
var s2 = cc.scaleTo(0.8,0.8);
var seq = cc.sequence([s1,s2]);
var rep = cc.repeatForever(seq);
this.node.runAction(rep);

16.缓冲机制,缓动动作 easing

他和动作执行的时间是一致的.

回弹的效果,比如一个窗口打开,弹很大,然后又弹回一点

这些可以在API文档里找到.

测试一个常用的,一个界面飞出去弹出来.

cc.easeBackOut 快速移动超出目标,然后慢慢回到目标

var m = cc.moveTo(1,300,0).easing(cc.easeBackOut());
this.node.runAction(m);

17.stopAction停止运行指定的动作

var m = cc.rotateBy(3,360).easing(cc.easeCubicActionOut());
var rf = cc.repeatForever(m);
this.node.runAction(rf);
this.node.stopAction(rf);

18.stopAllActions停止运行所有动作

var m = cc.rotateBy(3,360).easing(cc.easeCubicActionOut());
var rf = cc.repeatForever(m);
this.node.runAction(rf);
this.node.stopAllActions();

19.延时 cc.delayTime

比如我们有一个特效出来了,让他3秒后删除

//延时3秒钟
var delay = cc.delayTime(3);
var fout = cc.fadeOut(0.5);
var end_func = cc.callFunc(function(){
console.log("我消失啦");
}.bind(this));
var seq = cc.sequence(delay,fout,end_func);
this.node.runAction(seq);