第二課：

 

初篇：

第一節課已經教會你如何使用Cocos2d應用模板創建一個新的工程。那麼首先讓我們新建一個Cocos2d-Application工程，將它命名爲「Lesson1」並把它保存到你喜歡的任意地方，然後運行它，確定它是否能夠顯示你所預期的「Hello World」。

在你運行程序時可能會看到一個漂亮的Cocos2d啓動畫面，並且當你按下「Home」按鍵退出

演示程序時，你會看到一個可愛的Cocos2d icon圖標，它們都源自於你項目資源(Resources)文件的「特殊命名圖片」。現在讓我們在Resources文件下找到它們，當你希望替換上你自己的圖片時，你可以隨時刪除它們。另外Resoures文件也是你增添放置背景圖片和精靈(角色移動)圖片的地方。

(如果你希望現在替換啓動畫面和icon圖標，你只需要找到同樣尺寸和格式的圖片，並將它們命名成「Default.png」和「Icon.png」覆蓋掉原有的圖片即可。)

下面讓我們增添一個額外的圖片作爲精靈，將圖片保存在你的項目Resources文件中，並將它重命名爲「seeker.png」。現在讓我們回到Xcode，查看你Xcode中的Resources文件，你會發現你找不到「seeker.png」圖片的蹤影，這是因爲Xcode不會自動將磁盤中的文件增添到你的項目中去。你需要將圖片文件拖拽到Xcode的項目Resources文件中，這時會彈出一個對話框，裏面有一些選項，你可以保持默認並且點擊增添按鈕。

在這節課中，我們將會使用到兩個精靈，但是爲了節約時間，就讓我們使用項目Resources文件中的「Icon.png」圖片作爲我的第二個精靈吧。

 

創建一個精靈：

現在展開項目中的Classes文件。你會看到裏面有4個文件，它們分別是：HelloWorldScene.h，HelloWorldScene.m，Lesson1AppDelegate.h 和Lesson1AppDelegate.m文件。這節課我們將會把所有的代碼寫入HelloWorldScene.m文件中，因此請點選打開它。

我們首先需要做的是通過一些方法與精靈交互信息，如果你僅僅希望在一個方法中進行交互，那麼一個局部變量就可以做到，但那是一種十分罕見的情況，通常我們需要移動一些精靈來回應觸屏事件，或者根據一些邏輯在不同的畫面下移動精靈，那麼我們就需要在多個方法中與精靈交互。

我們有若干種方法來解決上述問題，大多數演示代碼通過爲每一個被增添到層(layer)中的精靈分派一個數值標籤(tag)來完成工作(具體你可以使用getChildByTag方法)。這是一種安全的方法，但是可能需要做大量額外的工作，並且當程序在擁有成百上千個精靈的大遊戲中運行時可能會出現性能問題。

因此我們將使用簡單的方法，它同樣是安全的，只要你的程序中沒有比一個更多的場景實例同時運行就沒有問題。我們可以在程序中簡單的聲明精靈類型(CCSprite)的指針變量。請在「#import」代碼行下面增添如下兩行代碼：

CCSprite *seeker1;

CCSprite *cocosGuy;

上面創建的兩個用以與精靈對象交互的CCSprite指針變量，起初是無法與任何對象交互的，但是下一步我們將會把他們增添到「init」方法中。

在程序中找到「-(id)init」方法代碼。這個方法會在場景初始創建的時候被自動調用。方法中的「if」語句和尾部的「return self」語句很容易讓人感到迷惑，其實你完全可以把它們當作模板文件，將它們放在一邊不去理會。所有負責場景切換的代碼都包含在這個「if」塊中。

刪除當前「if」塊中內容，比如那些創建「Hello World」標籤的語句，我們不再需要它們了。使用如下代碼替換它們：

         // create and initialize our seeker sprite, and add it to this layer

        seeker1 = [CCSprite spriteWithFile: @"seeker.png"];

        seeker1.position = ccp( 50, 100 );

        [self addChild:seeker1];

 

        // do the same for our cocos2d guy, reusing the app icon as its p_w_picpath

        cocosGuy = [CCSprite spriteWithFile: @"Icon.png"];

        cocosGuy.position = ccp( 200, 300 );

        [self addChild:cocosGuy];

我們需要爲每個精靈增添三行代碼。第一行代碼調用「spriteWithFlie」方法是爲了創建一個新的CCSprite對象，用以將一張圖像素材加載到程序中。

下一行代碼設置了精靈的中心點在屏幕上的位置，我們使用「cpp」宏在X,Y座標軸上創建2D座標點。注意，在cocos2d中，X座標軸起始於屏幕左邊並向右邊逐漸遞增，Y座標起始於屏幕低端並向上端逐漸遞增。

最後，第三行代碼調用了「addChild」方法用以將最近創建的精靈顯示在層(layer)上。

保存並且運行你的代碼。運行結果如下：

 

製作物體移動：

現在你知道了如何讓精靈顯示在屏幕上，你可能更希望他們能四處移動。有兩種基本方法可以讓精靈動起來：

1.       使用一個行爲(Action)方法讓精靈在一定時間後自動移動到目標地點。

