羊了個羊純前端實現版【魚了個魚】,自定義關卡+圖案+無限道具
游戲特色:
- 支持選擇難度(4 種)
- 支持自定義難度
- 支持自定義動物圖案(比如 ????)
- 可以無限使用技能(道具)
- 不需要看廣告
- 能通關
簡單說下實現原理,主要有 4 個點:
- 游戲全局參數:做游戲的同學都知道,游戲中會涉及很多參數,比如槽位數量、層數等等。我們要將這些參數抽取成統一的全局變量,供其他變量使用。從而做到修改一處,游戲自動適配。還可以提供頁面來讓用戶自定義這些參數,提高游戲的可玩性。
- 網格:為了讓塊的分布相對規整、并且為計算坐標提供方便,我將整個游戲畫布分為 24 x 24 的虛擬網格,類似一個棋盤。一個塊占用 3 x 3 的格子。
- 隨機生成塊:包括隨機生成方塊的圖案和坐標。首先我根據全局參數計算出了總塊數,然后用 shuffle 函數打亂存儲所有動物圖案的數組,再依次將數組中的圖案填充到方塊中。生成坐標的原理是隨機選取坐標范圍內的點,坐標范圍可以隨著層級的增加而遞減,即生成的圖案越來越擠,達到難度逐層加大的效果。
- 塊的覆蓋關系:怎么做到點擊上層的塊后,才能點下層的塊呢?首先要給每個塊指定一個層級屬性。然后有兩種思路,第 1 種是先逐層生成,然后每個格子里層級最高的塊依次判斷其周圍格子有沒有塊層級大于它;第 2 種是在隨機生成塊的時候就給相互重疊的塊綁定層級關系(即誰覆蓋了我?我覆蓋了誰?)。這里我選擇了第 2 種方法,感覺效率會高一些。
評論