Cocos2d-x 3.2 學習筆記（五）Sprite Node

時間 2019-12-02

標籤 cocos2d cocos 3.2 學習筆記 sprite node 欄目 Cocos2d-x 简体版

原文原文鏈接

遊戲中最重要的元素Sprite精靈，關於精靈的建立，精靈的控制等等。緩存

涉及到的類Class：ide

AnimationFrame 動畫幀。工具

Animation 動畫對象；一個用來在精靈對象上表現動畫的動畫對象。測試

AnimationCache 動畫緩存單例類。如何你想要保存動畫，你須要使用這個緩存。動畫

Sprite 精靈;定義爲二維圖像。this

SpriteBatchNode 與批量節點相似，若是包含子節點會在一次OpenGL調用內繪製完成。spa

SpriteFrame 一個精靈幀。code

SpriteFrameCache 處理精靈幀的載入的單例。它將精靈幀保存在緩存裏。對象

下面依次說下用法blog

/************************************************************************/
/*Sprite定義爲二維圖像
能夠經過一個圖像或一個圖像的矩形裁剪部分建立Sprite
Sprite的默認錨點(anchorPoint)爲(0.5, 0.5)。

*/
/************************************************************************/
Sprite* SpriteNodeTest::createSpriteByPath()
{
    auto sprite = Sprite::create("grossinis_sister2.png");
    auto size = Director::getInstance()->getVisibleSize();
    Vec2 origin = Director::getInstance()->getVisibleOrigin();
    sprite->setPosition(Vec2(size.width/2 + origin.x, size.height/2 + origin.y));
    return sprite;
}

/************************************************************************/
/* 一個精靈幀包括：

紋理：一個被精靈使用的二維紋理
矩形：一個紋理矩形                                                                     */
/************************************************************************/
Sprite* SpriteNodeTest::createSpriteBySpriteFrame()
{
    auto sFrame = SpriteFrame::create("grossinis_sister2.png",Rect(0,0,56,138));
    auto sprite = Sprite::createWithSpriteFrame(sFrame);
    auto size = Director::getInstance()->getVisibleSize();
    Vec2 origin = Director::getInstance()->getVisibleOrigin();
    sprite->setPosition(Vec2(size.width/2 + origin.x, size.height/2 + origin.y));
    return sprite;
}

/************************************************************************/
/* 處理精靈幀的載入的單例。 它將精靈幀保存在緩存裏。
    只須要加載一次文件，在多個地方經過名字或標記就能夠直接使用紋理和精靈幀
*/
/************************************************************************/
Sprite* SpriteNodeTest::createSpriteBySpriteFrameCache()
{
    auto cache = SpriteFrameCache::getInstance();
    cache->addSpriteFramesWithFile("grossini-aliases.plist");
    auto sFrame = cache->getSpriteFrameByName("grossini_dance_01.png");
    auto sprite = Sprite::createWithSpriteFrame(sFrame);
    auto size = Director::getInstance()->getVisibleSize();
    Vec2 origin = Director::getInstance()->getVisibleOrigin();
    sprite->setPosition(Vec2(size.width/2 + origin.x, size.height/2 + origin.y));
    return sprite;
}

/************************************************************************/
/*
    SpriteBatchNode與批量節點相似，若是包含子節點會在一次OpenGL調用內繪製完成
    一個SpriteBatchNode能夠引用一個且只有一個紋理(一個圖像文件或一個紋理集)，只有包含該紋理的Sprite能夠加入到SpriteBatchNode中。 
    加入SpriteBatchNode的全部Sprite在一次OpenGL ES調用內繪製完成，而未加入SpriteBatchNode的Sprite每個都須要單獨調用OpenGL ES繪製，
    這樣效率比較低。這個能夠本身去試一下效果作個對比就能看出。
*/
/************************************************************************/
SpriteBatchNode* SpriteNodeTest::createSpriteBySpriteBatchNode()
{
    auto size = Director::getInstance()->getVisibleSize();
    SpriteFrameCache::getInstance()->addSpriteFramesWithFile("grossini-aliases.plist");
    auto sBatch = SpriteBatchNode::create("grossini-aliases.png");
    for (int len = 0; len < 250; len++)
    {
        auto sprite = Sprite::createWithSpriteFrameName("grossini_dance_01.png");
        sprite->setPosition(Vec2(CCRANDOM_0_1()*size.width,CCRANDOM_0_1()*size.height));
        sBatch->addChild(sprite);
    }
    return sBatch;
}

