免責申明（必讀！）：本博客提供的所有教程的翻譯原稿均來自于互聯(lián)網(wǎng)，僅供學習交流之用，切勿進行商業(yè)傳播。同時，轉(zhuǎn)載時不要移除本申明。如產(chǎn)生任何糾紛，均與本博客所有人、發(fā)表該翻譯稿之人無任何關(guān)系。謝謝合作！

　　原文鏈接地址：http://www.raywenderlich.com/2560/how-to-create-a-mole-whacking-game-with-cocos2d-part-1

教程截圖：

　　在iOS Programming 101課程中，我的一個學生提議，讓我寫一個教程，關(guān)于如何使用cocos2d來制作一個打地鼠的游戲。?

　　我認為這是一個非常好的主意，原因有三：

目前，我的博客上有許多關(guān)于cocos2d的教程了，但是，卻沒有一個教程把制作一個游戲相關(guān)的所有細節(jié)都放在一起來開發(fā)一個游戲。因此，這個教程應運而生了。

這是一個非常好的機會來介紹一個新的話題：如何制作一個游戲，讓它同時在iphone、ipad和支持高清（retina）顯示的iphone上面運行。

當然，最重要的原因是--打地鼠本來就很有趣！

　　這個教程建立在下列教程的基礎之上：

• 如何使用cocos2d來制作一個簡單的iphone游戲
• 如何在cocos2d里面使用動畫和spritesheet
• 在cocos2d里面如何使用Texture Packer和像素格式來優(yōu)化spritesheet?
• 在cocos2d里面如何拖拽精靈

　　如果你還沒有閱讀上面這些教程，我強烈建議你先讀一讀。

　　這是一個兩部分的教程。在第一部分中，我們將會創(chuàng)建基本的游戲框架--有一些可愛的地鼠從洞里面鉆出來。我們將會花費大量的時候來討論如何組織圖片資源和坐標計算，以便于你的游戲能夠同時運行在iPhone３GS、ipad和高清顯示的iphone（其實是就是iphone４）上面，同時還要保證游戲性能！

規(guī)劃圖片資源: 總覽

　　因為，我們想讓這個應用能夠同時運行在iphone、retina-display　iphone和ipad上面，所以，我們需要花點時間來仔細考慮一下，如何制作圖片，主要是圖片的尺寸！

　　為了理解到底多大的尺寸合適，首先，我們要先討論下面三個主題：

• Retina Display and UIKit
• Retina Display and Cocos2D
• iPad, iPhone, and Aspect Ratios

Retina Display and UIKit

　　普通的iphone和支持高清顯示的iphone之間的差別就是支持高清顯示的iphone能夠顯示２倍的像素。因此（在landscape模式下），普通的iphone顯示４８０×３２０個像素，而支持高清的iphone則可以顯示９６０×６４０個像素。

　　“但是，請等一下”，你可能會問，“如果顯示２倍數(shù)量的像素，那么不會破壞那些已經(jīng)寫好的假設屏幕大小只有４８０×３２０的應用程序嗎？”　沒錯，特別是當你使用UIKit編程的時候，通常都是硬編碼frame的大小。但是，如果你在UIKit里面指定frame大小的時候，實際的單位是點，而不是像素。

　　在一個普通的iphone上面（不支持retina　display），一個點就等于一個像素。但是，在支持retina的iphone上面，一個點等于２個像素。因此，當你指定（１０，１０），在普通的iphone上面也是（１０，１０），而在支持retina的iphone上面，則是（２０，２０），因此，那會是同樣的相對偏移量。（因為，像素加倍了，相對于圖片來說，相對偏移量相等）。

　　當你使用apple的控件或者Core　Graphics，Apple已經(jīng)寫了一些代碼來確保在Retina顯示的時候沒有問題。（因為你寫代碼指定大小都是point為單位）

　　唯一的需要注意的就是使用圖片的時候。比如你在一個iphone程序中使用了一張２００×２００的圖片，如果你什么也不做，那么retina顯示會把這張圖的尺寸放大２倍--那樣會很難看，如下圖所示，會模糊。

