iPhone游戲開(kāi)發(fā) 使用Cocos2d框架開(kāi)發(fā)教程是本文要介紹的內(nèi)容，移動(dòng)設(shè)備正改變我們工作和與他人互動(dòng)的關(guān)系。新一輪革命正在我們身上發(fā)生，人們開(kāi)始通過(guò)移動(dòng)設(shè)備消費(fèi)更多的數(shù)據(jù)內(nèi)容。iPhone應(yīng)用商店成為手機(jī)應(yīng)用成功和流行的縮影，其中游戲是最熱門的類別。在本篇文章中，我將展示如何用Cocos2d框架來(lái)制作iPhone游戲。

iphone游戲

Cocos2d框架

Cocos2d是用于構(gòu)建iPhone游戲的開(kāi)源框架，是基于iPhone核心SDK之上架構(gòu)而成，提供可加速iPhone游戲開(kāi)發(fā)的易用API。

下載和安裝Cocos2d框架和模板

要使用Cocos2d框架的強(qiáng)大功能，***步是下載和安裝與框架相關(guān)的框架和模板。（游戲邦注：原文提供了框架和模板的下載地址。）

了解框架的基礎(chǔ)

在開(kāi)始制作***iPhone游戲前，建議先熟悉下Cocos2d框架的基礎(chǔ)，包括以下四項(xiàng)內(nèi)容：

場(chǎng)景。場(chǎng)景這個(gè)節(jié)點(diǎn)很特殊，它是所有節(jié)點(diǎn)的基礎(chǔ)。場(chǎng)景的目的在于呈現(xiàn)出游戲的可操作部分和展現(xiàn)游戲場(chǎng)景（游戲邦注：如游戲結(jié)束、主頁(yè)面和高分排行榜等）。

層次。層次呈現(xiàn)出的是玩游戲的具體區(qū)域。Cocos2d中的層次與Photoshop的層次作用類似。這意味著某個(gè)場(chǎng)景可以由多個(gè)層次構(gòu)成。一個(gè)層次承載背景畫面，另一個(gè)層次便是游戲動(dòng)作發(fā)生之初。

界面。界面指得是那些賦予游戲靈魂的事物。比如，如果你制作太空游戲，你的飛船和敵人就是界面。用于深化用戶游戲體驗(yàn)的每個(gè)角色都可以當(dāng)成是界面。

制作***Cocos2d項(xiàng)目

打開(kāi)Xcode，創(chuàng)建新項(xiàng)目。如圖1所示，從項(xiàng)目模板菜單中選擇Cocos2d項(xiàng)目。

 
圖1：Cocos2d template for Xcode

點(diǎn)擊“選擇”進(jìn)入下個(gè)場(chǎng)景。輸入MyFirstCocos2dProject作為項(xiàng)目名稱，然后點(diǎn)擊“保存”。隨后，系統(tǒng)便會(huì)通過(guò)默認(rèn)模板來(lái)創(chuàng)建Cocos2d項(xiàng)目。這篇文章中所述的是Cocos2d框架的0.99版本，默認(rèn)搜索的是SDK 4.0。如果你安裝過(guò)***版的SDK，你會(huì)收到如圖2中所示的“基礎(chǔ)SDK丟失”信息。

 
圖2：Cocos2d project template base SDK missing

你所要做的是告訴Cocos2d框架我們正在使用的是更新版本的SDK。要達(dá)成此目標(biāo)，點(diǎn)擊“項(xiàng)目”標(biāo)簽下的“編輯項(xiàng)目設(shè)置”，然后如圖3所示指定SDK版本。

圖3：Selecting the installed SDK for iOS device

正如你從以上截屏中看到的那樣，iOS SDK 4.0丟失，但我們可以選擇iOS SDK 4.1。選擇正確的SDK后，使用“指令B”構(gòu)建整個(gè)項(xiàng)目。項(xiàng)目中不能有錯(cuò)誤。實(shí)現(xiàn)上述目標(biāo)后，你可以用“指令R”來(lái)運(yùn)行應(yīng)用。圖4顯示應(yīng)用正在運(yùn)行中iPhone模擬器的樣式。

 
圖4：The default Cocos2d project template output