/************************************************************************/
/* 一個用來在精靈對象上表現動畫的動畫對象
動畫對象包含動畫幀對象, 還可能有一個設定這些幀之間延遲的參數. 
你能夠用動畫動做(Animate action)來建立一個動畫對象
*/
/************************************************************************/
Sprite* SpriteNodeTest::createSpriteByAnimation()
{
    auto size = Director::getInstance()->getVisibleSize();
    Vec2 origin = Director::getInstance()->getVisibleOrigin();

    auto cache = SpriteFrameCache::getInstance();
    cache->addSpriteFramesWithFile("grossini-aliases.plist");

    auto sprite = Sprite::createWithSpriteFrameName("grossini_dance_01.png");
    sprite->setPosition(Vec2(size.width/2 + origin.x, size.height/2 + origin.y));
    
    Vector<SpriteFrame*> aFrames(15);
    char sFrameName[100]={0};
    for (int len = 1;len < 15; len++)
    {
        sprintf(sFrameName,"dance_%02d",len);
        auto sFrame = cache->getSpriteFrameByName(sFrameName);
        aFrames.pushBack(sFrame);
    }
    auto animation = Animation::createWithSpriteFrames(aFrames,0.3f);
    sprite->runAction(RepeatForever::create(Animate::create(animation)));

    return sprite;
}

/************************************************************************/
/* 動畫緩存單例類。 如何你想要保存動畫，你須要使用這個緩存
*/
/************************************************************************/
Sprite* SpriteNodeTest::createSpriteByAnimationCache()
{
    auto size = Director::getInstance()->getVisibleSize();
    Vec2 origin = Director::getInstance()->getVisibleOrigin();

    auto cache = SpriteFrameCache::getInstance();
    //緩存animations要用到的資源
    cache->addSpriteFramesWithFile("grossini-aliases.plist","grossini-aliases.png");

    auto sprite = Sprite::createWithSpriteFrameName("grossini_dance_01.png");
    sprite->setPosition(Vec2(size.width/2 + origin.x, size.height/2 + origin.y));

    auto aCache = AnimationCache::getInstance();
    //animations裏面包含動畫信息和名字，要確保animations包含的資源已經在SpriteFrameCache裏面緩存
    aCache->addAnimationsWithFile("animations-2.plist");
    sprite->runAction(RepeatForever::create(Animate::create(aCache->animationByName("dance_1"))));
    return sprite;
}

上面就是基本的用法，固然這很粗淺，更深的用法以及工具類，慢慢研究吧！

這是我寫的測試類：

#ifndef __SpriteNodeTest__
#define __SpriteNodeTest__

#include "cocos2d.h"
USING_NS_CC;

class SpriteNodeTest : public cocos2d::Layer
{
public:
    static cocos2d::Scene* createScene();
    CREATE_FUNC(SpriteNodeTest);
    virtual bool init(); 
    static Sprite* createSpriteByPath();
    static Sprite* createSpriteBySpriteFrame();
    static Sprite* createSpriteBySpriteFrameCache();
    static SpriteBatchNode* createSpriteBySpriteBatchNode();
    static Sprite* createSpriteByAnimation();
    static Sprite* createSpriteByAnimationCache();
protected:
    bool onTouchBeganFun(Touch* touch,Event* ev);
};

#endif

SpriteNodeTest.h

#include "SpriteNodeTest.h"

std::function<Node*()> demotest[]=
{
    SpriteNodeTest::createSpriteByPath,
    SpriteNodeTest::createSpriteBySpriteFrame,
    SpriteNodeTest::createSpriteBySpriteFrameCache,
    SpriteNodeTest::createSpriteBySpriteBatchNode,
    SpriteNodeTest::createSpriteByAnimation,
    SpriteNodeTest::createSpriteByAnimationCache
};

Scene* SpriteNodeTest::createScene()
{
    // 'scene' is an autorelease object
    auto scene = Scene::create();

    // 'layer' is an autorelease object
    auto layer = SpriteNodeTest::create();

    // add layer as a child to scene
    scene->addChild(layer);

    // return the scene
    return scene;
}

bool SpriteNodeTest::init()
{
    auto event = EventListenerTouchOneByOne::create();
    event->onTouchBegan = CC_CALLBACK_2(SpriteNodeTest::onTouchBeganFun,this);
    this->_eventDispatcher->addEventListenerWithSceneGraphPriority (event,this);

    createSpriteByPath();
    return true;
}
#define MAX_LAYER    (sizeof(demotest) / sizeof(demotest[0]))
int index=0;
bool SpriteNodeTest::onTouchBeganFun(Touch* touch,Event* ev)
{
    index++;
    index = index % MAX_LAYER;

    this->removeAllChildren();
    auto sprite = demotest[index]();
    this->addChild(sprite);
    return true;
}

/************************************************************************/
/*Sprite定義爲二維圖像
能夠經過一個圖像或一個圖像的矩形裁剪部分建立Sprite
Sprite的默認錨點(anchorPoint)爲(0.5, 0.5)。

*/
/************************************************************************/
Sprite* SpriteNodeTest::createSpriteByPath()
{
    auto sprite = Sprite::create("grossinis_sister2.png");
    auto size = Director::getInstance()->getVisibleSize();
    Vec2 origin = Director::getInstance()->getVisibleOrigin();
    sprite->setPosition(Vec2(size.width/2 + origin.x, size.height/2 + origin.y));
    return sprite;
}