　　因此，你所需要做的就是為所有的圖片提供兩種版本，一種普清的，一種高清的。如果在高清圖片名字后面增加一個@2x后綴（比如sample@2x.png），那么不管什么時候，你只要調(diào)用［UIImage imageNamed:...]或者一些更簡單的api，當程序編譯到支持高清設備的時候，就會自動加載后綴為@2x的圖片。

　　因此，制作一個支持Retina顯示的UIKit程序是非常容易的，只需要為每一張普清圖片同時提供一個高清版本（２倍像素），并且指定為@2x后綴即可。

　　那么cocos2d里面該如何做呢？

Retina Display and Cocos2D

　　告訴你們一個好消息--最新版本的cocos2d完全支持retina顯示，而且使用這個功能只需要下列１-２-３步：

調(diào)用CCDirector的函數(shù)enableRetinaDisplay來開啟retina顯示支持。如果你使用cocos2d模板，那么只需要把app　delegate里面對這句函數(shù)調(diào)用的注釋去掉即可！

往你的程序中添加２倍大小的精靈圖片，但是，這里命名不是增加@2x后綴，而是使用-hd（如：sample-hd.png)。當你加載精靈的時候，使用不帶-hd后綴的圖片名字，當cocos2d被部署到支持retina顯示的設備上時，就會自動加載高清的圖片。

當你在cocos2d里面設置精靈坐標的時候，使用的是點，而不是像素。注意：有些api使用的是像素，這些方法中都包含pixel字樣，比如position和positionInPixel。InPixels;

　　因此，你只需要讓美工提供給你高清格式的圖片就行了，你可以很容易地使用軟件把這些高清圖片變得普清圖片。比如TexturePacker就可以做這樣的事。

　　你可能會奇怪，為什么需要準備兩種不同格式的圖片--為什么不每次都加載高清的圖片，然后當需要普清圖片的時候，用程序來縮放？好吧，因為把紋理（texture）加載到內(nèi)存里面是非常消耗內(nèi)存的操作，如果某個程序被安裝在不支持高清顯示的設備上面（比如IPOD2），那么你就會占用兩倍大小的內(nèi)存，當然是相比于只加載普清的圖片的程序。（因為高清圖片像素個數(shù)多一倍，所以必須消耗的內(nèi)存要大。正確的做法就是前面說的，提供兩套圖片。）

　　不用擔心，你沒有必要在photoshop里面不停地縮放圖片的尺寸。TexturePaker里面有一個非常好的功能，可以很容易地通過高清圖片得到對應的普清圖片，這種方法在后面的教程中會講到。

iPad, iPhone, and Aspect Ratio

　　好，現(xiàn)在處理iphone上面的高清和普清顯示非常簡單了（準備兩套圖片），但是，iPad呢？該怎么做呢？

　　呃，要想編寫一個游戲，讓它同時能夠在iphone和ipad上面運行似乎是一件非常煩人的事--因為設備的縱橫比（aspect ratio)不一樣！

　　iphone支持480*320或者960*640---因此是1.5的縱橫比。然后，iPad是768*1024的--縱橫比等于1.33.

　　這意味著，如果你有一張圖片，能夠完全覆蓋iPad的背景（768*1024），如果你也想在iPhone里面繼續(xù)使用它。那恐怕不會匹配那么好。比如，你把它縮小，讓寬度等于iphone的寬度（通過乘以0.9375）：你會得到720*960，因此，還是會有一部分圖像不能顯示！

　　這讓事情變得有點惱火了，因為，不只是背景圖片的問題，因為縱橫比的不同，原先設置節(jié)點使用的坐標就不能夠再使用了。

　　目前有一些方法可以解決這個問題，下面列舉了一些我看過的、聽過的和使用過的（如果你們有更好的方法，可以留言）：

