八 手游開發神器 cocos2d-x editor 之動畫和幀動畫

一個游戲的成功很大程度上取決于動畫的成功，熟悉cocos2dx的讀者都知道它具備了很多現成的動畫。這一節我將實現小怪物慢慢的搖搖晃晃的向前走；

運行效果如下

代碼下載地址：http://www.kuaipan.cn/file/id_25348935635744616.htm?source=1

首先新建一個幀動畫文件，Resorces-----New----FramesAnimation，命名確定，創建snow_frame.plish成功

安裝下圖操作，創建一組幀動畫，也可在xml文件調節修改；

創建成功后，把圖片里面的第一幀作為精靈創建，調節好參數

打開MainLayer.js,編寫代碼如下，幀動畫的同時向前移動：

// // CleanerScoreScene class // var MainLayer = function () {     cc.log("MainLayer")     this.scoreLabel = this.scoreLabel || {};     this.monster = this.monster || {};     this.score = 123; };  MainLayer.prototype.onDidLoadFromCCB = function () {     if (sys.platform == 'browser') {         this.onEnter();     }     else {         this.rootNode.onEnter = function () {             this.controller.onEnter();         };     }      this.rootNode.schedule(function (dt) {         this.controller.onUpdate(dt);     });      this.rootNode.onExit = function () {         this.controller.onExit();     }; };  MainLayer.prototype.onEnter = function () {     cc.AnimationCache.getInstance().addAnimations("Resources/snow_frame.plist");//添加幀動畫文件     var action0 = cc.Sequence.create(cc.MoveTo.create(30, cc.p(360, 200)));  //向前移動     var actionFrame = cc.Animate.create(cc.AnimationCache.getInstance().getAnimation("monster"));   //獲取幀動畫     var action1 = cc.Repeat.create(actionFrame, 90000);     var action2 = cc.Spawn.create(action0, action1); //同步動畫     this.monster.runAction(action2); }  MainLayer.prototype.onUpdate = function (dt) {     this.score += dt;     this.scoreLabel.setString(Math.floor(this.score)); }  MainLayer.prototype.onExitClicked = function () {     cc.log("onExitClicked"); }   MainLayer.prototype.onExit = function () {     cc.log("onExit"); }  cc.Animate.createWithName = function (name) {     return cc.Animate.create(cc.AnimationCache.getInstance().getAnimation(name)); } 

下一篇文章 我會介紹cocos2d-x  editor的粒子效果       筆者（李元友）

資料來源：cocos2d-x  editor