Cocos2d模板有基礎(chǔ)執(zhí)行程序，使得屏幕上顯示出“Hello World”的語(yǔ)句。每秒幀數(shù)(FPS)測(cè)量值顯示在屏幕左下方（游戲邦注：圖4中是60.0）。默認(rèn)模板是為了驗(yàn)證開(kāi)發(fā)者已正確安裝框架以及與框架相關(guān)的所有組件。下個(gè)部分我們將繼續(xù)深入挖掘Cocos2d框架。

開(kāi)始使用Cocos2d框架

默認(rèn)Cocos2d模板設(shè)定為橫向模式顯示，MyFirstCocos2dProjectAppDelegate.m文件中使用以下代碼就可以輕易做出改變：

[director setDeviceOrientation:kCCDeviceOrientationPortrait]; 

現(xiàn)在，如果你運(yùn)行應(yīng)用就會(huì)發(fā)現(xiàn)，顯示是縱向而不是橫向。接下來(lái)，我們要改變游戲的背景。我們已經(jīng)在項(xiàng)目的“資源”文件夾中加入文件Background3.png。資源文件夾存放所有應(yīng)用中使用的資源（游戲邦注：如圖片、聲音文件等）。以下面的代碼將背景圖片設(shè)置在靜態(tài)模式場(chǎng)景中：

+(id) scene  
{  
// ‘scene’ is an autorelease object.  
CCScene *scene = [CCScene node];  
 
// ‘layer’ is an autorelease object.  
HelloWorld *layer = [HelloWorld node];  
 
CCSprite *background = [CCSprite spriteWithFile:@"Background3.png"];  
 
[layer addChild:background];  
 
// add layer as a child to scene  
[scene addChild: layer];  
 
// return the scene  
return scene;  
} 

CCSprite類型包含spriteWithFile方法，輸入文件名作為參數(shù)。使用addChild方式將背景界面加入到層次中，得到圖5中顯示的效果。

圖5：Background sprite not positioned correctly

不幸的是，背景界面的位置不正確。我們需要為界面設(shè)置錨點(diǎn)，如圖6所示。

 
圖6：Background sprite positioned correctly

背景圖片適合尺寸為320 x 480的屏幕。如果你計(jì)劃讓設(shè)備的轉(zhuǎn)動(dòng)發(fā)揮作用，那么你需要有張適合480 x 320橫向模式的背景圖片。在下一節(jié)中，我們將為應(yīng)用添加界面。

添加界面

添加背景只是應(yīng)用設(shè)計(jì)的開(kāi)始，我們需要為游戲添加可操作的界面。我們將使用一張笑臉圖片作為我們的活動(dòng)界面。使用下列代碼可為應(yīng)用添加界面：

// on “init” you need to initialize your instance  
-(id) init  
{  
// always call “super” init  
// Apple recommends to re-assign “self” with the “super” return value  
if( (self=[super init] )) {  
 
// adding the sprite  
CCSprite *smiley = [CCSprite spriteWithFile:@"smiley.png"];  
smiley.position = ccp(100,100);  
[self addChild:smiley];  
 
}  
return self;  
} 

使用最初的方法，我們創(chuàng)建CCSprite實(shí)例呈現(xiàn)笑臉角色。首先將笑臉?lè)胖迷谶m當(dāng)位置（100，100），隨后添加到層中。如果你運(yùn)行應(yīng)用，你會(huì)發(fā)現(xiàn)笑臉看不見(jiàn)。原因在于笑臉位于背景層之后。為看到笑臉，我們將背景界面的Z軸值調(diào)為-1，將背景界面放置在笑臉界面之后，代碼如下：[layer addChild:background z:-1];

圖7顯示調(diào)整后的結(jié)果。

圖7：Smiley face sprite added to the game scene

