Cocos2d-x遊戲開發執行個體詳解3：無限滾動地圖

通過自己的實際演練，詳細解說Cocos2d-x引擎的個子產品。今天講解無限滾動地圖。一般打飛機類遊戲都是飛機不動，背景圖滾動，造成飛機在天空飛的效果。

MoonWarriors的背景有兩層，一個遠景天空，一個近景漂浮物，這兩層背景滾動速度不一樣，形成一種縱深感。

如圖：

圖有點模糊，實際效果跟html5的一樣（根本就是照着它寫的，嘿嘿）

前面說了，背景分為兩部分，天空和漂浮物，下面分别解釋一下

1，天空背景

源圖是一張320*576的jpg圖檔。加載的時候實質上是分兩次進行的。

m_backSky = CCSprite::create(s_bg01);
    m_backSky->setAnchorPoint(ccp(0, 0));
    m_backSkyHeight = m_backSky->getContentSize().height;
    addChild(m_backSky, -10);      

這是初始初始狀态，加載後執行一個動作

m_backSky->runAction(CCMoveBy::create(3, ccp(0, -48)));      

就是移動48像素。然後調用一個重複的任務排程來重複滾動;

schedule(schedule_selector(GameLayer:: movingBackground),3);      

來看下這個滾動函數：
void GameLayer::movingBackground()
{
    m_backSky->runAction(CCMoveBy::create(3, ccp(0, -48)));
    m_backSkyHeight -= 48;
    if (m_backSkyHeight <= winSize.height) {
        if (!m_isBackSkyReload) {
            m_backSkyRe = CCSprite::create(s_bg01);
            m_backSkyRe->setAnchorPoint(ccp(0, 0));
            addChild(m_backSkyRe, -10);
            m_backSkyRe->setPosition(ccp(0, winSize.height));
            m_isBackSkyReload = true;
        }
        m_backSkyRe->runAction(CCMoveBy::create(3, ccp(0, -48)));
    }
    
    if (m_backSkyHeight <= 0) {
        m_backSkyHeight = m_backSky->getContentSize().height;
        this->removeChild(m_backSky, true);
        m_backSky = m_backSkyRe;
        m_backSkyRe = NULL;
        m_isBackSkyReload = false;
    }
}      

可以看到，實質上是有兩個CCSpite輪換加載來滾的。第一張滾加載完後圖檔比螢幕要高一些，它向下滾，滾到頂部到螢幕頂部的時候加載第二張，同時反轉Reload标志位，第二張緊接着滾也滾進螢幕，當第一張滾出螢幕的時候，第一張節點被remove，但指針指向第二個精靈，第二個指針則被釋放，同時标志位反轉，這就完成了一個周期。整個過程不斷重複。

2.近景漂浮物滾動

思路跟上面那個一模一樣，但是這個的圖檔不一樣，這是一個tmx，使用瓦片地圖的方式加載。

初始加載

m_backTileMap = CCTMXTiledMap::create(s_level01);
    addChild(m_backTileMap, -9);
    m_backTileMapHeight = m_backTileMap->getMapSize().height * m_backTileMap->getTileSize().height;
    m_backTileMapHeight -= 200;
    m_backTileMap->runAction(CCMoveBy::create(3, ccp(0, -200)));
      

滾動部分：

m_backTileMap->runAction(CCMoveBy::create(3, ccp(0, -200)));
    m_backTileMapHeight -= 200;
if (m_backTileMapHeight <= winSize.height) {
        if (!m_isBackTileReload) {
            m_backTileMapRe = CCTMXTiledMap::create(s_level01);
            this->addChild(m_backTileMapRe, -9);
            m_backTileMapRe->setPosition(0, winSize.height);
            m_isBackTileReload = true;
        }
        m_backTileMapRe->runAction(CCMoveBy::create(3, ccp(0, -200)));
    }
    
    if (m_backTileMapHeight <= 0) {
        m_backTileMapHeight = m_backTileMap->getMapSize().height * m_backTileMap->getTileSize().height;
        this->removeChild(m_backTileMap, true);
        m_backTileMap = m_backTileMapRe;
        m_backTileMapRe = NULL;
        m_isBackTileReload = false;
    }