cocos2dx动画Animation介绍

一、帧动画 p>你可以通过一系列图片文件，像如下这样，创建一个动画：

p>[cpp]  

p>CCAnimation *animation = CCAnimation::create();  

p>//从本地文件系统中加载图片文件到CCSpriteFrame中区，然后添加到CCAnimation中  

p>for (int i = 1; i < 15; i++)  

p>{  

p>    char szImageFileName[128] = {0};  

p>    sprintf(szImageFileName, "Images/grossini_dance_%02d.png", i);  

p>    animation->addSpriteFrameWithFileName(szImageFileName);    

p>}  

p>animation->setDelayPerUnit(2.8f / 14.0f); // 这个动画包含14帧，将会持续2.8秒.  

p>animation->setRestoreOriginalFrame(true); // 14帧播放完之后返回到第一帧  

p>  

p>CCAnimate *action = CCAnimate::create(animation);  

p>sprite->runAction(action);  // 运行精灵对象  

p> 

p> 

p> 

p>注意CCAnimation是由许多精灵帧组成，可以设置间隔时间，持续时间等，它实际上是包含着一组数据。CCAnimate是一个动作，它是通过CCAnimation对象创建。

p>二、精灵表动画

p>尽管手工动画很容易理解，但它很少用在游戏开发中。相反的，精灵表动画的方式在2D动画中经常使用。

p>这是一个精灵表。它实际上就是一系列动画帧图片，或者是一个能用于一个场景的图片集。

p> 

p> 

p>在OpenGLES1.1阶段，精灵表因为以下几点被广泛应用：

p>1、减少文件读写时间。读取一张图片比读取一堆小文件肯定要快。

p>2、减少内存消耗。OpenGL ES 1.1仅仅能够使用2的几次方大小的图片（也就是宽度或者高度是2,4,864,128,256,512,1024,...）。也就是说，OpenGL ES1.1将会分配给每个图片2的几次方大小的内存空间，即使你这张图片达不到这样的宽度和高度也会分配大于此图片的2的n次方大小的空间。那么运用这种图片集的方式将会减少内存碎片。

p>3、减少OpenGL ES绘制调用并且加速渲染。

p>Cocos2d-x v2.0升级到了OpenGL ES2.0.OpenGL ES2.0不会再分配2的几次方的内存块了，但是减少读取时间和绘制调用的优势依然存在。

p>那么生成的动画效果如何呢？正如我们所见，精灵表不是动画的一个必须条件。但是考虑到以上的一些优势，精灵表还是很有效率的。在Cocos2dx中，有许多不同的方式来创建精灵表。

p>三、通过.png 和 .plist文件创建精灵表

p>在cocos2dx 0.x和1.x版本中，CCSpriteSheet就是为以上的目的设计。在V2.0中CCSpriteBatchNode替代了CCSpriteSheet。

p>CCSpriteBatchNode对象包含了所有精灵帧的图片纹理。即使它不会绘制，你也必须要把它添加到场景中，例如：

p>[cpp]  

p>CCSpriteBatchNode* spritebatch = CCSpriteBatchNode::create("animations/grossini.png");  

p> 

p>下一步，你需要运用CCSpriteFrameCache实例来确保帧名字对应帧边界。也就是说，图片在哪一块矩形区域中。例如：

p>[cpp]  

p>CCSpriteFrameCache* cache = CCSpriteFrameCache::sharedSpriteFrameCache();  

p>cache->addSpriteFramesWithFile("animations/grossini.plist");  

p> 

p>一旦你的精灵表和帧加载完成，并且精灵表已经被添加到了场景中，你可以通过createWithSpriteFrameName方法来创建精灵。并且通过addChild要添加到精灵表中：

p>[cpp]  

p>m_pSprite1 = CCSprite::createWithSpriteFrameName("grossini_dance_01.png");  

p>spritebatch->addChild(m_pSprite1);