Cocos2d-X使用CCAnimation创建动画

动画在游戏中是很常见的

程序1：创建一个简单的动画

首先须要在project文件夹下的Resource文件夹中放一张有各种不同动作的图片

在程序中加入以下的代码

#include "Animation.h"

CCScene* Animation::scene()
{
    CCScene* s = CCScene::create();

    Animation* layer = Animation::create();

    s->addChild(layer);

    return s;
}

bool Animation::init()
{
  CCLayer::init();

    CCSize winSize = CCDirector::sharedDirector()->getWinSize();

    //创建精灵
    CCSprite* sp = CCSprite::create();
    sp->setPosition(ccp(winSize.width / 2, winSize.height / 2));
    addChild(sp);

    //精灵放大4倍
    sp->setScale(4);

    //创建纹理
    CCTexture2D* texture = CCTextureCache::sharedTextureCache()->addImage("walkLeft.png");

    //创建一个数组
    CCArray* arr = CCArray::create();

    //从纹理中扣了10帧frame,组成数组
    for(int i = 0; i < 10; i++)
    {
        //使用纹理创建精灵帧
        //第一个參数：纹理
        //第二个參数：矩形
        CCSpriteFrame* frame = CCSpriteFrame::createWithTexture(texture,

            //第一个參数：矩形的x坐标
            //第二个參数：矩形的y坐标
            //第三个參数：矩形的宽度
            //第四个參数：矩形的高度
            CCRect(i*18, 0, 18, 32));

        arr->addObject(frame);
    }

    //使用精灵帧创建动画
    //第一个參数：数组
    //第二个參数：动画的帧数(播放两张图片的间隔时间)
    CCAnimation* animation = CCAnimation::createWithSpriteFrames(arr, 0.1f);
    CCAnimate* animate = CCAnimate::create(animation);

    //播放动画
    //CCRepeatForever::create动画播放无限次
    sp->runAction(CCRepeatForever::create(animate));

    return true;
}

运行结果：

程序2：有plist文件的动画载入

首先须要在project文件夹下的Resource文件夹中放一张有各种不同动作的图片和一个plist文件