在上述例子中，我們將笑臉?lè)胖迷谄聊簧蠒r(shí)使用的是硬代碼值。以下使用硬代碼值在屏幕上放置元素是因?yàn)閼?yīng)用將以iPhone協(xié)調(diào)系統(tǒng)為基礎(chǔ)。

如果你在iPad上運(yùn)行應(yīng)用，你會(huì)發(fā)現(xiàn)背景和界面的位置都有錯(cuò)誤。為了讓應(yīng)用在iPhone和iPad設(shè)備上的顯示效果相同，我們必須使用CGSize類別來(lái)深化當(dāng)前設(shè)備的寬度值和高度值。以下代碼顯示如何使用CGSize：

// on “init” you need to initialize your instance  
-(id) init  
{  
// always call “super” init  
// Apple recommends to re-assign “self” with the “super” return value  
if( (self=[super init] )) {  
 
CGSize windowSize = [[CCDirector sharedDirector] winSize];  
 
// adding the sprite  
CCSprite *smiley = [CCSprite spriteWithFile:@"smiley.png"];  
smiley.position = ccp(windowSize.width/2,windowSize.height/2);  
[self addChild:smiley];  
 
}  
 
return self;  
} 

在上述代碼中，我們使用CCDirector來(lái)恢復(fù)winSize實(shí)例。winSize是指當(dāng)前運(yùn)行的iOS設(shè)備的尺寸。這確保應(yīng)用正確地在設(shè)備上運(yùn)行。

現(xiàn)在，我們的笑臉還沒(méi)有任何移動(dòng)。在下節(jié)中，我們將介紹讓笑臉在屏幕中移動(dòng)的方法。

動(dòng)作和順序

Cocos2d使用動(dòng)作為CCNode對(duì)象中的界面或其他對(duì)象添加效果。Cocos2d框架有許多內(nèi)置動(dòng)作，這些動(dòng)作包括CCFadeTo、CCMoveTo和CCScaleBy等。以下代碼使用CCMoveTo動(dòng)作將笑臉移動(dòng)到屏幕上的特定位置：

// on “init” you need to initialize your instance  
-(id) init  
{  
// always call “super” init  
// Apple recommends to re-assign “self” with the “super” return value  
if( (self=[super init] )) {  
 
CGSize windowSize = [[CCDirector sharedDirector] winSize];  
 
// adding the sprite  
CCSprite *smiley = [CCSprite spriteWithFile:@"smiley.png"];  
smiley.position = ccp(windowSize.width/2,windowSize.height/2);  
[self addChild:smiley];  
 
// actions  
 
[smiley runAction:[CCMoveTo actionWithDuration:0.9 position:ccp(300,300)]];  
 
}  
 
return self;  
} 

在這個(gè)代碼中，我們使用runAction方法來(lái)在笑臉界面上執(zhí)行CCMoveTo動(dòng)作。CCMoveTo動(dòng)作方法使用actionWithDuration和位置參數(shù)。actionWithDuration是完成動(dòng)作所需要的時(shí)間。位置參數(shù)指的是界面的移動(dòng)地點(diǎn)。如果你運(yùn)行應(yīng)用，你會(huì)發(fā)現(xiàn)笑臉從原位置移動(dòng)到新位置上。

在你需要界面執(zhí)行諸多動(dòng)作的同時(shí)，便產(chǎn)生了情節(jié)。對(duì)于這些情節(jié)，你可以使用CCSpawn類型，確保這些動(dòng)作同時(shí)為界面所執(zhí)行。以下代碼便是CCSpawn在動(dòng)作中的應(yīng)用：

id moveAction = [CCMoveTo actionWithDuration:0.9 position:ccp(200,200)];  
id fadeOutAction = [CCFadeOut actionWithDuration:0.9];  
id callback = [CCCallFunc actionWithTarget:self selector:@selector(finishedAnimation)];  
 
[smiley runAction:[CCSequence actions:moveAction,fadeOutAction,callback,nil]];  
 
