这一篇是讲一下如何在cocos2d中实现动画。
实现动画的步骤:
- 加载帧
- 生成动画对象
- 运行动画
加载帧我用过两种方式:
- 第一种是使用.plist文件,通过CCSpriteFrameCache读取动画帧,并加载到CCAnimation对象中,如下:
[[CCSpriteFrameCache sharedSpriteFrameCache] addSpriteFramesWithFile:@"animate.plist"];NSMutableArray *walkAnimFrames = [NSMutableArray array]; for(int i = 1; i <= 8; ++i) {[walkAnimFrames addObject:[[CCSpriteFrameCache sharedSpriteFrameCache] spriteFrameByName:[NSString stringWithFormat:@"bear%d.png", i]]]; } CCAnimation *walkAnim = [CCAnimation animationWithFrames:walkAnimFrames delay:0.1f]; id actions = [ CCRepeatForeveractionWithAction: [CCAnimateactionWithAnimation:walkAnim restoreOriginalFrame:NO] ]; [sprite runAction:actions];
这里面的 .plist 是什么呢?
我们知道动画实际上就是由一帧帧的图片连续播放产生的,那么我们在cocos2d中实现动画时,首先要把所有的动画帧加载到内存中,但一张一张的加载比较费时费事,所有,就会有工具把所有的图片 揉成一个图片,横七竖八的放到一个图片文件中,为了再把这些图片分离出来,就需要一个数据文件记载每一个图片的位置及其大小,这个文件就是上面提到的 .plist 文件。
下图左边就是图片文件,而右侧的是 .plist 文件的内容。
- .plist 文件可以通过Zwoptex 或 TexturePacker程序生成, Zwoptex的flash版本是免费的,桌面版是收费的,TexturePacker初级版是免费的,高级版是收费的。
- 如果你不想花钱买上面这两个软件,有什么办法不用 .plist 文件的形式加载动画吗?答案是有,目前我就是不用 .plist 的形式加载动画的,下面先给出代码:
CCTexture2D *texture = [[CCTextureCache sharedTextureCache] addImage:fileName]; NSMutableArray *animFrames = [NSMutableArray array]; [animFrames removeAllObjects];for (int i=0; i<frameCount; i++) {CCSpriteFrame *frame = [CCSpriteFrame frameWithTexture:texture rect:CGRectMake(spriteWidth*i,0, spriteWidth,spriteHeight)];[animFrames addObject:frame]; } CCAnimation *animation =[CCAnimation animationWithFrames:animFrames delay:delay];id actions = [ CCRepeatForever actionWithAction: [CCAnimate actionWithAnimation:walkAnim restoreOriginalFrame:NO] ]; [sprite runAction:actions];
这种方法的不同主要在于,加载帧时,使用的是 CCSpriteFrame frameWithTexture:(CCTexture2D*)texture rect:(CGRect)rect ,也就是,直接加载图片,然后使用 CGRect 来指定加载图片的位置。
比如,上面的代码中表示的就是动画图片是按照水平排列的,每个动画帧的宽是 spriteWidth, 高是 spriteHeight,然后,通过水平移动坐标,来一个一个的加载图片。
两种方式,区别仅仅在于如何加载动画帧,其他的步骤是一样的。
下面说一下如何改变精灵的图片。当你的操纵的精灵,吃了什么东东,然后变身了,那么显示在屏幕上的图片就要变化,那么如何设定呢?
-
CCSpriteFrame *frame = [[CCSpriteFrameCache sharedSpriteFrameCache]spriteFrameByName:@"grossini_dance_02.png"]; [sprite1 setDisplayFrame:frame];
这种方法适用于适用 .plist的方式加载帧的方式,因为每一个帧都有自己的名字,所以很容易通过名字取得指定的帧。 -
[self setTextureRect:CGRectMake(80, 0, 40, 40)];
这种方式适用于我第二种加载动画的方式,这种方式没有像.plist那种方式那样指定了每个帧的名字,所以,可以通过直接指定 位置的方式来替换 精灵的图片。 -
[self setTexture:(CCTexture2D *) texture];
这种的话,直接适用 CCTexture2D对象来替换。
关于他们有什么不同,有人说 setDisplayFrame 不会改变精灵的大小,替换帧后,会调整显示比例是精灵的大小不改变,而setTexture会改变精灵的大小。