plist格式的文件实际上是一个XML文件，文件里的内容

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple Computer//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
    <dict>
        <key>frames</key>
        <dict>
            <key>Boom_1.png</key>
            <dict>
                <key>frame</key>
                <string>{{204,305},{99,99}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{99,99}}</string>
                <key>sourceSize</key>
                <string>{99,99}</string>
            </dict>
            <key>Boom_10.png</key>
            <dict>
                <key>frame</key>
                <string>{{103,307},{99,99}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{99,99}}</string>
                <key>sourceSize</key>
                <string>{99,99}</string>
            </dict>
            <key>Boom_11.png</key>
            <dict>
                <key>frame</key>
                <string>{{103,206},{99,99}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{99,99}}</string>
                <key>sourceSize</key>
                <string>{99,99}</string>
            </dict>
            <key>Boom_12.png</key>
            <dict>
                <key>frame</key>
                <string>{{105,2},{99,99}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{99,99}}</string>
                <key>sourceSize</key>
                <string>{99,99}</string>
            </dict>
            <key>Boom_13.png</key>
            <dict>
                <key>frame</key>
                <string>{{103,105},{99,99}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{99,99}}</string>
                <key>sourceSize</key>
                <string>{99,99}</string>
            </dict>
            <key>Boom_14.png</key>
            <dict>
                <key>frame</key>
                <string>{{2,2},{101,101}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{101,101}}</string>
                <key>sourceSize</key>
                <string>{101,101}</string>
            </dict>
            <key>Boom_15.png</key>
            <dict>
                <key>frame</key>
                <string>{{2,408},{99,99}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{99,99}}</string>
                <key>sourceSize</key>
                <string>{99,99}</string>
            </dict>
            <key>Boom_16.png</key>
            <dict>
                <key>frame</key>
                <string>{{2,307},{99,99}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{99,99}}</string>
                <key>sourceSize</key>
                <string>{99,99}</string>
            </dict>
            <key>Boom_17.png</key>
            <dict>
                <key>frame</key>
                <string>{{2,206},{99,99}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{99,99}}</string>
                <key>sourceSize</key>
                <string>{99,99}</string>
            </dict>
            <key>Boom_18.png</key>
            <dict>
                <key>frame</key>
                <string>{{2,105},{99,99}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{99,99}}</string>
                <key>sourceSize</key>
                <string>{99,99}</string>
            </dict>
            <key>Boom_2.png</key>
            <dict>
                <key>frame</key>
                <string>{{204,204},{99,99}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{99,99}}</string>
                <key>sourceSize</key>
                <string>{99,99}</string>
            </dict>
            <key>Boom_3.png</key>
            <dict>
                <key>frame</key>
                <string>{{406,103},{99,99}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{99,99}}</string>
                <key>sourceSize</key>
                <string>{99,99}</string>
            </dict>
            <key>Boom_4.png</key>
            <dict>
                <key>frame</key>
                <string>{{305,103},{99,99}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{99,99}}</string>
                <key>sourceSize</key>
                <string>{99,99}</string>
            </dict>
            <key>Boom_5.png</key>
            <dict>
                <key>frame</key>
                <string>{{204,103},{99,99}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{99,99}}</string>
                <key>sourceSize</key>
                <string>{99,99}</string>
            </dict>
            <key>Boom_6.png</key>
            <dict>
                <key>frame</key>
                <string>{{408,2},{99,99}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{99,99}}</string>
                <key>sourceSize</key>
                <string>{99,99}</string>
            </dict>
            <key>Boom_7.png</key>
            <dict>
                <key>frame</key>
                <string>{{307,2},{99,99}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{99,99}}</string>
                <key>sourceSize</key>
                <string>{99,99}</string>
            </dict>
            <key>Boom_8.png</key>
            <dict>
                <key>frame</key>
                <string>{{206,2},{99,99}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{99,99}}</string>
                <key>sourceSize</key>
                <string>{99,99}</string>
            </dict>
            <key>Boom_9.png</key>
            <dict>
                <key>frame</key>
                <string>{{103,408},{99,99}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{99,99}}</string>
                <key>sourceSize</key>
                <string>{99,99}</string>
            </dict>
        </dict>
        <key>metadata</key>
        <dict>
            <key>format</key>
            <integer>2</integer>
            <key>realTextureFileName</key>
            <string>PFBoom.png</string>
            <key>size</key>
            <string>{512,512}</string>
            <key>textureFileName</key>
            <string>PFBoom.png</string>
        </dict>
    </dict>
</plist>

程序代码：

#include "Animation.h"

CCScene* Animation::scene()
{
    CCScene* s = CCScene::create();

    Animation* layer = Animation::create();

    s->addChild(layer);

    return s;
}

//有plist文件的动画载入
bool Animation::init()
{
    CCLayer::init();

    CCSize winSize = CCDirector::sharedDirector()->getWinSize();

    //创建精灵
    CCSprite* sp = CCSprite::create();
    sp->setPosition(ccp(winSize.width / 2, winSize.height / 2));
    addChild(sp);

    //精灵放大4倍
    sp->setScale(4);

    //创建精灵帧缓存
    CCSpriteFrameCache* frameCache = CCSpriteFrameCache::sharedSpriteFrameCache();

    //创建数组
    CCArray* arr = CCArray::create();

    //加入Plist文件
    frameCache->addSpriteFramesWithFile("PFBoom.plist");

	for (int i = 1; i <= 18; i++)
	{
		char key[128];

        //通过名字获取精灵帧所在的图片
		sprintf(key, "Boom_%d.png", i);

        //将图片加入到精灵帧中
		CCSpriteFrame* frame = frameCache->spriteFrameByName(key);

        //将精灵帧加入到数组中
		arr->addObject(frame);
	}

    //使用数组创建动画
	CCAnimation* animation = CCAnimation::createWithSpriteFrames(arr, 0.1f);
	CCAnimate* animate = CCAnimate::create(animation);

    //动画消失
	CCCallFunc* callfunc = CCCallFunc::create(sp, callfunc_selector(CCSprite::removeFromParent));
    CCSequence* seq = CCSequence::create(animate, callfunc, NULL);

    //播放动画
   sp->runAction(seq);

    return true;
}

