幀動畫是我們見得最多的，
電視、
電影等，
如果印象深刻的話，
小時候的那種老款照相機的
膠捲
...
大小相同的一張一張的底片
....
哈哈！其實如果對遊戲要求不高，遊戲的圖片也不多，
咋們就可以採用這種方式來製作動畫，不過好遊戲一般都不是這樣做的
....
那是什麼呢？
...
動作編輯器，先講講最基礎的製作動畫方式（其實利用動作編輯器，其實也是切割圖片
,
如
果還沒有接觸過動作編輯器的，可以學着用下
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)));//設定一個拉動層區域動畫
}
幀動畫，跳動畫,組合動畫,淺入淺出動畫,拉屏幕動畫，對於這些瞭解了，然後如果還有其他需求，相對就簡單很多了。