-(void) finishedAnimation  
{  
NSLog(@”animation has been finished!”);  
} 

在這個(gè)代碼中，你可以創(chuàng)建兩個(gè)獨(dú)立的動(dòng)作，CCMoveTo和CCFadeOut。這兩個(gè)動(dòng)作都會(huì)以參數(shù)的形式遞交給CCSpawn方法，使得笑臉CCSprite能夠同時(shí)移動(dòng)和淡出屏幕。

當(dāng)使用CCActions時(shí)，找到動(dòng)畫的完結(jié)點(diǎn)很有用。在這段情節(jié)中，我們可以使用CCSequence類別。CCSequence讓開(kāi)發(fā)者可以陸續(xù)進(jìn)行不同動(dòng)作，然后最終會(huì)有回收功能顯示動(dòng)畫已完成。以下代碼便是CCSequence：

-(void) finishedAnimation  
{  
int x = arc4random() % 320;  
int y = arc4random() % 480;  
 
id moveAction = [CCMoveTo actionWithDuration:0.9 position:ccp(x,y)];  
id callback = [CCCallFunc actionWithTarget:self selector:@selector(finishedAnimation)];  
 
[smiley runAction:[CCSequence actions:moveAction,callback,nil]];  
} 

這個(gè)代碼使用CCCallFunc類別創(chuàng)建出回收功能。一旦CCMoveTo和CCFadeOut兩個(gè)動(dòng)作均完成之后，回收功能就會(huì)被觸發(fā)。以排除漏洞模式運(yùn)行應(yīng)用，你會(huì)發(fā)現(xiàn)在動(dòng)畫完成后，顯示完成的日志信息動(dòng)畫會(huì)顯示在屏幕上。

我們可以使用回收功能來(lái)不斷重復(fù)動(dòng)畫，將界面移動(dòng)到屏幕上的任意位置。這可以通過(guò)finishedAnimation功能實(shí)現(xiàn)，以下便是代碼：

-(void) finishedAnimation  
{  
int x = arc4random() % 320;  
int y = arc4random() % 480;  
 
id moveAction = [CCMoveTo actionWithDuration:0.9 position:ccp(x,y)];  
id callback = [CCCallFunc actionWithTarget:self selector:@selector(finishedAnimation)];  
 
[smiley runAction:[CCSequence actions:moveAction,callback,nil]];  
} 

注意：上述代碼可輕易獨(dú)立成某個(gè)類別的方法，這會(huì)減少出現(xiàn)復(fù)制粘貼之類的錯(cuò)誤。但為了讓此文更為簡(jiǎn)潔，我已經(jīng)復(fù)制了代碼。

arc4random功能可用于隨機(jī)生成從0到n-1的數(shù)字。我們根據(jù)iPhone屏幕尺寸（游戲邦注：即320 x 480像素）來(lái)限定這個(gè)隨機(jī)數(shù)字。獲得的坐標(biāo)隨后將傳輸至CCMoveTo功能的位置參數(shù)。finishedAnimation也可以用作回收方法，使得動(dòng)畫在結(jié)束后不斷重復(fù)。運(yùn)行應(yīng)用，你會(huì)發(fā)現(xiàn)笑臉不斷從某個(gè)隨機(jī)位置移動(dòng)到另一個(gè)隨機(jī)位置。

觸屏的使用

我們的笑臉在屏幕上自由移動(dòng)，目前沒(méi)有方法讓它停下來(lái)。在本節(jié)中，我們將讓用戶可以通過(guò)接觸事件來(lái)控制笑臉。處理接觸事件的方法很多，為使設(shè)計(jì)簡(jiǎn)單我們使用CCTouchesBegin事件，這個(gè)事件在用戶接觸屏幕時(shí)觸發(fā)。在使用CCTouchesBegin事件之前，使用原始方法確保isTouchEnabled特性設(shè)定為“是”：