运行结果：

程序3：通过鼠标实现动画切换

首先创建一个Animation类

在AnimationPreload.h中加入以下代码

#ifndef __AnimationPreload_H__
#define __AnimationPreload_H__

#include "cocos2d.h"
USING_NS_CC;

class AnimationPreload : public CCLayer
{
public:
    static CCScene* scene();

    bool init();

    CREATE_FUNC(AnimationPreload);

    bool ccTouchBegan(CCTouch*, CCEvent*);

    CCSprite* sp;
};

#endif

在AnimationPreload.cpp中加入以下的代码

#include "AnimationPreload.h"

CCScene* AnimationPreload::scene()
{
    CCScene* s = CCScene::create();

    AnimationPreload* layer = AnimationPreload::create();

    s->addChild(layer);

    return s;
}

bool AnimationPreload::init()
{
    //chushihu
    CCLayer::init();

    //获取窗体的大小
    CCSize winSize = CCDirector::sharedDirector()->getWinSize();

	//(创建纹理)从纹理里扣了10帧frame。组成数组
	CCTexture2D* texture = CCTextureCache::sharedTextureCache()->addImage("walkLeft.png");

    //创建数组
    CCArray* arr = CCArray::create(); //retain

    for (int i = 9; i >= 0; i--)
	{
        //创建精灵帧
		CCSpriteFrame* frame = CCSpriteFrame::createWithTexture(texture,
			CCRect(i*18, 0, 18, 32));

        //将精灵帧加入到数组中
		arr->addObject(frame);
	}

	// 通过数组创建动画
	CCAnimation* animation = CCAnimation::createWithSpriteFrames(arr, 0.05f);

	// 加入到缓存
	CCAnimationCache::sharedAnimationCache()->addAnimation(animation, "MarioRun");

	/***************************************************************/
	/** 有plist文件的动画载入 **/

    //创建精灵帧缓存
	CCSpriteFrameCache* frameCache = CCSpriteFrameCache::sharedSpriteFrameCache();

    //创建数组
	arr = CCArray::create();

    //将plist文件加入到精灵帧缓存中
	frameCache->addSpriteFramesWithFile("PFBoom.plist");

	for (int i = 1; i <= 18; i++)
	{
		char key[128];

         //通过名字获取精灵帧所在的图片
		sprintf(key, "Boom_%d.png", i);

        //将图片加入到精灵帧中
		CCSpriteFrame* frame = frameCache->spriteFrameByName(key);

        //将精灵帧加入到数组中
		arr->addObject(frame);
	}

    //创建动画
    animation = CCAnimation::createWithSpriteFrames(arr, 0.1f);

    // 加入到缓存
	CCAnimationCache::sharedAnimationCache()->addAnimation(animation, "PlaneBOOM");

	sp = CCSprite::create();
	sp->setPosition(ccp(winSize.width / 2, winSize.height / 2));
	addChild(sp);

    //精灵方法4倍
    sp->setScale(4);

	// setTouch
	setTouchEnabled(true);
	setTouchMode(kCCTouchesOneByOne);

	return true;
}

bool AnimationPreload::ccTouchBegan(CCTouch*, CCEvent*)
{
   sp->stopAllActions();

	static int i = 1;

    if (i == 1)
	{
		sp->runAction(CCAnimate::create(
			CCAnimationCache::sharedAnimationCache()->animationByName("PlaneBOOM")
			));
	}
	else
	{
		sp->runAction(CCAnimate::create(
			CCAnimationCache::sharedAnimationCache()->animationByName("MarioRun")
			));
	}

	i = 1 - i;

    return 0;
}

运行结果：

??

??

时间： 2024-11-08 04:12:47

Cocos2d-X使用CCAnimation创建动画的相关文章

cocos2dx中创建动画的三种方法

1.最最原始的方法,先创建动画帧,再创建动画打包(animation),再创建动画(animate) 第一步: 创建动画帧:CCSpriteFrame,依赖于原始的资源图片(xx.png,xx.jpg) CCSpriteFrame *frame1=CCSpriteFrame::create("1.png"); CCSpriteFrame *frame2=CCSpriteFrame::create("2.png"); CCSpriteFrame *frame3=CCS

