微信小程序實現簡單的2048

　　這兩天心血來潮，用微信小程序寫了一個簡單的2048，歡迎各位老鐵圍觀，提出寶貴意見。這裏我從0到1贅述一下我的實現流程：

　　首先去微信公平臺（https://mp.weixin.qq.com/）註冊一個小程序帳號，注意：一個身份證好像只能註冊5個小程序.而後登錄進入後臺，進行相應的名稱、頭像等設置。個人以下：

　　而後在開發設置選項能夠查看AppID和AppSecret，作好這些準備工做，就能夠打開你的微信開發工具進行編程的奇幻之旅了。打開開發工具，注意最好選擇一個空的目錄，而後粘貼你的AppID，選擇快速啓動就能夠了。恭喜你能夠運行小程序看默認效果了。

　　接下來，清空index.wxml，粘貼上個人代碼（能夠在 https://github.com/WangHao1221/mimi2048.git 蕩下來，最好送我一顆小星星，謝啦！），在這裏說一下，我把app.js作了簡單的修改，用來獲取用戶信息，你也能夠在app.json文件修改爲你想要的方式，而後是在app.wxss裏面加了一個簡單的默認樣式（注意我在wxss裏面加的註釋!）。注意：在config.js文件中我加了一句設置："disableScroll": true,禁止頁面滾動！

　　最後是index.wxss和index.js這兩個文件了，核心邏輯在js，這裏我簡單分析個人思路：

　　1.首先是頭部，獲取頭像暱稱、而後是根據改暱稱，設置最佳分數。

　　2.頭部佈局問題，本身能夠隨意設置，從新開始按鈕先設置上。

　　3.也是最重要的，4*4的方格實現(wx:for)。

　　4.onLoad裏面要作的事情：獲取用戶信息；初始化方格數字；在方格中產生兩個隨機位置並賦值(2/4)，這裏必定要防止兩次出現的位置相同或者該位置已經有數字！最後是初始化分數（this.setData（）方法，既能夠修改變量值還能夠更改model）。

　　5.手勢，根據touch進行方向的判斷（若是是點擊，則不產生新的隨機數）

　　　　這裏是核心，多囉嗦一點：觸摸開始的時候獲取起始點，而後是在move的時候判斷是向哪一個方向滑動，由於根據不一樣的方向，入參不同，最後是end方法，我這裏是把方格用0~15的下標進行標記，每個數字帶表明方格的位置。好比你向左滑動，那也就是說右邊3列數字要向左合併或者移動，好比下面代碼：0、四、八、12即爲最左側方格。

    this.mergeMove(3, 2, 1, 0)
    this.mergeMove(7, 6, 5, 4)
    this.mergeMove(11, 10, 9, 8)
    this.mergeMove(15, 14, 13, 12)

其餘方向，以此類推。mergeMove是我封裝的處理移動或者合併的方法，由於不管哪一個方向，都會進行相同院裏的操做。在mergeMove方法裏面，要更新當前分數，判斷當前遊戲是否結束（方格滿了，而且不能滑動了！），結束的時候，更新最佳成績。最後附上游戲截圖：

     

 

 

　　這裏就介紹這麼多了，固然這裏面會有一些bug，歡迎老鐵們給出意見，還有就是這裏沒有服務器，因此確定總欠缺一些東西，後續我會更新的。歡迎留言評論。