Cocos2d-x初入学堂(4)-->CCSprite动画

来源:未知 责任编辑:智问网络 发表时间:2013-11-08 08:44 点击:

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

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

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

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

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

看一下我的目录:

 

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

ActionScene.h

[cpp]
#pragma once 
#include "cocos2d.h" 
using namespace cocos2d; 
 
class ActionScene :public CCScene 

public: 
    ActionScene(void); 
    ~ActionScene(void); 
    static CCScene* scene(); 
}; 

ActionScen.cpp

[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

[cpp] 
#pragma once 
#include "cocos2d.h" 
using namespace cocos2d; 
enum 

    ACTION_ANIMATION_LAYER=0 
}; 
 
class ActionLayer :public CCLayer 

public: 
    ActionLayer(void); 
    ~ActionLayer(void); 
    static CCLayer* layer(int id); 
protected: 
    CCSprite* grossini; 
}; 

ActionLayer.cpp

[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_ANIMATION_LAYER: 
        pLayer=new ActionAnimationLayer(); 
        break; 
    } 
    return pLayer; 

ActionAnimationLayer.h

[cpp] 
#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

[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...
如果讲述得有误,或者不对的地方,还望各位指出!

    发表评论
    请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
    用户名: 验证码:点击我更换图片
    最新评论 更多>>

    推荐热点

    • cocos2d-x学习笔记(19)--label 、label atlas
    • cocos2d-x学习笔记(23)--地图的使用3--CCTMXLayer
    • Cocos2d-x学习(一):HelloWorld
    • cocos2dx在xcode下开发,编译到android上(2)
    • cocos2d 设置屏幕默认方向
    • Cocos2d-x 2.0 之 Actions “三板斧” 之一
    • cocos2d-x学习笔记(22)--地图的使用2(TMX) --Z-Order、AnchorPoi
    • cocos2d-x学习笔记(18)--游戏打包(windows平台)
    • cocos2d-x学习笔记(16)--spritesheet(精灵表单)
    网站首页 - 友情链接 - 网站地图 - TAG标签 - RSS订阅 - 内容搜索
    Copyright © 2008-2015 计算机技术学习交流网. 版权所有

    豫ICP备11007008号-1