在Cocos Creator游戲開(kāi)發(fā)中，動(dòng)作特效是經(jīng)常使用的，本文我們就一起來(lái)歸納總結(jié)下。

一、 Action簡(jiǎn)介

1: Action類(lèi)是動(dòng)作命令，創(chuàng)建Action后節(jié)點(diǎn)運(yùn)行action就能執(zhí)行Action的動(dòng)作;

2: Action分為兩類(lèi):

(1) 瞬時(shí)就完成的ActionInstant， (2) 要一段時(shí)間后才能完成ActionInterval;

3: 節(jié)點(diǎn)運(yùn)行action： cc.Node runAction: ;

4: 移動(dòng)：cc.moveTo, cc.moveBy ?To: 目標(biāo) By: 變化

5: 旋轉(zhuǎn)：cc.roateBy, cc.rotateTo,

6: 縮放：cc.scaleBy, cc.scaleTo,

7: 漸變：cc.fadeOut(淡出), cc.fadeIn(淡入): ?cc.fadeTo();

8: 回調(diào)：cc.callFunc, cc.delayTime

9: 序列：cc.sequnce, cc.repeat, cc.repeatForever，spawn

10: 緩動(dòng)：Action easing(緩動(dòng)的方式): ?加上緩動(dòng)特效, cc.easeXXXXX查看文檔設(shè)置自己想要的緩動(dòng)對(duì)象

11: 停止運(yùn)行action：stopAction;

12: 停止所有的action：stopAllActions;

二、 案例演示

?// 1: Action類(lèi)是動(dòng)作命令，創(chuàng)建Action后節(jié)點(diǎn)運(yùn)行action就能執(zhí)行Action的動(dòng)作;

// 2: Action分為兩類(lèi):

// (1) 瞬時(shí)就完成的ActionInstant， (2) 要一段時(shí)間后才能完成ActionInterval;

// 3: 節(jié)點(diǎn)運(yùn)行action： cc.Node runAction: ;

// 4: 移動(dòng)：cc.moveTo, cc.moveBy ?To: 目標(biāo) By: 變化

//let mt : cc.Action = cc.moveTo(1, 300, 200);

//let mt : cc.Action = cc.moveTo(1, cc.v2(300, 200));

// this.node.runAction(mt);

// let mb : cc.Action = cc.moveBy(1, cc.v2(300, 200));

// this.node.runAction(mb);

// 5: 旋轉(zhuǎn)：cc.roateBy, cc.rotateTo,

// let rb : cc.Action = cc.rotateBy(1, -45);

// this.node.runAction(rb);

// let rt : cc.Action = cc.rotateTo(1, 45);

// this.node.runAction(rt);

// 6: 縮放：cc.scaleBy, cc.scaleTo,

//this.node.scaleX = 2;

// 在原有基礎(chǔ)之上縮放，scaleX = 2， scaleX = 2*2， scaleY = 1 * 2

// let sb : cc.Action = cc.scaleBy(1, 2, 2); ? // 相對(duì)于節(jié)點(diǎn)原有縮放

// this.node.runAction(sb);

// 縮放到，某個(gè)比例，與原有縮放值無(wú)關(guān)

// let st : cc.Action = cc.scaleTo(1, 2, 2);

// this.node.runAction(st);

// 7: 漸變：cc.fadeOut(淡出), cc.fadeIn(淡入): ?cc.fadeTo();

// let fout : cc.Action = cc.fadeOut(1);

// this.node.runAction(fout);

// this.node.opacity = 0;

// let fin : cc.Action = cc.fadeIn(1);

// this.node.runAction(fin);

// let ft : cc.Action = cc.fadeTo(1, 110);

// //this.node.runAction(ft);

// // 8: 回調(diào)：cc.callFunc, cc.delayTime

// let d : cc.Action = cc.delayTime(0.3);

// let self = this;

// let end_fun : cc.Action = cc.callFunc(function(){

// ? ? console.log("節(jié)點(diǎn)已經(jīng)變成半透明了！");

// ? ? //this.node.removeFromPrarent();

// ? ? self.node.removeFromParent();

// ? ? console.log("節(jié)點(diǎn)被移出");

// });

// let seq : any = cc.sequence([ft, d, end_fun]);

// this.node.runAction(seq);

// 9: 序列：cc.sequnce, cc.repeat, cc.repeatForever

// let r : cc.Action = cc.rotateBy(0.3, 360);

// let rf : cc.Action = cc.repeatForever(r);

// this.node.runAction(rf);

//this.node.stopAction(rf);

//this.node.stopAllActions();

// 10: 緩動(dòng)：Action easing(緩動(dòng)的方式): ?加上緩動(dòng)特效, cc.easeXXXXX查看文檔設(shè)置自己想要的緩動(dòng)對(duì)象

// let m = cc.moveTo(2, cc.v2(300, 200)).easing(cc.easeBackOut());

// // 小寫(xiě)開(kāi)頭的為方法cc.easeBackOut()，方法后面有()

// this.node.runAction(m);

// 11: 停止運(yùn)行action：stopAction;

// 12: 停止所有的action：stopAllActions;

// 一邊移動(dòng)一邊縮放,sequence，序列，先后執(zhí)行，同步

let m : cc.Action = cc.moveTo(2, cc.v2(300, 200));

let r : cc.Action = cc.rotateBy(4, 360);

//this.node.runAction(cc.sequence([m, r]));

// spawn,異步，多個(gè)Action可以同時(shí)執(zhí)行

this.node.runAction(cc.spawn([m, r]));

三、 總結(jié)

1、類(lèi)似于拍電影，首先導(dǎo)演要安排劇本Action，然后節(jié)點(diǎn)去執(zhí)行劇本this.node.runAction。

2、停止演戲stopAction()和stopAllActions()。

3、常見(jiàn)劇本：移動(dòng)moveTo、moveBy，旋轉(zhuǎn)rotateXX、縮放scaleXX、漸變fadeXXX。

4、注意To是到某個(gè)值，By的相對(duì)變化量。

5、回調(diào)和延遲：cc.callFunc, cc.delayTime。

6、緩動(dòng)：Action easing(緩動(dòng)的方式): ?加上緩動(dòng)特效, cc.easeXXXXX查看文檔設(shè)置自己想要的緩動(dòng)對(duì)象。

7、同步和異步：sequence（動(dòng)作先后順序執(zhí)行）、spawn（動(dòng)作同時(shí)執(zhí)行）。

8、重復(fù)循環(huán)執(zhí)行：cc.repeat, cc.repeatForever(action)。