cocos2dx 自學(xué)記錄（4）-- 寫一個(gè)自己的界面

1.像我這種初學(xué)者，都很難發(fā)現(xiàn)到底cocos2dx的代碼要寫去哪里，我也找了很久才發(fā)現(xiàn)是在你項(xiàng)目的Classes文件夾中。

我的： D:\cocos2d-x-2.2.3\projects\game1\Classes

2.里面有AppDelegate和HelloWorldScene

前者是整個(gè)游戲的入口，里面有3個(gè)函數(shù)，都有注釋說明的

applicationDidFinishLaunching() 加載完成后執(zhí)行的

applicationDidEnterBackground() 程序被擱置時(shí)執(zhí)行的，最小化之類的

applicationWillEnterForeground() 程序被恢復(fù)時(shí)執(zhí)行的

后者是一個(gè)場(chǎng)景的實(shí)現(xiàn)，相當(dāng)于地圖，

我們就是修改這個(gè)來寫自己的界面

3.在編寫代碼時(shí)候，多多查看API是必不可少的。

官網(wǎng)online的API文檔：http://www.cocos2d-x.org/reference/native-cpp/V2.2.3/index.html

4.打開HelloWorldScene.cpp來看看

原有一個(gè)label，一個(gè)中央圖片，一個(gè)退出按鈕

5.仿照原來的替換出自己的背景

我用的是這張，圖片的資源放在 D:\cocos2d-x-2.2.3\projects\game1\Resources

隨便改個(gè)名字，我的是 mainbg.png，記得權(quán)限

然后修改代碼

CCSprite* pSprite = CCSprite::create("mainbg.png");
CCSize bgsize = pSprite->getContentSize();
pSprite->setScale(visibleSize.height / bgsize.height);
pSprite->setPosition(ccp(visibleSize.width/2 + origin.x, visibleSize.height/2 + origin.y));

中間那句是我查出來的，可以得到精靈的大?。〒?jù)說很多東西都要用到sprite精靈這東西）

原來我試了一張自己覺得比較大的圖片，發(fā)現(xiàn)好像cocos2dx會(huì)自己壓縮它，但大的它不會(huì)平鋪下來

所以我取了下它的大小和屏幕的大小，讓圖片拉伸一下（setScale），適應(yīng)屏幕

然后ccp是什么呢，專業(yè)名詞叫 錨點(diǎn) ，我也是查的，不過感覺就是它的中點(diǎn)，

而origin.x,origin.y目前也沒搞懂是什么，但涉及坐標(biāo)的我都會(huì)把它加上。。這里就會(huì)把圖片居中，然后拉伸開來

另外，圖片的名字打錯(cuò)會(huì)導(dǎo)致程序不能運(yùn)行

6.有關(guān)坐標(biāo)系，cocos2dx采用OpenGL，所以左下角是（0,0）

7.編寫 開始 - 退出 菜單

我把原來退出部分刪除了，然后加入了自己這部分

CCMenuItemFont::setFontSize(30);
CCMenuItemFont *start = CCMenuItemFont::create("Start",this,menu_selector(HelloWorld::menuCallBackStart));
start->setPosition(ccp(50,200));
CCMenuItemFont *exit = CCMenuItemFont::create("Exit",this,menu_selector(HelloWorld::menuCallBackClose));
exit->setPosition(ccp(50,100));
CCMenu *menu = CCMenu::create(start,exit,NULL);
menu->setPosition(CCPointZero);
this->addChild(menu,1);

具體API自己查看，大概就是先創(chuàng)建兩個(gè)菜單選項(xiàng)，然后每一個(gè)顯示的是什么（原來的是圖片），點(diǎn)擊后調(diào)用的是哪個(gè)函數(shù)；然后用一個(gè)菜單包含兩個(gè)選項(xiàng)，最后把菜單加入到layer里面。

ccp里面的坐標(biāo)，是相對(duì)于其父節(jié)點(diǎn)的 錨點(diǎn) 的。

而看到addChild的第二個(gè)參數(shù)，查看API文檔發(fā)現(xiàn)時(shí) zorder，zorder越大，它所在位置就越上面，也就是有覆蓋效果（我猜測(cè)），然后我一開始是寫 2 的，按下去之后沒有反應(yīng)，改成 1 才行

8.添加對(duì)應(yīng)的函數(shù)

void HelloWorld::menuCallBackStart(CCObject* pSender)
{
    //wait for next time
}
void HelloWorld::menuCallBackClose(CCObject* pSender)
{
    exit(0);
}

我之后還把中央的label改成了自己作者了，這個(gè)就不貼代碼了

9.最后編譯運(yùn)行，效果圖