注：那個，秉著敬業愛業的精神，代碼我會盡量解釋清楚和一些路上撿的心得體會外加一堆廢話(這段也是廢話!!!)。如果沒有解釋的，那是我也沒看懂，(╯3╰)，百度去吧。倒是感覺這代碼注釋過多也是影響了代碼的可見度，so如有影響，直接參照源代碼。(這尼瑪HelloWorld也要注釋？額~~請輕噴)

一、材料準備
http://download.csdn.net/detail/dyyaries/6014343
這個是我在百度的時候找到的素材，微信飛機大戰。百度真方便！！！真心慷慨，這不是做廣告！嘿嘿，別動手，別~~~。
因為這個游戲比較簡單，適合新手練手，所以拿他來開刀是再好不過了。當然里面許多素材是不需要的，實現基本的游戲邏輯只需要幾張圖片就夠了，用到哪些后面有提及。
打開項目文件夾，把需要用到的游戲圖片資源導入游戲項目根目錄下的Resourse文件夾中。注：游戲里要用到的資源是默認從這里開始為根目錄去讀取的，比如Resourse下有一張simple.png的圖片，到時候可以在項目中直接讀取資源路徑”simple.png”即可。
二、 屏幕大小調節
下面就需要我們調戲，啊不是調試和編寫我們的代碼了。
先打開vs2012，這個是我當前的IDE，依次點擊文件->打開->項目/解決方案，打開游戲項目的proj.win32下的planegame.sln即可以導入游戲項目到vs 2012中。
打飛機當然是豎屏了才有感覺，在AppDelagate那里修改下窗口的屬性，調整游戲窗口的大小。
打開src目錄下的AppDelegate，src目錄是我們游戲代碼存放的地方，在applicationDidFinishLaunching()的如下位置添加如下代碼
glview = GLViewImpl::create(“飛機大戰”); //這里是修改后的窗口左上角顯示的標題

glview->setFrameSize(480,800); //添加的代碼 director->setOpenGLView(glview);

現在可以跑下看看窗口改變的效果。
三、 背景圖片與滾動
打開HelloWorldScene.cpp。
以下段落可以略過。
注意，這個是我們游戲的第一個場景，Cocos2d引擎幫我們封裝了許多邏輯，以至于我們只需關注我們的游戲場景和處理邏輯。其實游戲的開始是從win32下的main.cpp里面的APIENTRY _tWinMain方法開始，這是個宏，其實就是c++語言的main方法，他定義了AppDelegate的一個對象，隨后他會初始化AppDelegate的父類Application然后把他本身的指針給了父類的一個父類自身變量，這樣做的目的是為了隨后調用AppDelegate的applicationDidFinishLaunching()方法，這個是我們可以接觸到用來初始化游戲窗口初始化導演類，還有初始化我們的第一個場景HelloWorld。最后main方法執行到了Application::getInstance()->run()，這里面封裝的是我們游戲的循環和渲染等等邏輯。這時候我們的游戲已經跑起來了。這個就是簡單的游戲啟動過程。更加深層的代碼有興趣可以去研究研究源碼，這也是開源帶來的好處。
打開HelloWorldScene.cpp，刪除原有的創建菜單和背景的代碼，再添加如下代碼：

//背景精靈auto bg1 = Sprite::create("background.png");

//注意，Vec2是cocos2d的數據結構，里面包含兩個float型的數據，分別用來表示x軸和y軸。
//setPosition是設置精靈的相對屏幕的位置（也就是世界坐標）。當前這兩個參數表示設置精靈在屏幕的寬度一半，高度為零的位置，即屏幕最下方的中間位置。cocos2d是以OpenGl的坐標的右手坐標為標準，屏幕的左下方為原點。visibleSize.width和height是屏幕的寬高，
bg1->setPosition(Vec2(origin.x + visibleSize.width/2,0));
//注意這里的錨點設置，為了圖片永遠在屏幕中間，x軸必須設置為0.5，其中的意思就是這個精靈向左移動精靈的一半寬度，y軸則是向下
bg1->setAnchorPoint(Vec2(0.5,0));
bg1->setTag(101); //設置Tag，以后可以通過這個標簽找到這個精靈，以便對這個精靈進行操作。
this->addChild(bg1,0); //將背景精靈添加到層中。可以認為是當前的屏幕。其中的0是設置可見優先權，數值越小優先權越小，即當如果有其他的精靈的優先權比他大時，他會被遮擋住的。

//第二張背景圖，是跟在第一張的上面，無縫連接，兩張圖形成不間斷的地圖滾動 ,getContentSize是獲取精靈的size其中有它的寬度和高度。

auto bg2 = Sprite::create("background.png"); bg2->setPosition(Vec2(origin.x + visibleSize.width/2, bg1->getPositionY()+bg1->getContentSize().height)); bg2->setAnchorPoint(Vec2(0.5,0)); bg2->setTag(102); this->addChild(bg2,0);

為什么有兩個一樣的背景精靈呢？這個是為了滾動地圖設定的。
先在HelloWorldScene.h文件中聲明定時器的回調方法。添加如下代碼:
void backgroundMove(float f); //定時器回調的背景滾動方法
然后在HelloWorldScene.cpp中定義他。

void HelloWorld::backgroundMove(float f) //背景滾動的回調方法 {//背景滾動邏輯auto bg1 = this->getChildByTag(101);auto bg2 = this->getChildByTag(102);//當第二張圖片退出屏幕時，把第一張圖片設置到屏幕中，由于我的背景圖片的高度是大于屏幕的高度的，所以判斷邏輯要復雜點if(bg2 -> getPositionY() + bg2->getContentSize().height <= Director::getInstance()->getVisibleSize().height){bg1->setPositionY(-bg1->getContentSize().height + Director::getInstance()->getVisibleSize().height);}bg1->setPositionY(bg1->getPositionY()-3);bg2->setPositionY(bg1->getPositionY()+bg1->getContentSize().height); }

