cocos2d-js使用plist执行自身动作

Posted 2020-10-08 百牛信息技术

首先需要将精灵动作帧动画图片使用TexturePacker创建plist，创建好后，将生成的plist和png图片（所有帧动画图片集成的一张大图）；

百牛信息技术bainiu.ltd整理发布于博客园

1、进行预加载操作

      

[javascript] view plain copy

 

1. cc.spriteFrameCache.addSpriteFrames(res.Mario_plist);  

预加载后，可在工程中加载使用plist中的任何一个动作图片，使用方式：

 

 

[javascript] view plain copy

 

1. cc.spriteFrameCache.getSpriteFrame("mario_14_01.png");  

2、精灵需要自身动作，如跑动或者击打等动作，执行代码如下：

[javascript] view plain copy

 

1. addFrames:function(){  
2.         for(var i=1;i<21;i++){  
3.             if(i<10){  
4.                 this.spriteFames.push(cc.spriteFrameCache.getSpriteFrame("mario_14_0"+i+".png"));  
5.             }else{  
6.                 this.spriteFames.push(cc.spriteFrameCache.getSpriteFrame("mario_14_"+i+".png"));  
7.             }  
8.         }  
9.     },  
10.     runSelf:function(){  
11.         var animation = new cc.Animation(this.spriteFames);  
12.         animation.setDelayPerUnit(1/30);    
13.         animation.setRestoreOriginalFrame(true);   
14.         animation.setLoops(-1);  
15.         var animate = cc.Animate(animation);  
16.         this.mario.runAction(animate);  
17.     }  

如上代码，在addFrames函数中，将plist的动作图片加入spriteFrames数组中，在runSelf函数中，定义动画，最后让马里奥执行动画，如没有什么差错，此时应该能看到一个拼命在跑动的马里奥，虽然只是在原地踏步。