http://bbs.9ria.com/thread-80527-1-6.html
這個教程是我翻譯的。。不是我原創的。。原來是發表在新聞資訊版塊,後來被移到了遊戲編程版塊,所以關於原作者的一些信息等都沒了。。。
查看該系列的其它文章:
做一個像植物大戰殭屍的Flash遊戲
做一個像植物大戰殭屍的Flash遊戲2
做一個像植物大戰殭屍的Flash遊戲3
做一個像植物大戰殭屍的Flash遊戲4
做一個像植物大戰殭屍的Flash遊戲5
我不得不承認,我不是植物大戰殭屍的骨灰玩家,所以,如果你發現這個系列的教程有什麼地方錯誤的,請告訴我。
定義遊戲的主要結構
植物大戰僵給了我們很好的視覺和感覺上的享受。你得保護你的房子以免被吃腦的殭屍入侵,這相當的吸引人。總的來說,殺死殭屍是很有趣的。但是這視覺上的東西和遊戲玩法無關,我們可以用屠夫大戰管子工,鴿子大戰駱駝,圓形大戰方塊來代替。
在這個系列的教程中,我們用圓形來代替植物,用方塊來代替殭屍,偉大的圓形將會阻止邪惡的方塊進入我們的基地。遊戲區域可以被簡化爲一個區塊遊戲。
設想一下這種局面:
然後儘量把它想象成這樣:
我們所擁有的是一個位於(2,2)的植物,它會盡力阻止走在第二行(從第0行開始,下同)的殭屍,並且另一個殭屍正在沿着第三行接近我們的基地,還有一個正從第四列落下的陽光。不可能有另外一個植物位於(2,2),並且不可能出現一個殭屍走在第二行與第三行之間。
創建遊戲區域
正如你在上圖看到的那樣,這個遊戲的區域是一個5行9列的矩陣。因此,第一件要做的事就是定義一個數組。我設想你的fla文件有一個文檔類爲Main。下面是Main.as的內容:
- package {
- import flash.display.Sprite;
- public class Main extends Sprite {
- private var gameField:Array;
- public function Main():void {
- setupField();
- }
- private function setupField():void {
- gameField=new Array();
- for (var i:uint=0; i<5; i++) {
- gameField[i]=new Array();
- for (var j:uint=0; j<9; j++) {
- gameField[i][j]=0;
- }
- }
- }
- }
- }
畫出遊戲區域
下面的代碼對於測試來說足夠了,至少我們會畫出一個遊戲區域來。
- package {
- import flash.display.Sprite;
- public class Main extends Sprite {
- private var gameField:Array;
- public function Main():void {
- setupField();
- drawField();
- }
- private function setupField():void {
- gameField=new Array();
- for (var i:uint=0; i<5; i++) {
- gameField[i]=new Array();
- for (var j:uint=0; j<9; j++) {
- gameField[i][j]=0;
- }
- }
- }
- private function drawField():void {
- var fieldSprite:Sprite=new Sprite();
- var randomGreen:Number;
- addChild(fieldSprite);
- fieldSprite.graphics.lineStyle(1,0xFFFFFF);
- for (var i:uint=0; i<5; i++) {
- for (var j:uint=0; j<9; j++) {
- randomGreen=(125+Math.floor(Math.random()*50))*256;
- fieldSprite.graphics.beginFill(randomGreen);
- fieldSprite.graphics.drawRect(25+65*j,80+75*i,65,75);
- }
- }
- }
- }
- }
這就是我們的遊戲區域了。如果你想要讓區塊體面點。請。。。自便。
捕獲陽光
陽光是植物大戰殭屍裏的貨幣。他們從天上掉下來,落到某一區塊上。撿起這些陽光,你才能購買植物。
我用到了timer事件使得每五秒落下一束陽光,如果你對timer還不熟悉的話,請搜索。
現在,陽光還不會從天上掉下來,而是直接出現在某一隨機的區塊中。此時此刻,我還不知道是否兩束陽光可以同時落到同一區塊中。在這個例子裏,他們是可以的,但是如果原版的植物大戰殭屍裏不允許這樣的話,請告訴我。
當一束陽光落到地上的時候,它能夠被玩家撿起。一個鼠標事件偵聽器處理這整個任務。下面是代碼:
- package {
- import flash.display.Sprite;
- import flash.utils.Timer;
- import flash.events.TimerEvent;
- import flash.events.MouseEvent;
- public class Main extends Sprite {
- private var gameField:Array;
- private var flowersTimer:Timer=new Timer(5000);
- private var sun:sunMc;
- private var sunContainer:Sprite=new Sprite();
- public function Main():void {
- setupField();
- drawField();
- fallingSuns();
- }
- private function fallingSuns():void {
- addChild(sunContainer);
- flowersTimer.start();
- flowersTimer.addEventListener(TimerEvent.TIMER, newSun);
- }
- private function newSun(e:TimerEvent):void {
- var sunRow:uint=Math.floor(Math.random()*5);
- var sunCol:uint=Math.floor(Math.random()*9);
- sun = new sunMc();
- sunContainer.addChild(sun);
- sun.x=52+sunRow*65;
- sun.y=130+sunRow*75;
- sun.addEventListener(MouseEvent.CLICK,sunClicked);
- }
- private function sunClicked(e:MouseEvent):void {
- e.currentTarget.removeEventListener(MouseEvent.CLICK,sunClicked);
- var sunToRemove:sunMc=e.currentTarget as sunMc;
- sunContainer.removeChild(sunToRemove);
- }
- private function setupField():void {
- gameField=new Array();
- for (var i:uint=0; i<5; i++) {
- gameField[i]=new Array();
- for (var j:uint=0; j<9; j++) {
- gameField[i][j]=0;
- }
- }
- }
- private function drawField():void {
- var fieldSprite:Sprite=new Sprite();
- var randomGreen:Number;
- addChild(fieldSprite);
- fieldSprite.graphics.lineStyle(1,0xFFFFFF);
- for (var i:uint=0; i<5; i++) {
- for (var j:uint=0; j<9; j++) {
- randomGreen=(125+Math.floor(Math.random()*50))*256;
- fieldSprite.graphics.beginFill(randomGreen);
- fieldSprite.graphics.drawRect(25+65*j,80+75*i,65,75);
- }
- }
- }
- }
- }
drawField:畫出遊戲區域
fallingSuns:開始製造陽光,使他們墜落
newSun:創建新的陽光
setupField:生成區塊數組
sunClicked:當玩家點擊陽光時調用
下面是效果:
用鼠標撿起陽光吧。
下載該例子的源代碼。下一次,我們將會加入使陽光平滑落下的動畫,並且我們將會買到我們的第一個植物。