iPhone Coding Notes

~我的iPhone程式筆記~

Hello! Cocos2d!


終於要開始寫程式了。在開始之前,請先確認下列的軟體已安裝完成,才能跟著文章一步步前進喔。

1.安裝Xcode:

在一般情況下,剛買來(或剛灌好)的mac電腦裡是不含Xcode的。請拿出您的系統安裝光碟,開啟之後找到option install的資料夾,裡面就含有Xcode的安裝程式,只要點兩下照著做就可以了。安裝好後,Xcode會被放在「硬碟 -> Developer -> Applications」的資料夾。

2.安裝iPhone SDK:

有了Xcode後,接下來請到iPhone Dev Center註冊並下載iPhone SDK。註冊是免費的,在網頁右上方有個Register點進去照著指示填寫資料就行了。過程中會詢問您是否已有Apple ID(就是逛AppStore用的那個),如果您已經有Apple ID了,而且您常用這個ID在AppStore上買東西,那麼請不要使用這個ID做為iPhone Dev Center的帳號。註冊指示下方也有提醒,因為系統帳號管理有些bug,如果一個Apple ID同時用來購買AppStore上的東西,又作為iPhone Dev Center的帳號,會造成一些無法預期的問題。這個,很多先賢先烈已經發生過了,請不要鐵齒,乖乖的再申請一個帳號吧!另外,過程中遇到要填資料的部份,請以英文填寫,不然到時發生什麼奇怪的事,真的會欲哭無淚。

註冊完成後,就可以下載iPhone SDK了。在iPhone Dev Center首頁下方就可以下載iPhone SDK相關檔案。目前最新的SDK版本為3.1.2,另外10.5和10.6所要下載的SDK版本也不一樣,請留意。這個SDK,老實說檔案還真給他有點大,1~2G應該是跑不掉,下載完成後點兩下照著指示就可以安裝完成。

3.安裝cocos2d:

最後一個步驟是要安裝cocos2d這個函式庫。目前最新的穩定版為0.8.2,可以到這裡下載。下載完解壓縮後,開啟終端機,切換到cocos2d-iphone-0.8.2的目錄下輸入:

./install_template.sh

這樣cocos2d就安裝完成了(剛剛下載的檔案可以丟掉沒關係),接下來要開始寫程式了!

首先打開Xcode,並在上方選單列中選擇「File -> New Project」。

接下來會出現一個選擇模版的視窗,您可以看到這個模版分為兩大類,上面iPhone OS是專門給iPhone程式開發用的模版,下方MAC OS X的分類則是開發MAC OS軟體所使用的模版。在這次的範例中,我們要選擇的是iPhone OS分類下的「cocos2d-0.8.2-application」這個模版。(如果沒有看到,代表剛剛cocos2d安裝上可能出了問題,趕快檢查一下吧)

緊接著,為這個專案取個名字,本次範例以"HelloCocos2d"作為專案名稱。最後找個適當的地方儲存這個專案,儲存好後便會看到Xcode攢寫程式的主要視窗。

基本上,到目前這個階段程式就可以執行了。先到視窗左上方的下拉選單,在Active SDK的下方選擇「iPhone Simulator 3.1.2」,再點選視窗上方「Build and Run」的綠色按鍵執行這個程式…

如果您的設定沒有問題,會先看到一個大大的iPhone模擬器跑出來,接著螢幕會出現程式的啟動畫面(預設是黃色的cocos2d主題),最後iPhone模擬器旋轉90度,並出現「Hello World」的字樣。

然後呢?這樣就寫完了嗎?

當然還沒呀!文章標題是「Hello! Cocos2d!」,我們得把iPhone模擬器上顯示的字改成和標題一樣才行。

基本上要改字是件很簡單的事,但因為從0.8.1之後,cocos2d這個預設模版的範例對初學者來說可能不是那麼容易看懂,所以在這裡我們要對這個程式動些小手術,方便講解與學習。

結束剛剛啟動的iPhone模擬器(cmd+Q)回到Xcode的主視窗。在左邊的欄位找到Classes這個資料夾,點選裡面HelloWorldScene.h這個檔案,這時視窗右下方的編輯視窗便會出現這個檔案的內容,把#import “cocos2d.h"下方的文字全部刪除,並改成下列程式碼:

@interface HelloWorldScene : Scene {

}

@end

@interface HelloWorldLayer : Layer {

}

@end

如果您對之前Objective-C的介紹還有印象的話,@interface通常會放在.h檔裡,用來宣告物件類別所包含的變數與函式方法。上述程式碼中,我們宣告了兩個類別別:HelloWorldScene和HelloWorldLayer。

接下來我們要在.m檔中把上述兩個類別的內容完成。

到左邊欄位中Classes資料夾下選擇HelloWorldScene.m這個檔案,把import “HelloWorldScene.h"之後的程式碼刪除,並加入下列程式:

@implementation HelloWorldScene

-(id) init {

self = [super init];

if(self) {

HelloWorldLayer *layer = [HelloWorldLayer node];

[self addChild:layer];

}

return self;

}

- (void) dealloc{

[super dealloc];

}

@end

@implementation HelloWorldLayer

- (id)init {

self = [super init];

if (self) {

Label *helloLabel = [Label labelWithString:@"Hello! Cocos2d!" fontName:@"Marker felt" fontSize:60];

[helloLabel setPosition:ccp(240, 160)];

[self addChild:helloLabel];

}

return self;

}

- (void)dealloc {

[super dealloc];

}

@end

OK了嗎?現在剩下最後一個步驟,到左邊欄位Classes資料夾下找到HelloCocos2dAppDelegate.m這個檔案,找到第54行

[[Director sharedDirector] runWithScene: [HelloWorld Scene]];

這行程式碼,將其修改為

[[Director sharedDirector] runWithScene: [HelloWorldScene node]];

大功告成,現在按下視窗上方「Build and Run」的按鈕…「Hello! Cocos2d!」

我們的第一個iPhone程式就暫時寫到這邊,下篇文章我們將進一步了解整個程式的流程架構,以及「Hello! Cocos2d!」到底做了哪些事情。

About these ads

2 responses to “Hello! Cocos2d!

  1. Nikker 2010/06/08 at 08:18:50

    你好,
    我想請問,在一般專案中,可以使用cocos2d嗎?(即在創建專案的時候沒有選擇cocos2d-application)

    • bonjouryentinglai 2010/06/08 at 10:18:18

      原則上是可以的,只要您知道怎麼把cocos2d library拉進您的專案做連結即可。
      (這部份小弟就不太熟了~)

發表迴響

在下方填入你的資料或按右方圖示以社群網站登入:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / 變更 )

Twitter picture

You are commenting using your Twitter account. Log Out / 變更 )

Facebook照片

You are commenting using your Facebook account. Log Out / 變更 )

Google+ photo

You are commenting using your Google+ account. Log Out / 變更 )

連結到 %s

關注

Get every new post delivered to your Inbox.

%d 位部落客按了讚: