帧动画是我们见得最多的，
电视、
电影等，
如果印象深刻的话，
小时候的那种老款照相机的
胶卷
...
大小相同的一张一张的底片
....
哈哈！其实如果对游戏要求不高，游戏的图片也不多，
咋们就可以采用这种方式来制作动画，不过好游戏一般都不是这样做的
....
那是什么呢？
...
动作编辑器，先讲讲最基础的制作动画方式（其实利用动作编辑器，其实也是切割图片
,
如
果还没有接触过动作编辑器的，可以学着用下
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)));//设定一个拉动层区域动画
}
帧动画，跳动画,组合动画,浅入浅出动画,拉屏幕动画，对于这些了解了，然后如果还有其他需求，相对就简单很多了。