cocos2dx动画Animation介绍



一、帧动画

你能够通过一系列图片文件,像例如以下这样,创建一个动画:

[cpp]

CCAnimation *animation = CCAnimation::create();

//从本地文件系统中载入图片文件到CCSpriteFrame中区,然后加入到CCAnimation中

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

{

char szImageFileName[128] = {0};

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

animation->addSpriteFrameWithFileName(szImageFileName);

}

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

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

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

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

注意CCAnimation是由很多精灵帧组成,能够设置间隔时间,持续时间等,它实际上是包括着一组数据。CCAnimate是一个动作,它是通过CCAnimation对象创建。

二、精灵表动画

虽然手工动画非常easy理解,但它非常少用在游戏开发中。相反的,精灵表动画的方式在2D动画中常常使用。

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

在OpenGLES1.1阶段,精灵表由于下面几点被广泛应用:

1、降低文件读写时间。读取一张图片比读取一堆小文件肯定要快。

2、降低内存消耗。OpenGL ES 1.1只可以使用2的几次方大小的图片(也就是宽度或者高度是2,4,864,128,256,512,1024,...)。也就是说,OpenGL ES1.1将会分配给每一个图片2的几次方大小的内存空间,即使你这张图片达不到这种宽度和高度也会分配大于此图片的2的n次方大小的空间。那么运用这种图片集的方式将会降低内存碎片。

3、降低OpenGL ES绘制调用而且加速渲染。

Cocos2d-x v2.0升级到了OpenGL ES2.0.OpenGL ES2.0不会再分配2的几次方的内存块了,可是降低读取时间和绘制调用的优势依旧存在。

那么生成的动画效果怎样呢?正如我们所见,精灵表不是动画的一个必须条件。可是考虑到以上的一些优势,精灵表还是非常有效率的。在Cocos2dx中,有很多不同的方式来创建精灵表。

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

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

CCSpriteBatchNode对象包括了全部精灵帧的图片纹理。即使它不会绘制,你也必需要把它加入到场景中,比如:

[cpp]

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

下一步,你须要运用CCSpriteFrameCache实例来确保帧名字相应帧边界。也就是说,图片在哪一块矩形区域中。比如:

[cpp]

CCSpriteFrameCache* cache = CCSpriteFrameCache::sharedSpriteFrameCache();

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

一旦你的精灵表和帧载入完毕,而且精灵表已经被加入到了场景中,你能够通过createWithSpriteFrameName方法来创建精灵。而且通过addChild要加入到精灵表中:

[cpp]

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

spritebatch->addChild(m_pSprite1);

addChild(spritebatch);

createWithSpriteFrameName 方法将会从grossini.plist中找到相应的坐标以及矩形区域,之后再裁剪grossini.png的纹理成一个精灵帧。

如今我们创建一个CCArray对象而且天剑全部的帧动画进去。在这个动画的样例中,我们发现全部的14帧都有同样的大小,所以我们能够用一个嵌套的循环遍历它们,而且当完毕加入14帧之后结束掉循环。

[cpp]

CCArray* animFrames = CCArray::createWithCapacity(15);

char str[100] = {0};

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

{

sprintf(str, "grossini_dance_%02d.png", i);

CCSpriteFrame* frame = cache->spriteFrameByName( str );

animFrames->addObject(frame);

}

最后,我们须要创建一个CCAnimate动作实例来执行CCSprite。以下我们能够在CCRepeatForever动作中包裹CCAnimate动作来让它一直执行下去,像这样:

[cpp]

CCAnimation* animation = CCAnimation::createWithSpriteFrames(animFrames, 0.3f);

m_pSprite1->runAction( CCRepeatForever::create( CCAnimate::create(animation) ) );

四、文件动画

CCAnimateCache可以载入一个描写叙述一批节点的xml/plist文件,包含帧名和他们的矩形区域。这个借口很easy使用。

[cpp]

CCAnimationCache *cache = CCAnimationCache::sharedAnimationCache(); // 缓存在cocos2dx中一直是单例模式

cache->addAnimationsWithFile("animations/animations-2.plist");

CCAnimation animation = cache->animationByName("dance_1");

CCAnimate animate = CCAnimate::create(animation);

sprite->runAction(animate);

cocos2dx动画Animation介绍

时间: 2024-10-27 18:02:24

cocos2dx动画Animation介绍的相关文章

[Cocos2d-x开发问题-3] cocos2dx动画Animation介绍

Cocos2d-x为了降低开发难度,对于动画的实现采用的帧动画的方案.这也就是说Cocos2d-x中的动画是帧动画. 帧动画的原理相信大家都不陌生,就是多张图片循环播放以实现动画的效果. 一个简单的动画动画实现如下: player = cc.Sprite:create("image/player.png") player:setPosition(-width/4,0) local animation = cc.Animation:create() animation:addSprite

