Cocos2dx中精靈(CCSprite)、動畫建立

lixiaogang_theanswer發表於2018-06-25
  • 1 .精靈的3種建立方法
/* _MySprite自定義的一個類 */
bool _MySprite::init()
{
    //方法1.直接使用圖片來建立精靈
    CCSprite* sprite = CCSprite::create("CloseNormal.png");
    addChild(sprite);
    sprite->setPosition(ccp(100, 100));
-------------------------------------------------
    //方法2.通過紋理建立精靈
    CCTexture2D* texture = CCTextureCache::sharedTextureCache()
        ->addImage("CloseNormal.png");
    CCSprite* sprite = CCSprite::createWithTexture(texture);
    addChild(sprite);
    sprite->setPosition(ccp(100, 100));
-------------------------------------------------
    //方法3.通過精靈幀(幀)建立精靈
    CCTexture2D* texture = CCTextureCache::sharedTextureCache()
        ->addImage("CloseNormal.png");
    CCSpriteFrame* frame = CCSpriteFrame::createWithTexture(texture, CCRect(0, 0, 20, 20));

    CCSprite* sprite = CCSprite::createWithSpriteFrame(frame);
    addChild(sprite);
    sprite->setPosition(ccp(100, 100));

    return true;
}
  • 2 .動作(CCMoveBy)和動畫( CCAnimate)
bool _MoveByAction::init()
{

    CCLayer::init();

    //(1). moveby

    CCSprite* sprite = CCSprite::create("CloseNormal.png");
    sprite->setPosition(ccp(100, 100));
    addChild(sprite);

#if 0
    /* 建立動作 */
    CCMoveBy* moveby = CCMoveBy::create();
    sprite->runAction(moveby);
#endif

-----------------------------------------------------
    //(2). 建立動畫
    CCArray* arr = CCArray::create();
    for (auto i = 0; i < var; ++i)
    {
        /* var變數為當前resource中有多少張資源圖片 */
        char fileName[256];
        memset(fileName, 0x00, sizeof(fileName));
        sprintf(fileName, "圖片名稱%d.png", i);
        CCSpriteFrame* frame = CCSpriteFrame::create(fileName, CCRect(0, 0, 80, 80));
        /* CCRect(0,0,80,80)中的80*80是因為圖片資源為80*80 */
        arr->addObject(frame);
    }
    CCAnimation* animation = CCAnimation::createWithSpriteFrames(arr, 0.1f);  
                                                        //0.1f是time
    CCAnimate* animate = CCAnimate::create(animation);

    /* 讓動畫不停的執行 */
    CCRepeatForever* repeat = CCRepeatForever::create(animate);
    sprite->runAction(repeat);

    return true;
}

上面建立動畫中,採用了陣列來存放圖片資源,假如為植物大戰殭屍遊戲中的植物(豌豆),共有8張(每秒鐘8張:p_2_01~p_2_08);如下所示例:
這裡寫圖片描述

但是在實際的開發中,不會這樣存放圖片資源(會浪費空間),特別是序列幀的特性中;應為下圖所示存放資源(將一系列的圖片放在一起):
這裡寫圖片描述

細心的讀者會有這樣的疑惑,那怎麼去從一張圖片中讀出每一個小的圖片資源?(假若上面的豌豆圖片的名稱是:pea.png,那麼會有對應的pea.plist檔案,其描述了該圖片資源的詳細資訊)。cocos2dx為我們提供了函式來解決這個問題,這樣便使得問題簡單化;如下程式碼:

bool _MoveByAction::init()
{

    CCLayer::init();

    //建立一個精靈
    CCSprite* sprite = CCSprite::create("CloseNormal.png");
    sprite->setPosition(ccp(100, 100));
    addChild(sprite);

    //PictureName.plist

    //載入合成中的幀到記憶體
    CCSpriteFrameCache* cache = CCSpriteFrameCache::sharedSpriteFrameCache();
    cache->addSpriteFramesWithFile("pea.plist");

    //找出緩衝中的幀並且放到陣列arr中
    CCArray* arr = CCArray::create();
    for (auto i = 0; i < 8; ++i)
    {
        /* var變數為當前resource中有多少張資源圖片 */
        char FrameName[256];
        memset(FrameName, 0x00, sizeof(FrameName));
        sprintf(FrameName, "圖片名稱%d.png", i);

        CCSpriteFrame* frame = cache->spriteFrameByName(FrameName);
        arr->addObject(frame);
    }

    //建立animation
    CCAnimation* animation = CCAnimation::createWithSpriteFrames(arr, 0.1f);
    //0.1f是time

    //通過animation來建立animate
    CCAnimate* animate = CCAnimate::create(animation);

    /* 通過animate建立無限迴圈的動畫動作 */
    CCRepeatForever* repeat = CCRepeatForever::create(animate);

    //讓精靈來執行動畫
    sprite->runAction(repeat);
    return true;
}

相關文章