[教學] Flash 遊戲製作 (基礎編)

以Adobe Flash 製作遊戲, 只要懂得幾個重點, 每個人都能編寫遊戲.
現在為大家介紹, 如何編寫簡單射擊遊戲, 我們會分兩部分說明 (基礎編 及 進階編).

• 基礎編 - 為大家講解AS3(Action Script 3.0) 基本用法, 構成遊戲的基本元素, 用戶與遊戲之間溝通方法.
• 進階編 - 把所有遊戲元素物件化, 建構整個遊戲, 最後發佈至iOS 運作.

範例功能:

1. 開始畫面
2. 遊戲畫面
    - 按下螢幕時, 移動玩家位置
    - 測試玩家是否被擊中
3. 完結畫面

範例說明:

Frame Rate - 舞台的影格速率.

預設為24 fps, 即每一秒鐘, 更新24 次, 理論上數字越高, 畫面越流暢.
我們會設定為30 fps, 因為數字越高, 對電腦硬體要求越高, 在流動電話運行不能有太強要求.

gotoAndPlay - 在指定影格開始播放 SWF 檔.

相信不少人知道用法, 我們會利用這個指令, 選擇需要顯示畫面.
假如我們被擊中時, 會改變成火焰, 使用gotoAndPlay 跳到destory 這個影格播放:

gotoAndPlay("destory");

影格 - 影格名字可以在屬性(PROPERTIES) 中設定.

const 常數 - 製作遊戲時, 我們會有一些數字需要定義, 例如移動速度等等...

通常這些常數會以英文大寫定義.

const MOVE_SPEED:int = 4;

event 事件 - 當發生事件時，Event 物件會被當作參數傳遞(dispatch)至事件偵聽程式(listener).

在這個範例中, 我們會使用以下兩個Event:

MouseEvent.CLICK - 當用戶按下按鈕時, 會產生一個事件, 然後傳送至事件偵聽程式.

function startClickHandler(event:MouseEvent):void{
  gotoAndPlay("play_game");
}
startBtn.addEventListener(MouseEvent.CLICK, startClickHandler);

Event.ENTER_FRAME - 這個事件以每一秒產生30 次傳遞至事件偵聽程式. 產生次數與Frame Rate 有直接關係. 我們會利用ENTER_FRAME, 不斷更新和改變實體位置, 亦會測試實體之間是否重疊.

function enterFrameHandler(event:Event):void{
  ...
}
this.addEventListener(Event.ENTER_FRAME, enterFrameHandler);

MovieClip.x 和 MovieClip.y - 指出實體的座標, 我們可以不斷改變實體位置.

playerMc.x -= _inertiaX;
playerMc.y -= _inertiaY;

hitTestPoint - 評估顯示實體，看它是否與 x 和 y 參數所指定的點重疊或相交.

我們會把用戶滑鼠的位置(mouseX 和mouseY) 測試, 決定實體是否到達目標位置, 然後停止移動.

if(playerMc.hitTestPoint(_clickX, _clickY))
 this.removeEventListener(Event.ENTER_FRAME, enterFrameHandler);

hitTestObject - 評估顯示實體的範圍框，看它是否與另一顯示實體的範圍框重疊或相交.

我們會測試用戶與電腦是否重疊, 然後停止所有事件, 播放火焰畫面.

if(playerMc.hitTestObject(computerMc)){
   // <----- remove all listener
   this.removeEventListener(Event.ENTER_FRAME, enterFrameHandler);
   this.stage.removeEventListener(MouseEvent.CLICK, stageClickHandler);
 
   // <----- play effect
   playerMc.gotoAndPlay("destory");
   computerMc.gotoAndPlay("destory");
}

大家可以 [下載], 然後一齊看看, 動手製作簡單遊戲玩玩.