使用 Cocos2d 3.1.1 创建 Windows Phone 8 游戏开发环境

cocos2d-x 是目前流行的游戏游戏开发框架,目前最新的版本是 3.1.1, 网上有些教程已经比较老了,本文将会介绍如何使用最新的 3.1.1 创建 Windows Phone 8 开发环境. 本文假设你已经安装了 VS2012 或者 VS2013,并且已经安装了 Windows Phone8 的 SDK. 一.下载和安装 Cocos2d-x 官网地址:http://www.cocos2d-x.org/ 点击菜单栏中的 Download, 进入下载页面. 我们下载最新的 V3.1.1,新版功

创建动画和移动相机

1.如何通过鼠标获取网格对象 首先需要把鼠标的起始位置在左上角的屏幕坐标转换为笛卡尔坐标.然后将坐标转为为以Camera为中心点的三维空间坐标.接下来根据摄像头位置和鼠标位置的法向量创建射线对象.最终根据射线对象的intersectObjects函数确认哪个网格被选中. 下面是比较经典的使用方法: function onDocumentMouseMove(event) { if (controls.showRay) { var vector = new THREE.Vector3(( event

《Programming WPF》翻译 第8章 5.创建动画过程

原文:<Programming WPF>翻译 第8章 5.创建动画过程 所有在这章使用xaml举例说明的技术,都可以在代码中使用,正如你希望的.可是,代码可以使用动画在某种程度上不可能在xaml中实现的. 在代码中创建动画需要稍微多一点的努力--比使用标记.然而,代码提供了更多的弹性.你可以在运行期计算属性,而不是在xaml中硬编码,从而支持你的动画适应环境.例如,这可能是有用的--在当前窗体的大小基于动画的参数. 使用代码一个额外的好处是我们不需要使用storyboard,替代的,我们可以创

Unity创建动画的步骤

创建动画的步骤: 1.导入模型和动画进行设置2.创建Animator组件 3.创建并设置Animator Controller 进行设置上面的设置见下面AnimatorController设置4.设置脚本进行动画的控制添加脚本代码的时候,其中首先要做的是获取本身物体上的Animator组件获取方法:首先设置private Animator _animator;void Start () { _animator = transform.GetComponent<Animator>();}在Upd

Cocos2d-x3.3beta0创建动画的3种方式

1.单独加载精灵对象 渲染效率低,浪费资源,不推荐用该方法.代码如下:注:代码只需贴到HelloWorldScene.cpp中即可. //First,单独渲染每一个精灵帧 auto sprite = Sprite::create("grossini_dance_01.png"); sprite->setPosition(Vec2(visibleSize.width/2,visibleSize.height/4*3)); addChild(sprite); auto animati

android动画详解四 创建动画

· 使用ValueAnimator进行动画 通过指定一些int, float或color等类型的值的集合,ValueAnimator 使你可以对这些类型的值进行动画.你需通过调用ValueAnimator 的某个工厂方法来获得一个ValueAnimator 对象,比如:ofInt(), ofFloat(), 或 ofObject().例如: ValueAnimator animation = ValueAnimator.ofFloat(0f, 1f); animation.setDuration

android动画具体解释四 创建动画

使用ValueAnimator进行动画 通过指定一些int, float或color等类型的值的集合.ValueAnimator 使你能够对这些类型的值进行动画.你需通过调用ValueAnimator 的某个工厂方法来获得一个ValueAnimator 对象.比方:ofInt(), ofFloat(), 或 ofObject().比如: ValueAnimator animation = ValueAnimator.ofFloat(0f, 1f); animation.setDuration(1

cocos2d-3.x 创建动画

1.多文件帧序列动画 TrademarkAnimation.h #ifndef __TRADEMARK_ANIMATION_H__ #define __TRADEMARK_ANIMATION_H__ #include "cocos2d.h" USING_NS_CC; class TrademarkAnimation : public cocos2d::CCLayer{ private: Animate* createAnimate(); public : ~TrademarkAnima