动画animation的三个应用(漂浮的白云、旋转的星球、正方体合成)

× 目录 [1]漂浮的白云 [2]旋转的星球 [3]正方体合成 前面的话 前面介绍过动画animation的详细用法,本文主要介绍动画animation的三个效果 漂浮的白云 [效果演示] [简要介绍] 漂浮的白云主要通过远景白云和近景白云来实现立体漂浮效果.远景和近景分别使用两张背景图片,通过改变其背景定位来实现白云移动效果,通过设置不同的动画持续时间来实现交错漂浮的效果 [主要代码] .box{ position: relative; height: 300px; width: 500px;

使用CSS3动画 animation 来控制元素的显示和隐藏

CSS3中 animation 和 transition 俩样式都能创建动画效果,而且是后台C++执行的,所以效率比普通jQuery的js模拟动画的效率高很多,所以建议大家能用css实现的效果都用css. transition的使用比较简单,这里就不介绍了,着重为大家介绍下 animation . animation 的css属性有很多,本文通过 animation-name 来控制启动动画和转换动画,以下是一个通过 animation 来控制元素的显示和隐藏的例子(仅支持webkit): <!

Android 动画animation 深入分析

转载请注明出处:http://blog.csdn.net/farmer_cc/article/details/18259117 Android 动画animation 深入分析 前言:本文试图通过分析动画流程,来理解android动画系统的设计与实现,学习动画的基本原则,最终希望能够指导动画的设计. 0 本文中用到的一些类图 1 view animation 调用方法:view.startAnimation(animation); [java] view plaincopy public voi

Cocos2d-x动画播放(序列帧)

简介 Cocos2d-x中,动画的具体内容是依靠精灵显示出来的,为了显示动态图片,我们需要不停切换精灵显示的内容,通过把静态的精灵变为动画播放器从而实现动画效果.动画由帧组成,每一帧都是一个纹理,我们可以使用一个纹理序列来创建动画. 我们使用Animation类描述一个动画,而精灵显示动画的动作则是一个Animate对象.动画动作Animate是精灵显示动画的动作,动画与动画动作的关系如同CD光盘与CD播放机的关系,前者记录了动画的内容,后者是播放动画的工具,它由一个动画对象创建,并由精灵执行.

Android动画Animation的两种加载执行方式

本文以简单的AlphaAnimation("淡入淡出(透明度改变)"动画)为例,简单的说明Android动画Animation的两种加载执行方法: (1) 直接写Java代码,制作Android动画. (2) 写XML配置文件,加载XML资源文件执行. 其实这两者是一致的.要知道,在Android中,凡是可以在XML文件完成的View,代码亦可完全写出来. 现在先给出一个Java代码完成的动画AlphaAnimation,AlphaAnimation功能简单,简言之,可以让一个View

CSS3动画属性:动画(animation)

一:动画(animation)的参数详解 由于上面用到了animation动画,这里详细介绍下这个animation的参数. 简介 CSS动画(Animations)简单说就是在一段固定的动画时间内暗中在某一频率内改变其CSS某个或某些值,从而达到视觉上的转换动画效果.Animations的很多方面都是可以控制的,包括动画运行时间,开始值和结束值,还有动画的暂停和延迟其开始时间等. 语法 <single-animation> = <single-animation-name> ||

【转】cocos2d-x动画加速与减速

移步原帖传送门:cocos2d-x动画加速与减速 动画是游戏的必然要素之一,在整个游戏过程中,又有着加速.减速动画的需求.以塔防为例子,布塔的时候希望能够将游戏减速,布好塔后,则希望能将游戏加速:当某个怪被冰冻后,移动速度减缓,而其他怪的移动速度不变.cocos2d-x引擎为我们提供了很强大的接口,下面就将我实验的过程复述一遍,也方便他人. 1)实现全局的加速.减速. 通过设置Scheduler的timeScale,可以实现全局的加.减速.代码非常简单:CCScheduler* pSchedul

css3 动画(animation)-简单入门

css3之动画(animation) css3中我们可以使用动画,由于取代以前的gif图片,flash动画,以及部分javascript代码(相信有很多同学都用过jquery中的animate方法来做一些动画).具体如何使用呢??? 首先定义一个动画,然后引用动画. 定义一个动画要使用@keyframes,然后跟上你要定义的动画的名字.关键字"from"表示开始, "to"表示结束,等同于0% 和 100%.最好使用百分比来表示变化发生的时间,这样的话还可以定义从开