• 考慮一個“可玩區(qū)域”，這個區(qū)域的大小等于640*960，同時把它放置在iPad的屏幕中間。這會使得游戲區(qū)域外面有一些空白--但是，你還可以放置一張位置不動、顏色相同的背景圖片，那么玩家在玩游戲的時候就很難發(fā)現(xiàn)了。這樣會使你很容易地在不同的設備之間使用相同的坐標值，并且還可以重用圖片資源。這個方法也是我們這個教程里所使用的方法。
• 你可以使你的iPad的程序的縱橫比與iPhone的縱橫比一樣，在iPad屏幕的邊界留出42個像素，把“主要內(nèi)容”放置在685*1024的范圍中。如果，你可以把你的應用中的內(nèi)容放置在684*1024的“盒子”中，那么你就可以為每一個設備使用縮放圖片了。
• 你可以為iPhone、iPad和Retina display的iPhone提供不同的圖片和坐標值。這樣的靈活性是最大的，但是，會產(chǎn)生更大的二進制程序文件，并且不同的設備上面的對象位置都需要重新計算。

　　另一個原因，cocos2d目前對iPad的支持并不是很友好。只是可以自動加載后綴為“-hd”的圖片，轉(zhuǎn)換坐標的工作還是得由你來做。

規(guī)劃圖片資源：結(jié)論

　　好，基于上面的討論，下面是這篇教程的圖片資源規(guī)劃：

• 圖片被設計成一個960*640的“可玩區(qū)域”大小，在高清的iphone上面就是全屏的，在iPad上面就會居中顯示。
• 高清圖片可以通過TexturePacker轉(zhuǎn)換成普清的，并且生成相應的spritesheet。
• 高清的圖片將以“-hd”作為后綴，而普清的圖片則沒有。cocos2d會根據(jù)當前是否支持高清顯示而加載相應的圖片。
• 背景是一個特例，因為它總是需要全屏。背景將會做成1024*768的大小（因為iPad屏幕的大小是1024*768）。當這張圖片用作iPhone上面的時候，會有一部分圖片會超過屏幕邊界，但是，在這個教程中，并沒有關(guān)系。（后面將會看到，背景顏色很單一)
• iPad版本版本將會包含一些代碼，用來加載“-HD”后綴的圖片，轉(zhuǎn)換坐標并設置到“可玩區(qū)域”內(nèi)，使用合適的字體大小等。

　　首先，下載這篇教程的圖片資源，解壓，然后看看里面有什么：

• 在“foreground”文件夾中，前景大小為1024*768（也就是iPad的大小），但是，它實際上被劃分為兩個部分：上半部和下半部。因為我們將在這兩個部分當中放置三個“地鼠洞“，這樣就會看起來，地鼠真的是從地底下鉆出來的。
• 在”background“文件夾中，iPad的縱橫比是1.33，所以一半是512*384.這是因為，背景實際上是看不到的，只有通過3個地鼠洞才可以看到背景。這么小的范圍，完全沒有必要加載一張1024*1024的圖片。相反，我們加載一張小圖片，然后放大。
• 在"sprites”文件夾中，所有的精靈都被設置成可以放到960*640的“可玩區(qū)域”內(nèi)。注意，還有一個地鼠圖片，二個地鼠動畫（一個笑的動畫，一個被打中時的動畫）。

　　好了，有足夠的背景信息了--是時候開始動手了！、

Getting Started

　　打開XCode，選擇“File\New Project...",然后選擇“User Templates\cocos2d\cocos2d Application”,再點擊”Choose...“。把工程命名為WhackAMole，單擊Save。

　　接下來，把你剛剛下載下來的圖片資源文件夾全部拷到工程目錄下面。它的位置應該是Classes文件夾的兄弟，如下圖所示：

　　接下來，確保你已經(jīng)安裝了TexturePacker。如果你還不知道怎么使用它，可以查看譯者翻譯的另一篇教程。

　　你可以打開TexturePacker工具，并為這個項目創(chuàng)建所有的sprite sheet。你也可以使用TexturePacker的命令行工具，它可以和XCode集成，并且處理起來更加高效！