-(void) ccTouchesBegan:(NSSet *)touches withEvent:(UIEvent *)event  
{  
 
UITouch *touch = [touches anyObject];  
CGPoint location = [touch locationInView:[touch view]];  
location = [[CCDirector sharedDirector] convertToGL:location];  
} 

以上使用的ccTouchesBegan方法可獲得用戶接觸屏幕的坐標(biāo)。在ccTouchesBegan事件中，我們需要得知用戶是否接觸笑臉。我們通過(guò)使用好用的老式畢達(dá)哥拉斯原理來(lái)實(shí)現(xiàn)這個(gè)目標(biāo)。以下代碼顯示我們?nèi)绾尾煊X(jué)笑臉是否已被接觸：

-(void) ccTouchesBegan:(NSSet *)touches withEvent:(UIEvent *)event  
{  
 
UITouch *touch = [touches anyObject];  
CGPoint location = [touch locationInView:[touch view]];  
location = [[CCDirector sharedDirector] convertToGL:location];  
 
float distance = pow(smiley.position.x – location.x, 2) + pow(smiley.position.y – location.y, 2);  
distance = sqrt(distance);  
 
if(distance <= 50)  
{  
[smiley runAction:[CCScaleBy actionWithDuration:0.9 scale:2.0]];  
 
[self performSelector:@selector(removeSmileyFromLayer) withObject:nil afterDelay:1.2];  
 
}  
} 

在上述代碼中，我們可以設(shè)置笑臉和觸點(diǎn)間的最短距離。如果距離小于50像素，程序確實(shí)笑臉已被用戶觸及。隨后我們運(yùn)行CCScaleBy動(dòng)作，為笑臉增大，隨后使用傳統(tǒng)removeSmileyFromLayer方法將其從層中移除。

添加CCParticles

現(xiàn)在，當(dāng)用戶觸及笑臉時(shí)，它會(huì)增大隨后消失。我們可以使用Cocos2d的Particles框架使之表現(xiàn)得更為出色。Particles框架讓你可以通過(guò)數(shù)百個(gè)CCNode對(duì)象動(dòng)畫做出令人矚目的效果。所有對(duì)象協(xié)調(diào)配合，創(chuàng)造出特殊的效果。

我們將使用ParticleExplode效果，這會(huì)在用戶點(diǎn)擊笑臉后創(chuàng)造出爆炸性的效果。以下代碼顯示如何為游戲添加特殊效果。我們?cè)诒ㄖ惺褂孟嗤男δ槪@意味著一旦笑臉遭到點(diǎn)擊，便會(huì)產(chǎn)生出更小的笑臉。

if(distance <= 50)  
{  
CCParticleExplosion *explosion = [[CCParticleExplosion alloc] init];  
explosion.texture = [[CCTextureCache sharedTextureCache] addImage:@”smiley.png”];  
[explosion setDuration:2];  
[explosion setAutoRemoveOnFinish:YES];  
explosion.position = self.smiley.position;  
[self addChild:explosion];  
 
[self removeChild:self.smiley cleanup:YES];  
self.smiley = nil;  
} 

在上述代碼中，我們已將CCParticleExplosion效果初始化，這是Cocos2d框架中許多可用的CCParticles效果之一。粒子效果間隔時(shí)間設(shè)定為2秒，粒子對(duì)象設(shè)定為自動(dòng)移除。

效果顯示在圖8中。

圖8：CCParticleExplosion effect in action

我已經(jīng)在本文中為你簡(jiǎn)要介紹了Cocos2d框架的使用方法，幫助你入門開(kāi)發(fā)iPhone游戲。如果你想要探索蘋果iOS開(kāi)發(fā)環(huán)境，使用Cocos2d構(gòu)建一款簡(jiǎn)單的游戲可以使你積累一定的開(kāi)發(fā)經(jīng)驗(yàn)。

小結(jié)：iPhone游戲開(kāi)發(fā) 使用Cocos2d框架開(kāi)發(fā)教程的內(nèi)容介紹完了，希望本文對(duì)你有所幫助！