Flash製作簡單塔防遊戲(一)

_Lunay發表於2013-06-26
遊戲
玩過塔防遊戲，基本上就是一堆大小怪物沿著固定路徑行走，玩家在地圖上某些點放置武器殲滅他們。

首先讓我們準備一張簡陋的地圖

黃色的表示怪物行走路徑，箭頭表示行走的方向，路上的紅色圓點座標用來作為路徑的資料，怪物根據這些資料進行行走。
行走的實現原理如下：

物體要從A點移動到B點，速率為speed(每幀移動的長度)

那麼用A到B的總長度除以speed,然後取整，得到的結果表示多少幀後，物體已經移動到B點。
計算出A點到B點的方向，然後把Speed分解成水平與豎直方向的兩個值vx,vy。
然後在每幀，把物體的座標加上這兩值，從而實現物體的移動。
 
開啟flash cs5, 新建一個actionscript 3文件game.fla,設定大小為800*600,幀頻36f/s.
 
路徑上的點用一個自定義的類來表示，之所以不用現成的Point類是因為我只需要座標值，不需要運算，用Point重了點
 
下面就是自定義的Dot類
 
package  {
 
 public class Dot {
  //橫座標
  public var x:int;
  
  //縱座標
  public var y:int;
 
  public function Dot(xPoz:int, yPoz:int) {
   // constructor code
   x = xPoz;
   y = yPoz;
  }
 }
}
 
插入新元件建立小怪物

點“確定”後會彈出一個對話方塊，點"確定"就可以了。

 回到game.fla,把我們畫好的地圖匯入到舞臺，對齊到(0,0),新建一個圖層，在上面直接寫下以下的程式碼,


import flash.events.Event;

//路徑資料,陣列中的每個元素代表一個點，順序是從起點到終點
var pathArr:Array = [new Dot(850, 27),
      new Dot(800, 27),
      new Dot(627, 20),
      new Dot(444, 22),
      new Dot(391, 30),
      new Dot(150, 31),
      new Dot(90, 50),
      new Dot(73, 133),
      new Dot(71, 193),
      new Dot(80, 220),
      new Dot(110, 260),
      new Dot(162, 302),
      new Dot(228, 324),
      new Dot(282, 320),
      new Dot(540, 233),
      new Dot(590, 227),
      new Dot(630, 250),
      new Dot(646, 293),
      new Dot(651, 543),
      new Dot(643, 600)];

 

//建立小怪物，新增到舞臺，並設定初始位置
var monster:Monster = new Monster();
addChild(monster);
monster.x = Dot(pathArr[0]).x;
monster.y = Dot(pathArr[0]).y;

//小怪的運動速率
var speed:int = 6;
//分解到兩個方向,水平vx和豎直vy
var vx:Number;
var vy:Number;

//連點之間的距離除以速率的值
var stepNums:int;
//迴圈用變數
var stepCount:int = 0;

//當前是否經過一個關鍵點（陣列中指定的點 ）
var passedDot:Boolean = true;
//當前對應的關鍵點
var currentIndex:int = 0;

//關鍵點數量
var num:int = pathArr.length;

this.addEventListener(Event.ENTER_FRAME, onEnterFm);


function onEnterFm(e:Event):void
{
  //如果正好通過一個關鍵點
  if(passedDot)
  {
   //如果還沒有到最後一個關鍵路徑點
   if(currentIndex < num - 1)
   {
    //兩相鄰關鍵點Y座標差值
    var deltaY:Number = Dot(pathArr[currentIndex+1]).y - Dot(pathArr[currentIndex]).y;
    //兩相鄰關鍵點X座標差值
    var deltaX:Number = Dot(pathArr[currentIndex+1]).x - Dot(pathArr[currentIndex]).x;
    //計算出兩相鄰關鍵點連線的角度
    var angle:Number = Math.atan2(deltaY, deltaX);
    
    //調整小怪的角度
    monster.rotation = angle * (180/Math.PI);
    
    //計算出在這兩個關鍵點之間每幀在兩個方向上的移動距離
    vx = speed*Math.cos(angle);
    vy = speed*Math.sin(angle);
    
    ////計算出兩相鄰關鍵點連線的長度（勾股定理）
    var dis:Number = Math.sqrt(deltaY*deltaY+deltaX*deltaX);
    //距離除以速率，得到的值表示在這個值表示的幀數內不用再計算vx和vy
    stepNums = int(dis/speed);
    
    
   }
   
   //
   passedDot = false;
  }
  
  
  
  if(stepCount < stepNums)
  {
   //只要小於stepNums，怪物移動的方式如下
   monster.x += vx;
   monster.y += vy;
  }

  else
  {
   //沒有運動到終點
   if(currentIndex < num - 1)
   {
    //對應關鍵點移動到下一個
    currentIndex++;
    //迴圈計數重置
    stepCount = 0;
    //通過了一個點，開始一段新路程
    passedDot = true;
    //將小怪定位到新起點
    monster.x = Dot(pathArr[currentIndex]).x;
    monster.y = Dot(pathArr[currentIndex]).y;
   }
   
  }
  stepCount++;
}

按下cltr+enter執行一下，看到小怪的確是按照指定的路徑在運動,而且小怪的自轉角度也是合適的。

 

 

 

文章來自http://cdbym.blog.163.com/blog/static/28331498201167104013925/

相關文章