文档库

最新最全的文档下载
当前位置:文档库 > cocos2dx入门教程CCSprite动画

cocos2dx入门教程CCSprite动画

Cocos2d-x-->CCSprite动画

帧动画是我们见得最多的,电视、电影等,如果印象深刻的话,小时候的那种老款照相机的胶卷...大小相同的一张一张的底片....哈哈!其实如果对游戏要求不高,游戏的图片也不多,咋们就可以采用这种方式来制作动画,不过好游戏一般都不是这样做的....那是什么呢?...动作编辑器,先讲讲最基础的制作动画方式(其实利用动作编辑器,其实也是切割图片,如果还没有接触过动作编辑器的,可以学着用下SpriteX)...好了,就此开始吧!

1、先用texturePacker制作我们的素材

找一组动画图片,我直接test里面那个大叔的一组图片...

由于用直接用test里面的图片有点问题,所以我直接把组图,用ps切出每帧然后导出,然后用texturePacker打包,导出role.plist和role.png

2、上传代码:...老样子(我没有新建工程,直接用的原来的工程)

红色框出来的就是我基于上讲工程新添加的文件:(因为我特别怕乱,所以单独创建和场景和层)

ActionScene.h

#pragma once

#include "cocos2d.h"

using namespace cocos2d;

class ActionScene :public CCScene

{

public:

ActionScene(void);

~ActionScene(void);

static CCScene* scene();

};

ActionScen.cpp

#include "ActionScene.h"

#include "ActionLayer.h"

ActionScene::ActionScene(void)

{

}

ActionScene::~ActionScene(void)

{

}

CCScene* ActionScene::scene()

{

CCScene* scene=CCScene::create();

CCLayer* layer=ActionLayer::layer(0);

scene->addChild(layer);

scene->scheduleUpdate();

return scene;

}

ActionLayer.h

#pragma once

#include "cocos2d.h"

using namespace cocos2d;

enum

{

ACTION_ANIMA TION_LAYER=0

};

class ActionLayer :public CCLayer

{

public:

ActionLayer(void);

~ActionLayer(void);

static CCLayer* layer(int id); protected:

CCSprite* grossini;

};

ActionLayer.cpp

#include "ActionLayer.h"

#include "ActionAnimationLayer.h" ActionLayer::ActionLayer(void)

{

}

ActionLayer::~ActionLayer(void)

{

}

CCLayer* ActionLayer::layer(int id)

{

CCLayer* pLayer=NULL;

switch(id)

{

case ACTION_ANIMA TION_LAYER:

pLayer=new ActionAnimationLayer();

break;

}

return pLayer;

}

ActionAnimationLayer.h

#pragma once

#include "actionlayer.h"

class ActionAnimationLayer :public ActionLayer {

public:

ActionAnimationLayer(void);

~ActionAnimationLayer(void);

virtual void onEnter();

void frameAnimation(CCSpriteFrameCache *cache);

void jumpAnimation();

void fadeAnimation();

void sequenceAnimation(CCSize s);

void followAnimation(CCSize s);

};

ActionAnimationLayer.cpp

#include "ActionAnimationLayer.h"

ActionAnimationLayer::ActionAnimationLayer(void)

{

}

ActionAnimationLayer::~ActionAnimationLayer(void)

{

}

void ActionAnimationLayer::onEnter()

{

//【注意:】此句话千万不要漏了,漏了是不会有动画效果的,底层包含了动画的刷新,//我就是这个地方啊!搞得我多搞了几个小时,还好这个工程熟悉了一下底层的代码CCLayer::onEnter();

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

CCSpriteFrameCache *cache=CCSpriteFrameCache::sharedSpriteFrameCache();

cache->addSpriteFramesWithFile("role.plist","role.png");

grossini=CCSprite::spriteWithSpriteFrameName("role2.png");

grossini->setPosition(ccp(s.width/2,s.height/2));

this->addChild(grossini);

//播放帧动画

//this->frameAnimation(cache);

//播放跳动画

//this->jumpAnimation();

//浅入浅出

//this->fadeAnimation();

//组动画:move+rotate

//this->sequenceAnimation(s);

//拉屏幕效果

this->followAnimation(s);

}

void ActionAnimationLayer::frameAnimation(CCSpriteFrameCache *cache)

{

//第一种方式:

CCAnimation* animation = CCAnimation::create();

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

{

char szName[100] = {0};

sprintf(szName, "role%1d.png", i);

//animation->addSpriteFrameWithFileName(szName);

animation->addSpriteFrame(cache->spriteFrameByName(szName));

}

// 每针停留2.8/14f秒

animation->setDelayPerUnit(2.8f / 14.0f);

//设置恢复初始针

animation->setRestoreOriginalFrame(true);

//设置循环次数

animation->setLoops(4);

//创建动画

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

//运行动画

grossini->runAction(CCSequence::create(action, action->reverse(), NULL));

//第二种方式:

/*CCArray* animFrames=CCArray::create(4);

char str[100]={0};

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

{

sprintf(str, "role%1d.png", i);

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

animFrames->addObject(frame);

}

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

grossini->runAction(CCRepeatForever::create(CCAnimate::create(animation)));*/

}

void ActionAnimationLayer::jumpAnimation()

{

//参数说明:时间秒,移动点,高度,步数

CCActionInterval* actionTo = CCJumpTo::create(2, CCPointMake(300,300), 50, 4);

CCActionInterval* actionBy = CCJumpBy::create(2, CCPointMake(300,0), 50, 4);

CCActionInterval* actionByBack = actionBy->reverse();//让动作回到actionBy之前的地方

grossini->runAction( actionTo);

grossini->runAction( CCSequence::create(actionBy, actionByBack, NULL));

}

void ActionAnimationLayer::fadeAnimation()

{

grossini->setOpacity(0);//设置透明度0为完全透明,1不透明

CCActionInterval* action1 = CCFadeIn::create(1.0f);

CCActionInterval* action1Back = action1->reverse();//同上

grossini->runAction( CCSequence::create( action1, action1Back, NULL));

}

void ActionAnimationLayer::sequenceAnimation(CCSize s)

{

grossini->setPosition(ccp(60, s.height/2));

//移动到(240,0)然后旋转540度

CCFiniteTimeAction* action = CCSequence::create(

CCMoveBy::create( 2, CCPointMake(240,0)),

CCRotateBy::create( 2, 540),

NULL);

grossini->runAction(action);

}

void ActionAnimationLayer::followAnimation(CCSize s)

{

//这个效果我喜欢,以后游戏中可以用到...

grossini->setPosition(CCPointMake(-200, s.height / 2));

CCActionInterval* move= CCMoveBy::create(2, CCPointMake(s.width * 3, 0));

CCActionInterval* move_back = move->reverse();

CCFiniteTimeAction* seq = CCSequence::create(move, move_back, NULL);//来回移动

CCAction* rep = CCRepeatForever::create((CCActionInterval*)seq);//设置成永远循环

grossini->runAction(rep);

this->runAction(CCFollow::create(grossini, CCRectMake(0, 0, s.width * 2 - 100, s.height)));//设定一个拉动层区域动画

}

帧动画,跳动画,组合动画,浅入浅出动画,拉屏幕动画,对于这些了解了,然后如果还有其他需求,相对就简单很多了.好了。明天讲menu,Label等,也就是游戏常用的一些ui...