2.       自己使用一個在遊戲運行期間能夠被週期性調用的方法移動精靈。

讓我們先來看看第二種方法。回到HelloWorldScene.m文件的「init」方法。其中「if」塊中包含的代碼用以創建你的精靈。我們打算把一段週期回調代碼增添到初始化(init)方法中，請將如下代碼放置在「if」塊內，緊跟在「[self addChild:cocosGuy];」代碼行的後面：

        // schedule a repeating callback on every frame

        [self schedule:@selector(nextFrame:)];

這裏的「schedule」方法被其自身self(the HelloWorld CCLayer)調用,並且通過地址傳輸的方式調用「nextFrame」方法作爲它的一個參數。不確定「nextFrame」方法是否存在？沒有關係，我們馬上就要創建它。找一處不包含在任何方法中的空行，例如，init方法之後，dealloc方法之前的空位。插入如下代碼： 

 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
   這段代碼會作用於每一個動畫畫面，cocos2d庫將會調用你的「nextFrame」事件，經過指定的時間直到最後一個畫面結束。這樣你就有機會得心應手的處理很多事情，比如：四處移動你的精靈，檢測碰撞，更新一個物理模型，生成一個敵人，或是在你不需要的時候移除精靈等等。 
   
 
  
 
  
 
   我們所遇到的情況是需要我們移動「seeker1」精靈。移動一個精靈，你只要爲「position」屬性設置一個新的值就可以了。(你可能會被誤導僅設置x座標或者y座標的值，但那樣是無法運行的，你必須設置一個完整的新座標值。) 
   
 
  
 
  
 
   我們通過100*dt語句來改變精靈在x座標上的位置，你可以將它理解爲：精靈會以每秒鐘100像素的速度移動。通過設定一個值與dt的乘積來確定精靈的移動量是一種很好的方法，因爲它可以使運動保持恆速，雖然畫面幀數可能會發生一點變化。 
   
 
  
 
  
 
   接下來，我們來做精靈的邊界檢查。假設你要在一個屏寬爲480像素的iPhone上設置精靈的邊界檢查，常規的做法是調用[[CCDirector sharedDirector] winSize]方法獲得屏幕的實際尺寸，在加上32，因爲32是精靈寬度的一半，當精靈超過480+32時，精靈的中心點剛好在屏幕之外。這種情況發生的時候，我們將精靈的x座標設爲-32，這樣就保證了精靈剛好不會超出屏幕的邊緣。 
  
 
  
 
    
   
  
  
 
  
 
   響應觸摸： 
    
   
 
    
  
 
  
 
   處理事件和安排一個回調有點不同。事件中可能包含有類似於屏幕觸摸和加速器的東西。Cocos2d中已經爲此定義了一些特殊的方法用來處理它們，並且針對觸摸事件，有兩種不同的處理方法：「標準(standard)」和「定向(targeted)」。 
   
 
  
 
  
 
   這節課，我們將會使用定向(targeted)方法。我們需要修改幾處代碼。首先，在「HelloWorldScene.h」頭文件之後增添： 
   
 
  
 
  
 
   #import "CCTouchDispatcher.h" 
   
 
  
 
  
 
   下一步，再次找到「init」方法，並且在「if」塊結束語句之前插入這段定向(targeted)觸摸事件註冊代碼： 
   
 
  
 
  
 
   // register to receive targeted touch events 
   
 
  
 
  
 
   [[CCTouchDispatcher sharedDispatcher] addTargetedDelegate:self 
   
 
  
 
  
 
                                                        priority:0 
   
 
  
 
  
 
                                                   swallowsTouches:YES]; 
   
 
  
 
  
 
   現在找一個空地放置新的方法，或許寫在nextFrame方法之後是一個不錯的注意。因爲我們正在使用「定向(targeted)」方法處理觸摸事件，我們不得不執行一段ccTouchBegan方法，這裏返回YES是爲了告訴觸摸感受器你即將進行一次屏幕觸摸： 
   
 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
   在同一次觸摸發生時還會有其他的觸摸方法被調用。讓我們增添一些通過觸摸來使第二個精靈移動的代碼： 
   
 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
   下面讓我們來分析一下上述代碼的功能： 
   
 
  
 
  
 
   1.        
   首先它獲取了屏幕觸摸的位置。 
   
 
  
 
  
 
   2.        
   然後我們通知CCDirector去轉換GL座標，例如，我們使用相同的座標系統進行繪製，那麼程序將會在人物與場景圖之間轉換。 
   
 
  
 
  
 
   3.        
   下一步我們將會停止精靈早先的動作。 
   
 
  
 
  
 
   4.        
   最後我們執行新的動作，將精靈移動到觸摸的位置。 
   
 
  
 
  
 
   我們不需要在nextFrame事件中增添任何代碼去控制精靈的移動，因爲我們正在使用動作替換方法。 
   
 
  
 
  
 
   運行這個程序，你會發現當你的手指離開屏幕的時候，cocos2d icon圖標將會移動到指定的位置，並且seeker機器人將會穿越屏幕。 
   
 
  
 
  
 
    
   
 
 
  
 
  
 
   實例源代碼下載地址： 
   http://down.51cto.com/data/130517