coco2d-x 2.0.4 帧动画两种实现方式

最新推荐文章于 2019-03-13 13:53:00 发布

柒强

最新推荐文章于 2019-03-13 13:53:00 发布

阅读量1.6k

点赞数

分类专栏： cocos2d-x 文章标签： coco2d-x CCAnimation 帧动画

本文链接：https://blog.csdn.net/iasxk/article/details/9346977

版权

cocos2d-x 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

柒哥原创，欢迎转载，转载请在明显处注明！谢谢。

原文地址：点击打开链接

//第一种方法：

	//屏幕大小
        CCSize s = CCDirector::sharedDirector()->getWinSize();
    
        //把long.png加载到缓存中
        CCSpriteFrameCache *longFrameCache = CCSpriteFrameCache::sharedSpriteFrameCache();
        longFrameCache->addSpriteFramesWithFile("long.","long.png");

        //从缓存中获取每一帧，每一帧的名字从下面的long.plist文件中可以找到
	CCSpriteFrame *longFrame0 = longFrameCache->spriteFrameByName("longsprite1.png");
	CCSpriteFrame *longFrame1 = longFrameCache->spriteFrameByName("longsprite2.png");
	CCSpriteFrame *longFrame2 = longFrameCache->spriteFrameByName("longsprite3.png");
	CCSpriteFrame *longFrame3 = longFrameCache->spriteFrameByName("longsprite4.png");
	CCSpriteFrame *longFrame4 = longFrameCache->spriteFrameByName("longsprite5.png");
	CCSpriteFrame *longFrame5 = longFrameCache->spriteFrameByName("longsprite6.png");

        //4.2中CCMutableArray是未定义的，用CCArray一样的
	CCArray *longAnimFrames = CCArray::createWithCapacity(6);
	longAnimFrames->addObject(longFrame0);
	longAnimFrames->addObject(longFrame1);
	longAnimFrames->addObject(longFrame2);
	longAnimFrames->addObject(longFrame3);
	longAnimFrames->addObject(longFrame4);
	longAnimFrames->addObject(longFrame5);

	//必须创建一个精灵，这里用longFrame0作为精灵的原始图像
        CCSprite* sprite = CCSprite::createWithSpriteFrame(longFrame0);
        sprite->setPosition( ccp( s.width/2-80, s.height/2) );
        addChild(sprite);
 
         //创建动画
	CCAnimation *animation = CCAnimation::createWithSpriteFrames(longAnimFrames, 0.2f);
        longAnimFrames->release();//动画创建完后，把缓存中的帧释放
        CCAnimate *animate = CCAnimate::create(animation);
  
         //OK,让精灵走一会
	sprite->runAction(CCRepeatForever::create(animate));

//第二种方法：
       //屏幕大小
       CCSize s = CCDirector::sharedDirector()->getWinSize();
       //把long.png加载到缓存中
       CCTexture2D *texture = CCTextureCache::sharedTextureCache()->addImage("dragon_animation.png");
    
     //从缓存中获取每一帧
    CCSpriteFrame *frame0 = CCSpriteFrame::createWithTexture(texture, CCRectMake(132*0, 132*0, 132, 132));
    CCSpriteFrame *frame1 = CCSpriteFrame::createWithTexture(texture, CCRectMake(132*1, 132*0, 132, 132));
    CCSpriteFrame *frame2 = CCSpriteFrame::createWithTexture(texture, CCRectMake(132*2, 132*0, 132, 132));
    CCSpriteFrame *frame3 = CCSpriteFrame::createWithTexture(texture, CCRectMake(132*3, 132*0, 132, 132));
    CCSpriteFrame *frame4 = CCSpriteFrame::createWithTexture(texture, CCRectMake(132*0, 132*1, 132, 132));
    CCSpriteFrame *frame5 = CCSpriteFrame::createWithTexture(texture, CCRectMake(132*1, 132*1, 132, 132));
    
    //必须创建一个精灵，这里用longFrame0作为精灵的原始图像
    CCSprite* sprite = CCSprite::createWithSpriteFrame(frame0);
    sprite->setPosition( ccp( s.width/2-80, s.height/2) );
    addChild(sprite);

     //4.2中CCMutableArray是未定义的，用CCArray一样的
    CCArray* animFrames = CCArray::createWithCapacity(6);
    animFrames->addObject(frame0);
    animFrames->addObject(frame1);
    animFrames->addObject(frame2);
    animFrames->addObject(frame3);
    animFrames->addObject(frame4);
    animFrames->addObject(frame5);

     //创建动画
    CCAnimation *animation = CCAnimation::createWithSpriteFrames(animFrames, 0.2f);
    animFrames->release();
    CCAnimate *animate = CCAnimate::create(animation);

     //创建一种翻转的效果
    CCActionInterval* seq = (CCActionInterval*)(CCSequence::create( animate,
                       CCFlipX::create(true),
                       animate->copy()->autorelease(),
                       CCFlipX::create(false),
                       NULL) );
    //走起
    sprite->runAction(CCRepeatForever::create( seq ) );

两种方法区别不大，都很容易实现。

用到的图片资源：

方法一的

long.png

long.plist 文件内容如下：

<?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>longsprite1.png</key>
            <dict>
                <key>frame</key>
                <string>{{123,76},{119,72}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{119,72}}</string>
                <key>sourceSize</key>
                <string>{119,72}</string>
            </dict>
            <key>longsprite2.png</key>
            <dict>
                <key>frame</key>
                <string>{{2,76},{119,72}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{119,72}}</string>
                <key>sourceSize</key>
                <string>{119,72}</string>
            </dict>
            <key>longsprite3.png</key>
            <dict>
                <key>frame</key>
                <string>{{123,2},{119,72}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{119,72}}</string>
                <key>sourceSize</key>
                <string>{119,72}</string>
            </dict>
            <key>longsprite4.png</key>
            <dict>
                <key>frame</key>
                <string>{{2,2},{119,72}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{119,72}}</string>
                <key>sourceSize</key>
                <string>{119,72}</string>
            </dict>
            <key>longsprite5.png</key>
            <dict>
                <key>frame</key>
                <string>{{123,150},{119,72}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{119,72}}</string>
                <key>sourceSize</key>
                <string>{119,72}</string>
            </dict>
            <key>longsprite6.png</key>
            <dict>
                <key>frame</key>
                <string>{{2,150},{119,72}}</string>
                <key>offset</key>
                <string>{0,0}</string>
                <key>rotated</key>
                <false/>
                <key>sourceColorRect</key>
                <string>{{0,0},{119,72}}</string>
                <key>sourceSize</key>
                <string>{119,72}</string>
            </dict>
        </dict>
        <key>metadata</key>
        <dict>
            <key>format</key>
            <integer>2</integer>
            <key>realTextureFileName</key>
            <string>long.png</string>
            <key>size</key>
            <string>{256,256}</string>
            <key>smartupdate</key>
            <string>$TexturePacker:SmartUpdate:75ebb5e9193e585b4725cae12b723150$</string>
            <key>textureFileName</key>
            <string>long.png</string>
        </dict>
    </dict>
</plist>

方法二的

dragon_animation.png