js實現飛機大戰小遊戲

2022-08-10 14:42:24 字數 1808 閱讀 8071

一開始先定義乙個變數state記錄遊戲的狀態

預備遊戲開始前的準備介面的內容

畫布的寬高

遊戲的各種狀態  自定義的規則,定義常量來實現  

繪製不斷運動的背景,

建立物件,給定的src屬性  載入

設定背景物件的詳細資訊,寬度,高度,物件,

自定義建構函式

設定基本的資料

設定繪圖的需要的座標  --兩張需要不斷的運動    0,0,0,-this.height

繪製的方法 ----兩張

運動的方法---兩張的y座標不斷的更改---判斷臨界點

例項化背景的物件   通過建構函式例項化

遊戲的logo

直接在畫布中繪製logo  state == start

點選畫布  starting

我方飛機出場階段  遊戲過渡階段

飛機出場

準備好飛機出場的所有 陣列  寬高一致,只是飛機在中的位置不一樣而已

記錄了載入的數量

自定義的動畫效果建構函式

基本資料  -----  上面的物件資料都要包含

索引 ----- 記錄當前繪製第幾張

繪製  座標固定  :0,畫布高度-的高度

速度的屬性

運動的方法  每一次增加這個速度,當這個數去取某個數的餘數等於0的時候

切換索引 --- 索引值+1

如果所有的都繪製了,表示需要切換遊戲狀態為running

例項化動畫效果的物件

開始遊戲

我方飛機載入完成以後,直接進入遊戲開始階段

敵方飛機進場   我方飛機發射子彈

記錄分數  生命值的變化

具體的步驟和前面的步驟

建構函式 建立物件完成

暫停遊戲

在遊戲中,如果滑鼠出了畫布,就暫停遊戲

滑鼠再次進入時,恢復遊戲

結束遊戲

當生命值為0的時候,結束遊戲

啟動遊戲

通過定時器呼叫函式

任何時候都需要繪製背景

在start狀態下繪製logo

在starting狀態下繪製  動畫效果的繪製方法以及運動方法

總結:做這個小遊戲之前需要先分析每個遊戲狀態下要做的事情,

通過建構函式來繪製我方飛機,子彈,敵方飛機等,

最後通過定時器來呼叫各個函式。

飛機大戰小遊戲1 0

視窗類 飛機遊戲 author 小帆敲 public class mygameframe extends jframe catch interruptedexception e new framethread start 新增炮彈 for int i 0 i 計時器 author 小帆敲 publi...

飛機大戰的小遊戲

c語言 include include include include include define max 100 long long int speed 0 控制敵機的速度 int position x,position y 飛機的所在位置 int high,width 地圖的大小 int bu...

自作JavaScript飛機大戰小遊戲

做遊戲就要有素材的啦 以下是在愛給網找到的素材 首先3個頁面的開啟我們用div來做,通過更改div的隱藏屬性display none 與顯示display block來達到頁面切換的效果 確定 就這麼短短的幾行樣式 足夠啦!設定完css樣式後我們就可以開始js 的編寫。首先我們建立好各個檔案,儲存相...