/************************************************************************/
/* 一個精靈幀包括：

紋理：一個被精靈使用的二維紋理
矩形：一個紋理矩形                                                                     */
/************************************************************************/
Sprite* SpriteNodeTest::createSpriteBySpriteFrame()
{
    auto sFrame = SpriteFrame::create("grossinis_sister2.png",Rect(0,0,56,138));
    auto sprite = Sprite::createWithSpriteFrame(sFrame);
    auto size = Director::getInstance()->getVisibleSize();
    Vec2 origin = Director::getInstance()->getVisibleOrigin();
    sprite->setPosition(Vec2(size.width/2 + origin.x, size.height/2 + origin.y));
    return sprite;
}
/************************************************************************/
/* 處理精靈幀的載入的單例。 它將精靈幀保存在緩存裏。
    只須要加載一次文件，在多個地方經過名字或標記就能夠直接使用紋理和精靈幀
*/
/************************************************************************/
Sprite* SpriteNodeTest::createSpriteBySpriteFrameCache()
{
    auto cache = SpriteFrameCache::getInstance();
    cache->addSpriteFramesWithFile("grossini-aliases.plist");
    auto sFrame = cache->getSpriteFrameByName("grossini_dance_01.png");
    auto sprite = Sprite::createWithSpriteFrame(sFrame);
    auto size = Director::getInstance()->getVisibleSize();
    Vec2 origin = Director::getInstance()->getVisibleOrigin();
    sprite->setPosition(Vec2(size.width/2 + origin.x, size.height/2 + origin.y));
    return sprite;
}
/************************************************************************/
/*
    SpriteBatchNode與批量節點相似，若是包含子節點會在一次OpenGL調用內繪製完成
    一個SpriteBatchNode能夠引用一個且只有一個紋理(一個圖像文件或一個紋理集)，只有包含該紋理的Sprite能夠加入到SpriteBatchNode中。 
    加入SpriteBatchNode的全部Sprite在一次OpenGL ES調用內繪製完成，而未加入SpriteBatchNode的Sprite每個都須要單獨調用OpenGL ES繪製，
    這樣效率比較低。這個能夠本身去試一下效果作個對比就能看出。
*/
/************************************************************************/
SpriteBatchNode* SpriteNodeTest::createSpriteBySpriteBatchNode()
{
    auto size = Director::getInstance()->getVisibleSize();
    SpriteFrameCache::getInstance()->addSpriteFramesWithFile("grossini-aliases.plist");
    auto sBatch = SpriteBatchNode::create("grossini-aliases.png");
    for (int len = 0; len < 250; len++)
    {
        auto sprite = Sprite::createWithSpriteFrameName("grossini_dance_01.png");
        sprite->setPosition(Vec2(CCRANDOM_0_1()*size.width,CCRANDOM_0_1()*size.height));
        sBatch->addChild(sprite);
    }
    return sBatch;
}
/************************************************************************/
/* 一個用來在精靈對象上表現動畫的動畫對象
動畫對象包含動畫幀對象, 還可能有一個設定這些幀之間延遲的參數. 
你能夠用動畫動做(Animate action)來建立一個動畫對象
*/
/************************************************************************/
Sprite* SpriteNodeTest::createSpriteByAnimation()
{
    auto size = Director::getInstance()->getVisibleSize();
    Vec2 origin = Director::getInstance()->getVisibleOrigin();

    auto cache = SpriteFrameCache::getInstance();
    cache->addSpriteFramesWithFile("grossini-aliases.plist");

    auto sprite = Sprite::createWithSpriteFrameName("grossini_dance_01.png");
    sprite->setPosition(Vec2(size.width/2 + origin.x, size.height/2 + origin.y));
    
    Vector<SpriteFrame*> aFrames(15);
    char sFrameName[100]={0};
    for (int len = 1;len < 15; len++)
    {
        sprintf(sFrameName,"dance_%02d",len);
        auto sFrame = cache->getSpriteFrameByName(sFrameName);
        aFrames.pushBack(sFrame);
    }
    auto animation = Animation::createWithSpriteFrames(aFrames,0.3f);
    sprite->runAction(RepeatForever::create(Animate::create(animation)));

    return sprite;
}
/************************************************************************/
/* 動畫緩存單例類。 如何你想要保存動畫，你須要使用這個緩存
*/
/************************************************************************/
Sprite* SpriteNodeTest::createSpriteByAnimationCache()
{
    auto size = Director::getInstance()->getVisibleSize();
    Vec2 origin = Director::getInstance()->getVisibleOrigin();

    auto cache = SpriteFrameCache::getInstance();
    //緩存animations要用到的資源
    cache->addSpriteFramesWithFile("grossini-aliases.plist","grossini-aliases.png");

    auto sprite = Sprite::createWithSpriteFrameName("grossini_dance_01.png");
    sprite->setPosition(Vec2(size.width/2 + origin.x, size.height/2 + origin.y));

    auto aCache = AnimationCache::getInstance();
    //animations裏面包含動畫信息和名字，要確保animations包含的資源已經在SpriteFrameCache裏面緩存
    aCache->addAnimationsWithFile("animations-2.plist");
    sprite->runAction(RepeatForever::create(Animate::create(aCache->animationByName("dance_1"))));
    return sprite;
}