I believe that a lot of people have played this kind of small game, is to meet the black key will need to point, white key will never point. If you don’t hit the black block or if you hit the white block, you lose.

onReady: function(){ var array = []; For (var I = 0; i < 10; Var orderArray = [0,0,0,0]; var orderArray = [0,0,0]; var randomNum = Math.floor(Math.random() * 4); orderArray[randomNum] = 1; array.push({id: i, block: orderArray}); } this.setData({ blockData: array.reverse() }); },Copy the code

We can see that there are four paths in the game. Our initialization is to determine the first 10 buttons, randomly number 1 to 4, randomly which is the black button.

Run: function(){var that = this; var speed = 10; this.setData({ canRun: true }); Var timer = setInterval(function(){ that.data.canRun){ clearInterval(timer); return; } var currentScrollHeight = that.data.scrollHeight; Var score = that.data.score; / var/slider data blockData. = that data. BlockData. Concat (). The reverse (); If (math.abs (currentScrollHeight) == 150){// If (math.abs (currentScrollHeight) == 150){// If (math.abs (currentScrollHeight) == 150){// If (math.abs (currentScrollHeight) == 150) If (that checkFirstLineBlockClicked (blockData [0]. The block)) {/ / continue to remove the old node inserting new node scrolllHeight var newId = 0 blockData[blockData.length - 1].id + 1; blockData.push(that.getNewLine(newId)); blockData.shift(); that.setData({ scrollHeight: 0, blockData: blockData.concat().reverse() }); return; } // Error that. HandleWrong (" Please click the white block! Game over ", score); return; } currentScrollHeight = currentScrollHeight - speed; that.setData({ scrollHeight: currentScrollHeight }); }, 20); },Copy the code

The logic above is at the heart of the game, making the black and white keys slide down. If the black key exceeds the threshold, it is necessary to determine whether it has already been clicked. If it’s been clicked on it will be marked, so you just need to check if it’s already marked. If it’s not marked, it’s a straight loser.

Complete: the function () {/ / scores in this global variable app. GlobalData. CurrentScore = score; / / if the score is higher than the highest score To be deposited in the local if (score > app. GlobalData. EndlessScore) {app. GlobalData. EndlessScore = score; wx.setStorageSync('endlessScore',score); } var timer = setTimeout(function(){ wx.redirectTo({ url: '.. /end/end? type=endless&score=' + score }) clearTimeout(timer); }, 2000); }Copy the code

This indicates that the game has been completed, and the highest score is saved into the game. With wx. SetStorageSync (‘ endlessScore ‘score); It can last forever.

Overall design is not too difficult, want to further study, you can pay attention to the public number: poem like code, find me to learn together.