qinning199原创,欢迎转载,转载请注明:http://www.cocos2dx.net/?p=22

一、帧动画

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

	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对象创建。


二、精灵表动画

尽管手工动画很容易理解,但它很少用在游戏开发中。相反的,精灵表动画的方式在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对象包含了所有精灵帧的图片纹理。即使它不会绘制,你也必须要把它添加到场景中,例如:

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

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

	CCSpriteFrameCache* cache = CCSpriteFrameCache::sharedSpriteFrameCache();
cache->addSpriteFramesWithFile("animations/grossini.plist");

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

	m_pSprite1 = CCSprite::createWithSpriteFrameName("grossini_dance_01.png");
spritebatch->addChild(m_pSprite1);
addChild(spritebatch);

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

现在我们创建一个CCArray对象并且天剑所有的帧动画进去。在这个动画的例子中,我们发现所有的14帧都有相同的大小,所以我们可以用一个嵌套的循环遍历它们,并且当完成添加14帧之后结束掉循环。

	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动作来让它一直执行下去,像这样:

	CCAnimation* animation = CCAnimation::createWithSpriteFrames(animFrames, 0.3f);
m_pSprite1->runAction( CCRepeatForever::create( CCAnimate::create(animation) ) );

四、文件动画

CCAnimateCache能够加载一个描述一批节点的xml/plist文件,包括帧名和他们的矩形区域。这个借口非常容易使用。

	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介绍的更多相关文章

  1. cocos2dx动画Animation介绍

     一.帧动画 你能够通过一系列图片文件,像例如以下这样,创建一个动画: [cpp]   CCAnimation *animation = CCAnimation::create();   //从本 ...

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

    Cocos2d-x为了减少开发难度,对于动画的实现採用的帧动画的方案.这也就是说Cocos2d-x中的动画是帧动画. 帧动画的原理相信大家都不陌生,就是多张图片循环播放以实现动画的效果. 一个简单的动 ...

  3. android Animation介绍

    Animation介绍: 在Android SDK介绍了2种Animation模式: 1. Tween Animation:间动画,通过对场景里的对象不断做图像变换(平移.缩放.旋转)产生动画效果,即 ...

  4. Android动画之旅-Android动画基本介绍

    在上一篇博客中.我们简单了解了在Android中的动画特效.小伙伴们是不是意犹未尽呀. 还没有看的猛戳这里:Android动画之旅一开篇动画简单介绍 本篇博客.将和大家一起来分析Android中的四大 ...

  5. iOS核心动画以及UIView动画的介绍

    我们看到很多App带有绚丽狂拽的特效,别出心裁的控件设计,很大程度上提高了用户体验,在增加了实用性的同时,也赋予了app无限的生命力.这些华丽的效果很多都是基于iOS的核心动画原理实现的,本文介绍一些 ...

  6. 微信小程序把玩(四十)animation API

    原文:微信小程序把玩(四十)animation API 动画水还是比较深的,这里只是简单介绍下小程序中动画的一些属性和注意事项,做动画前一定要整理好思路将动画一步步分解,再进行组合!这里只做引入. w ...

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

    × 目录 [1]漂浮的白云 [2]旋转的星球 [3]正方体合成 前面的话 前面介绍过动画animation的详细用法,本文主要介绍动画animation的三个效果 漂浮的白云 [效果演示] [简要介绍 ...

  8. Android Animation学习(六) View Animation介绍

    Android Animation学习(六) View Animation介绍 View Animation View animation系统可以用来执行View上的Tween animation和F ...

  9. CSS3的变形transform、过渡transition、动画animation学习

    学习CSS3动画animation得先了解一些关于变形transform.过渡transition的知识 这些新属性大多在新版浏览器得到了支持,有些需要添加浏览器前缀(-webkit-.-moz-.- ...

随机推荐

  1. Inno Setup 系统托盘图标插件 TrayIconCtrl V1.5

    原文 http://restools.hanzify.org/article.asp?id=93 V1.5 修正在某些 Windows 平台上(例如 Windows XP SP3)不能正常运行的问题. ...

  2. Starling开发微信打灰机(二)

    上一篇中,已经把starling开发环境搭建好,那么现在开始写代码. 这一篇来完成打灰机的欢迎界面. 游戏素材下载 首先创建Asset.as来加载图片,声音和字体等资源,其中只有两张背景图是单独的图片 ...

  3. Easyui几种布局方式的使用

    1.通过标记创建layout.  记得添加"easyui-layout"样式给div标记. <div id="cc" class="easyui ...

  4. HDOJ-1003 Max Sum(最大连续子段 动态规划)

    http://acm.hdu.edu.cn/showproblem.php?pid=1003 给出一个包含n个数字的序列{a1,a2,..,ai,..,an},-1000<=ai<=100 ...

  5. UML_部署图

    一.部署图简介(Deployment Diagram Introduction) 二.部署图元素(Deployment Diagram Elements) 1.结点(Node) 2.结点实例(Node ...

  6. 【LeetCode练习题】Longest Valid Parentheses

    Longest Valid Parentheses Given a string containing just the characters '(' and ')', find the length ...

  7. Android Studio Build选项的功能

    再开发过程中出现了如下错误: 无论如何clean,或者删除项目中build文件夹,Rebuild Project还是报错. 解决方案:Make Project 后出现有代码报错.修复代码问题,运行项目 ...

  8. Js节点属性与方法

    属性: Attributes     存储节点的属性列表(只读) childNodes 存储节点的子节点列表(只读) dataType     返回此节点的数据类型 Definition     以D ...

  9. JavaScript学习笔记——简单无缝循环滚动展示图片的实现

    今天做了一个简单的无缝循环滚动的实例,这种实例在网页中其实还挺常见的,下面分享一下我的学习收获. 首先,无缝滚动的第一个重点就是——动.关于怎么让页面的元素节点动起来,这就得学明白关于JavaScri ...

  10. Android EditText 取消复制粘贴功能,取消横向全屏编辑功能(一)

    在做一些安全性的软件时候常常要考虑取消 EditText 上的复制粘贴功能以确保安全性.下面就记录了这个方法: 首先在API-11以下的版本很简单,只需要在Xml布局文件或者用代码把长按属性设置成fa ...