羊了個羊，但是低配版

大家好，我是魚皮。

前幾天朋友圈突然被一個小游戲 “羊了個羊” 刷屏了，出于好奇我也打算小玩一把試試，結果沒想到上頭了。。。

游戲的玩法非常簡單，類似 “消消樂”，從一堆方塊中找到相同圖案的 3 個方塊并消除即可。

但沒想到，就是這個操作無比簡單的小游戲，難住了大家，很多同學無論如何都過不了第二關?。ó斎?，也包括我 ??）

不過作為一名程序員，我玩了幾次就發(fā)現(xiàn)不對勁了。。。

方塊的生成是完全隨機的，而且越玩到后面的層數(shù)方塊的范圍就越小、可選的方塊就越少。在這兩個條件下，這個游戲真的有沒有解很難說，真就變成了一個運氣游戲（據(jù)說通關率不足 0.1 %）。

不過作者很良心，給了大家逆天改命的機會，看廣告可以使用道具和復活。

唉，不過明知道通關的概率微乎其微，我還是沒忍住，又玩了幾十把，因為總覺得自己可能是那個 “天之驕子”。這個游戲之所以能爆火，除了營銷套路之外，最主要的還是拿捏了用戶的心理吧。

但是，玩游戲的過程中，我也沒閑著，我在思考這個游戲是怎么開發(fā)出來的、可能用了什么算法之類的。

當我被游戲虐的心累了之后，我決定自己做一個能通關的 “羊了個羊”，就叫它 “魚了個魚” 吧！

熬夜肝了幾個小時，游戲的雛形就做出來了，這兩天又打磨了一下，才正式上線，并且把所有代碼完全開源了！

游戲地址：https://yulegeyu.cn

開源地址：https://github.com/liyupi/yulegeyu

進入主頁，可以選擇多種不同的難度：

還可以自定義難度，比如設置槽位的數(shù)量，設置每層的塊數(shù)等等：

玩法和羊了個羊類似，不過這里我加了 4 種道具，每種道具都可以無限使用（不用看廣告哈哈）：

因為時間有限，一人全役，做的不是很精致，但是完全足夠滿足一下通關的欲望了哈哈。

最后再簡單說一下這個游戲的實現(xiàn)原理吧，主要有 4 個點：

1. 游戲全局參數(shù)：做游戲的同學都知道，游戲中會涉及很多參數(shù)，比如槽位數(shù)量、層數(shù)等等。我們要將這些參數(shù)抽取成統(tǒng)一的全局變量，供其他變量使用。從而做到修改一處，游戲自動適配。還可以提供頁面來讓用戶自定義這些參數(shù)，提高游戲的可玩性。
2. 網(wǎng)格：為了讓塊的分布相對規(guī)整、并且為計算坐標提供方便，我將整個游戲畫布分為 24 x 24 的虛擬網(wǎng)格，類似一個棋盤。一個塊占用 3 x 3 的格子。
3. 隨機生成塊：包括隨機生成方塊的圖案和坐標。首先我根據(jù)全局參數(shù)計算出了總塊數(shù)，然后用 shuffle 函數(shù)打亂存儲所有動物圖案的數(shù)組，再依次將數(shù)組中的圖案填充到方塊中。生成坐標的原理是隨機選取坐標范圍內(nèi)的點，坐標范圍可以隨著層級的增加而遞減，即生成的圖案越來越擠，達到難度逐層加大的效果。
4. 塊的覆蓋關系：怎么做到點擊上層的塊后，才能點下層的塊呢？首先要給每個塊指定一個層級屬性。然后有兩種思路，第 1 種是先逐層生成，然后每個格子里層級最高的塊依次判斷其周圍格子有沒有塊層級大于它；第 2 種是在隨機生成塊的時候就給相互重疊的塊綁定層級關系（即誰覆蓋了我？我覆蓋了誰？）。這里我選擇了第 2 種方法，感覺效率會高一些。

當然，以上只是我的實現(xiàn)方式，未必是最好的，但是完全能夠滿足游戲的功能訴求了。

歡迎大家體驗~

游戲地址：https://yulegeyu.cn

開源地址：https://github.com/liyupi/yulegeyu