背景滾動邏輯第一次接觸也是件麻煩事，下面一張圖告訴你。下面的圖表示的邏輯也是上面的回調方法的實現。

游戲一開始是①狀態，定時器會不斷得修改背景精靈一和背景精靈二的坐標，當兩者的坐標到達②的狀態時，修改兩者的坐標到③狀態，其實也就是回到了游戲剛開始的狀態①，然后就是你看到的無限背景滾動的效果了。注意背景圖片的高度比屏幕小時兩張圖片就不足以做到以上效果了，該如何做呢，自己斟酌斟酌。不過這里的邏輯容易想清楚，但是其中的坐標計算也不是件頭疼的事。
最后，啟動定時器，在添加兩個背景精靈下面添加如下代碼：
//背景滾動的定時器,0.01執行一次傳入的函數
this->schedule(schedule_selector(HelloWorld::backgroundMove),0.01); 這里寫代碼片
好，背景滾動大功告成。跑一下看看效果如何吧。
四、 游戲菜單項
現在這個項目還比較簡單，只有簡單的開始游戲、退出游戲這兩個選項，玩過游戲的都知道還有游戲設置啊、關于啊幫助啊這些。
首先在HelloWorldScene.h中聲明兩個回調方法，這兩個方法是在點擊兩菜單項時觸發的函數。
添加如下代碼：

// 菜單項的回調方法void menuCloseCallback(cocos2d::Ref* pSender); //這個是系統默認寫好的下面的才是新添加的。void menuStartCallback(cocos2d::Ref* pSender); //參數什么的先不用去了解，循規蹈矩再去創新。

創建如下的菜單項：
//這個是開始游戲菜單項，其中的”game_start.png”, “game_start2.png”是讀取本地資源，作為未點擊前和點擊之后的顯示圖片。
// HelloWorld::menuStartCallback是他的回調函數，即點擊這個菜單項的時候會執行該函數

auto startItem = MenuItemImage::create( "game_start.png", "game_start2.png", CC_CALLBACK_1(HelloWorld::menuStartCallback, this)); startItem->setPosition(Vec2(visibleSize.width/2 + origin.x, visibleSize.height/2 + origin.y)); //這個是結束游戲菜單項auto closeItem = MenuItemImage::create( "game_exit.png", "game_exit2.png",CC_CALLBACK_1(HelloWorld::menuCloseCallback, this));closeItem->setPosition(Vec2(origin.x + visibleSize.width/2 ,visibleSize.height/2 + origin.y - startItem->getContentSize().height));//把菜單項添加到菜單精靈中auto menu = Menu::create(startItem,closeItem, NULL);menu->setPosition(Vec2::ZERO);//把菜單精靈添加到當前的層中this->addChild(menu,1);

下面是回調函數的實現
結束游戲的回調函數就直接調用創建時默認生成的。

void HelloWorld::menuStartCallback(Ref* pSender) {//開始游戲 }

好，菜單項搞定，編譯運行下，是不是發現有兩個菜單項在屏幕中間了！！！點擊退出還可以退出游戲。不過開始游戲邏輯還沒寫。呵呵，小有成就是吧。好我們繼續。
五、蠢蠢欲動的飛機
為了體現出我們的飛機饑渴難耐啊不，是迫不及待想直搗敵人基地的雄姿，我們給他一個動畫展示，展示它飛翔的雄姿。
添加如下代碼：

//添加飛機auto plane = Sprite::create("hero1.png");plane->setPosition(visibleSize.width/2+origin.x,200);this->addChild(plane);

//飛機添加幀動畫，添加格式如下，別問我為什么，呵呵。
Animation * animation = Animation::create();
//本來是通過一張緩存圖片去獲取的，這樣性能比較好。不過方便起見，so~~~。
//其中的Rect(0,0,102,126)聰明人都可以看出是讀取圖片資源的矩形區域的紋理。什么？你看不懂？呵呵。什么？紋理是什么？呵呵。

SpriteFrame * spriteFrame1 = SpriteFrame::create("hero1.png",Rect(0,0,102,126)); SpriteFrame * spriteFrame2 = SpriteFrame::create("hero2.png",Rect(0,0,102,126)); animation->addSpriteFrame(spriteFrame1);animation->addSpriteFrame(spriteFrame2);animation->setDelayPerUnit(0.15f); //兩張圖片交互播放的間隔Animate * animate = Animate::create(animation);plane->runAction(RepeatForever::create(animate)); //開始執行動畫

動畫的執行是以精靈為單位，即可以為精靈添加動畫，創建完動畫，只要讓精靈執行這個動作即可。如果執行完畢后，必須使用下面代碼移除動畫
sprite->stopAllActions(); //停止所有動畫，應該是清除了動畫的內存。
Animate 是繼承了Ref，所以的他的內存的cocos2d框架自動回收的，我們不用自動釋放他。但是如果不需要時也要手動停止它。因為我們當前的飛機精靈動畫是在當前場景無限存活，不需手動停止它，當我們切換到開始游戲啟動另一個場景時，它會自動清除內存，吧。為什么這么沒自信，這是我猜的。嘿嘿，別沖動別沖動，有話好好說。

ok，飛機動畫創建成功，啟動運行一下吧。是不是看到小飛機的飛翔在天空中的雄姿了？？？

2-6 最終界面
如圖：

素材：素材
源碼：源碼1

總結

以上是生活随笔為你收集整理的Cocos2d-x 3.x学习笔记：猩先生带你打飞机(二)素材准备与游戏菜单场景的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。