　　右擊Resources，選擇”Add\New File...“，選擇Mac OS X\Other\Shell Script，再點Next。取名為PackTextures.sh，然后點Finish。

　　然后把PackTextures.sh里面的內(nèi)容替換成下面的代碼：

#!/bin/sh
TP="/usr/local/bin/TexturePacker"
if [ "${ACTION}"="clean" ]
then
echo "cleaning..."
rm resources/background*
rm resources/foreground*
rm resources/sprites*
else
echo "building..."
${TP} --smart-update \
--format cocos2d \
--data resources/background-hd.plist \
--sheet resources/background-hd.pvr.ccz \
--dither-fs \
--opt RGB565 \
Art/background/*.jpg
${TP} --smart-update \
--format cocos2d \
--data resources/background.plist \
--sheet resources/background.pvr.ccz \
--dither-fs \
--scale 0.5 \
--opt RGB565 \
Art/background/*.jpg
${TP} --smart-update \
--format cocos2d \
--data resources/foreground-hd.plist \
--sheet resources/foreground-hd.pvr.ccz \
--dither-fs-alpha \
--opt RGBA4444 \
Art/foreground/*.jpg
${TP} --smart-update \
--format cocos2d \
--data resources/foreground.plist \
--sheet resources/foreground.pvr.ccz \
--dither-fs-alpha \
--scale 0.5 \
--opt RGBA4444 \
Art/foreground/*.jpg
${TP} --smart-update \
--format cocos2d \
--data resources/sprites-hd.plist \
--sheet resources/sprites-hd.pvr.ccz \
--dither-fs-alpha \
--opt RGBA4444 \
Art/sprites/*.jpg
${TP} --smart-update \
--format cocos2d \
--data resources/sprites.plist \
--sheet resources/sprites.pvr.ccz \
--dither-fs-alpha \
--scale 0.5 \
--opt RGBA4444 \
Art/sprites/*.jpg
fi
exit 0

?

　　這個腳本運行TexturePacker來為背景圖片、前景圖片和精靈圖片創(chuàng)建相應的精靈表單（sprite sheet）--同時包含高清的和普清的。

　　注意，每一個圖片都被保存為pvr.cca格式，因為，這是一種磁盤占用空間小，并且內(nèi)存消耗也少的圖片格式。當然，像素格式和抖動選項也被設置了，這是一個折中，綜合考慮內(nèi)存消耗和圖片顯示質(zhì)量。

　　如果你對TexturePacker的這些選項的功能不是很清楚，你可以打開終端（Terminal)，然后輸入TexturePacker -help，那么就會有完整的選項功能列表。

　　接下來，你需要做一些設置，在你的工程每次編譯的時候，可以運行這個shell腳本。右鍵點擊Targets，選擇“Add\New Target...",再選擇"External Target”（注意不要選擇Shell Script Target!)，然后點擊Next。把這個Target命名為TexturePacker并點擊Finish。

　　然后右鍵點擊剛剛建立的這個Target，修改它的設置，如下圖所示：

　　最后一步，就是為你的程序設置target依賴。雙擊項目Target，然后找到General標簽，點下面的+號，再從彈出的列表中選擇TexturePacker Target，并點擊Add Target。

　　編譯你的工程，如果輸出結(jié)果如下圖所示，那么就證明你的配置OK。（注意，上面的這些全是針對XCode3所設置的，XCode4大同小異，只是界面不一樣了，原理不變）

　　接下來，把剛剛生成的精靈表單和相應的屬性列表增加到項目中。右擊Resources，選擇“Add\Existing Files...”，然后選擇background,foreground和sprites文件（總共有12個文件），再點Add.如果做完后，那么看起來會是下圖這個樣子:

　　如果你愿意，你可以雙擊任何一個.pvr.ccz文件，打開看看，里面到底有什么。你就會發(fā)現(xiàn)TexturePacker有多么方便了！

設置背景

　　接下來，HelloWorldScene.m文件并找到init方法。刪掉自動生成的那4行創(chuàng)建一個label的代碼。同時，用下面的代碼替換掉：

// Determine names of sprite sheets and plists to load
NSString *bgSheet =@"background.pvr.ccz";
NSString *bgPlist =@"background.plist";
NSString *fgSheet =@"foreground.pvr.ccz";
NSString *fgPlist =@"foreground.plist";
NSString *sSheet =@"sprites.pvr.ccz";
NSString *sPlist =@"sprites.plist";
if (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad) {
bgSheet =@"background-hd.pvr.ccz";
bgPlist =@"background-hd.plist";
fgSheet =@"foreground-hd.pvr.ccz";
fgPlist =@"foreground-hd.plist";
sSheet =@"sprites-hd.pvr.ccz";
sPlist =@"sprites-hd.plist";
}

// Load background and foreground
[[CCSpriteFrameCache sharedSpriteFrameCache] addSpriteFramesWithFile:bgPlist];
[[CCSpriteFrameCache sharedSpriteFrameCache] addSpriteFramesWithFile:fgPlist];

// Add background
CGSize winSize = [CCDirector sharedDirector].winSize;
CCSprite *dirt = [CCSprite spriteWithSpriteFrameName:@"bg_dirt.jpg"];
dirt.scale =2.0;
dirt.position = ccp(winSize.width/2, winSize.height/2);
[self addChild:dirt z:-2];

// Add foreground
CCSprite *lower = [CCSprite spriteWithSpriteFrameName:@"grass_lower.jpg"];
lower.anchorPoint = ccp(0.5, 1);
lower.position = ccp(winSize.width/2, winSize.height/2);
[self addChild:lower z:1];

CCSprite *upper = [CCSprite spriteWithSpriteFrameName:@"grass_upper.jpg"];
upper.anchorPoint = ccp(0.5, 0);
upper.position = ccp(winSize.width/2, winSize.height/2);
[self addChild:upper z:-1];

// Add more here later...

?

　　好，讓我們一個一個來講解，因為，這里面有許多新的東西。

　　1.決定加載的精靈表單和plist文件的名字。這個部分，把TexturePacker生成的精靈表單和plist文件，按照某種方式加載進來了。注意，在iPhone上面，cocos2d會自動地加載“-HD”和不帶“HD”的版本，具體取決于是否激活Retina 顯示。然后，在iPad上面，它并不會加載"-hd"版本，所以你必須手動告訴它加載，因此，上面我們判斷，如果是iPad，那么就加載帶"-hd"版本的資源。

　　2.加載背景和前景。接下來就是把背景、前景還有精靈都加載到精靈幀緩沖（sprite frame cache）中，以便后面可以使用。注意，目前精靈并沒有加載到CCSpriteBatchNode中。

????? 3.添加背景。背景圖片作為當前層的一個孩子被加進去。（Z=-2的話，就可以使任何對象都在它上面，除非其它對象的Z小于-2）。接下來，把這張圖片放大兩倍，因為，之前，我們?yōu)榱斯?jié)約內(nèi)存，只使用了一半大小的圖片。之后，再把圖片放置到屏幕中間。

　　4.前加前景。前景是當作兩個部分加上去的。這里用了一種非常簡單的設置精靈圖片坐標點的方式，通過設置精靈的錨點為圖片的中點，或者底部，或者頂部。通過這種方式，假如你要把一張圖片的左下角設置為屏幕的左下角，你只需要先把圖片的錨點設置為（0，0），然后設置position為0，0就好了。非常方便！而且，這個坐標值，在所有的設備上都通用。注意，背景部分超出屏幕之外了，但是，這并沒有關(guān)系，因為用戶看不到。還要注意的是，圖片增加的時候，使用了不同的Z值，最后面的圖片使用最小的Z值。

　　編譯并運行，你會看到如下的輸出。你可以通過模擬器測試，也可以通過真機測試，看看效果到底如何^^。

　　如果你嘗試在支持高清的設備上運行，你會注意到，圖像有模糊，似乎還是使用普清的資源。

　　這是因為，我們還有一步?jīng)]有做完:還需要調(diào)用CCDirector的enableRetinaDisplay方法能激活高清顯示。

　　為了實現(xiàn)這個目的，打開WhackAMoleAppDelegate.m，然后在applicationDidFinishLaunching方法里面，刪除那三句注釋：

if( ! [director enableRetinaDisplay:YES] )
CCLOG(@"Retina Display Not supported");

?

　　編譯并運行，現(xiàn)在，再嘗試使用支持高清的設備吧，這時就會加載高清圖片資源了。

放置地鼠

　　對于這個游戲來說，你將會在場景中添加3只地鼠--每個洞一個地鼠。地鼠會躲在草的下面，但是，會突然從某個洞里冒出來，這樣你就可以打它了。

　　首先，讓我們?yōu)槊總€洞的下面添加一只地鼠。我們會先讓它們在所有的圖片上面，這樣，可以確保位置對了，然后通過修改Z值，就能夠把它們隱藏到草地后面去了。

　　打開HelloWorldScene.h，然后增加一個數(shù)組來保存當前關(guān)卡的地鼠，如下所示：

// Inside @interface HelloWorld
NSMutableArray *moles;

　　通過保存地鼠的數(shù)組，我們可以很容易地遍歷每一只地鼠。

　　接下來，在init方法中添加一些代碼來放置地鼠（添加位置位于?“Add more here later…”注釋后面），如下所示：

// Load sprites
CCSpriteBatchNode *spriteNode = [CCSpriteBatchNode batchNodeWithFile:sSheet];
[self addChild:spriteNode z:999];
[[CCSpriteFrameCache sharedSpriteFrameCache] addSpriteFramesWithFile:sPlist];

moles = [[NSMutableArray alloc] init];

CCSprite *mole1 = [CCSprite spriteWithSpriteFrameName:@"mole_1.jpg"];
mole1.position = [self convertPoint:ccp(85, 85)];
[spriteNode addChild:mole1];
[moles addObject:mole1];

CCSprite *mole2 = [CCSprite spriteWithSpriteFrameName:@"mole_1.jpg"];
mole2.position = [self convertPoint:ccp(240, 85)];
[spriteNode addChild:mole2];
[moles addObject:mole2];

CCSprite *mole3 = [CCSprite spriteWithSpriteFrameName:@"mole_1.jpg"];
mole3.position = [self convertPoint:ccp(395, 85)];
[spriteNode addChild:mole3];
[moles addObject:mole3];

　　首先，為精靈創(chuàng)建一個CCSpriteBatchNode，這樣就可以更加高效地渲染這三只地鼠了。（每次只需要一個OpenGL call),并把batchNode當作當前層的一個孩子加進去。注意，Z值被臨時設置成999，因此，地鼠就會顯示在所有的圖片之前，那樣我們就可以判斷地鼠位置是否正確。

　　然后從精靈幀緩沖中加載所有的精靈。接著，為每一個地鼠創(chuàng)建一個精靈，把它們放置在場景中，同時添加到數(shù)組里面。注意，每個地鼠的坐標是在一個480*320的“可玩區(qū)域”內(nèi)（iphone屏幕的大小）。對于iPad來說，這些點需要做一些轉(zhuǎn)換，因此，我們定義了一個輔助函數(shù)convertPoint。接下來，在Init方法的上面加入下列代碼：

- (CGPoint)convertPoint:(CGPoint)point {
if (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad) {
return ccp(32+ point.x*2, 64+ point.y*2);
} else {
return point;
}
}

　　這個方法把“可玩區(qū)域”內(nèi)的一個點轉(zhuǎn)換成合適的iPad屏幕上面的點。記住：

• 我們在iPad上面使用的是高清的圖像，所有的像素點都要加倍。
• 我們把960*640的區(qū)域居中放在1024*768的iPad屏幕上，因此，左右兩邊要留下32個像素的margin，上下兩邊要留下64個像素的margin。

　　因此， 這個方法只是做了一些簡單的數(shù)學計算，使得坐標在iPad上面不會出問題。

　　還有一件事---在忘記之前，我們需要做一些內(nèi)存清理操作，找到dealloc方法，添加下列代碼：

[moles release];
moles = nil;

?

　　編譯并運行，你將看到3只地鼠放置在正確的位置上了！你因此同時測試一下iPhone,Retina iPhone和iPad，確保每個設備上看起來都沒問題。

彈出地鼠

　現(xiàn)在，我們確定地鼠的位置沒有問題了，接下來，讓我們添加一些代碼，讓他們能夠從地下鉆出來吧！

　　第一件事，把Z值，從999改成0，這樣的話，地鼠就會在地底下了。

　　改完之后，在init方法的后面添加下面的代碼：

[self schedule:@selector(tryPopMoles:) interval:0.5];

　　如果之前你沒有見過這樣的用法，你可以調(diào)用其它的方法，比如schedelUpdate。但是，這個例子中，我們只想讓地鼠每隔0.5秒鉆出一個。

　　接下來，增加tryPopMoles方法：

- (void)tryPopMoles:(ccTime)dt {
for (CCSprite *mole in moles) {
if (arc4random() %3==0) {
if (mole.numberOfRunningActions ==0) {
[self popMole:mole];
}
}
}
}

?

　　這個方法會每隔0.5秒調(diào)用一次，每一次它都會循環(huán)判斷每一個地鼠，讓它有1/3的機會從洞里面鉆出來。但是，如果它已經(jīng)鉆出來，也就是運行的action的個數(shù)不等于0的話，那么也不會再鉆了。

最后，實現(xiàn)popMole：方法：

- (void) popMole:(CCSprite *)mole {
CCMoveBy *moveUp = [CCMoveBy actionWithDuration:0.2 position:ccp(0, mole.contentSize.height)]; // 1
CCEaseInOut *easeMoveUp = [CCEaseInOut actionWithAction:moveUp rate:3.0]; // 2
CCAction *easeMoveDown = [easeMoveUp reverse]; // 3
CCDelayTime *delay = [CCDelayTime actionWithDuration:0.5]; // 4

[mole runAction:[CCSequence actions:easeMoveUp, delay, easeMoveDown, nil]]; // 5
}

?

　　這個代碼，使用cocos2d的action來制作彈出洞的效果，先彈出來，然后暫停半秒，再鉆回去。讓我們一行一行地解釋：

創(chuàng)建一個action，讓地鼠沿著Y軸鉆洞來。因為，之前我們放置地鼠的位置是正確的，所以看起來，就像是從洞下面鉆出來一樣。

為了使得移動更加真實，上面的action用一個CCEaseInOut action包裝起來了。這會得鉆洞的動作在開始和結(jié)束的時候速度比較慢，看起來，就好像地鼠在加速和減速一樣。

創(chuàng)建一個action，使地鼠能夠鉆回來。這里通過調(diào)用action的reverse方法，能得到相反的action.

創(chuàng)建一個action，在地鼠鉆出來以后，能夠暫停1秒。

現(xiàn)在，action可以運行了。通過用CCSequence把這3個action包裝起來，那樣它們就可以按順序執(zhí)行了。

就這么多！編譯并運行代碼，你將會看到3只地鼠交替地鉆出洞來，cool吧？

何去何從?

　　本教程完整源代碼。

　　期待這個教程的后續(xù)吧，在那個教程里，我們會添加很酷的動畫，同時會添加一些游戲邏輯，使得你可以打地鼠并且得分。當然，還有非常好聽的音樂。

　　譯者的話：翻譯如果有語法錯誤還忘指出，最近時間比較緊，校對工作沒時間仔細做了，歡迎大家不吝指出！

?

著作權(quán)聲明：本文由http://www.cnblogs.com/andyque翻譯，歡迎轉(zhuǎn)載分享。請尊重作者勞動，轉(zhuǎn)載時保留該聲明和作者博客鏈接，謝謝！

總結(jié)

以上是生活随笔為你收集整理的（译）如何使用cocos2d来制作一个打地鼠的游戏：第一部分的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。