主要用来锻炼逻辑思维能力

image.png

可以选模式

image.png

这里面主要解决的问题是：

1.判断滑动方向

//在滑动块级绑定滑动开始和滑动结束的方法

很原始的方法，startFn时保存开始的(x,y),endFn时保存结束的(x1,y2),根据这四个参数 判断方向，算法在方法directionFn里

2.根据滑动方向进行叠加

叠加方法在afterslider里

全部代码如下

html代码：

{{score}}分

{{step}}步

{{time}}s

{{v.number}}

{{item.name}}

规模

4*4

3*3

规模

{{item.name}}

Submit

js代码:

Page({

/**

* 页面的初始数据

*/

data: {

cellArr:[],

zhezhangc:true,

modal:3,

score:0,

toushstart:[],

toolindex:2,

step:30,

time:60,

tool: [{ 'name': '无限模式', 'status': 2, 'class': 'speed' },{ 'name': '计时模式', 'status': 0, 'class': 'time' }, { 'name': '计步模式', 'status': 1, 'class': 'speed' }]

},

formSubmit(e) {

console.log(e.detail.value.radiogroup);

this.setData({ modal: e.detail.value.radiogroup, zhezhangc:false});

this.initFn();

},

choosemodal: function (event){

this.setData({ toolindex: event.currentTarget.dataset.data.status});

},

openmenu:function(){

var this_ = this;

this.setData({ zhezhangc: !this_.data.zhezhangc });

},

// 初始化

initFn:function(){

var modal = this.data.modal;

var cellArr = [];

for (var i = 0; i < modal; i++) {

var iarr = [];

for (var j = 0; j < modal; j++) {

iarr.push({ coordinate: [i, j], number: 0 });

}

cellArr.push(iarr);

}

// 二维数组转一维数组

var initget = 1;//第一次先放一个

var this_ = this;

var random_row = Math.round(Math.random() * (modal - 1));

var random_cell = Math.round(Math.random() * (modal - 1));

var getnumber = [2,4,8];

if (cellArr[random_row][random_cell].number==0){

// 如果在空白处就放一个方块

cellArr[random_row][random_cell].number = getnumber[Math.round(Math.random() * 2)];

}

this.setData({ cellArr: cellArr });

},

scoreFn:function(num_){

var score_ = this.data.score;

this.setData({

score:score_+num_*2

})

},

refreshcoordinate:function(){

var cellArr = this.data.cellArr;

var modal = this.data.modal;

var random_row;

var random_cell;

var this_ = this;

for(var i = 0;i<1000;i++){

random_row = Math.round(Math.random() * (modal - 1));

random_cell = Math.round(Math.random() * (modal - 1));

if (cellArr[random_row][random_cell].number == 0) {

cellArr[random_row][random_cell].number = 2;

break;

}

}

var isgame = this.gameover();

var tooltype = this.data.toolindex;

var step_ = this.data.step;

if (isgame && step_ > 0){

this_.setData({

cellArr: cellArr,

cellArrBefore: cellArr

});

if (tooltype == 1){

this_.setData({

step: this.data.step - 1

});

}

}else{

wx.showModal({

title: '提示',

content: '游戏结束',

});

this_.setData({

cellArr: [],

step:30,

score: 0

});

this_.initFn();

}

},

gameover:function(){

var cellArr = this.data.cellArr;

var modal = this.data.modal;

var gamecontine_ = false;

for(var i = 0;i

for (var j = 0; j < modal; j++) {

if (cellArr[i][j].number==0){

gamecontine_ = true;

}

}

}

return gamecontine_;

},

redo:function(){

var this_ = this;

this.setData({

cellArr:this_.data.cellArrBefore

});

},

// 滑动开始

startFn: function (event){

var X_ = event.touches[0].clientX;

var Y_ = event.touches[0].clientY;

this.setData({ toushstart: [X_,Y_]});

},

// 滑动结束

endFn: function (event) {

var eX = event.changedTouches[0].clientX;

var eY = event.changedTouches[0].clientY;

var dir = this.directionFn(eX, eY);

this.afterslider(dir);

},

// 判断方向

directionFn:function(endX,endY){

var sX = this.data.toushstart[0];

var sY = this.data.toushstart[1];

var eX = endX;

var eY = endY;

// console.log('start' + this.data.toushstart+','+sY+'end:'+eX+','+eY);

// 求角度

var a = eX-sX+1;

var b = sY-eY+1;

var angle = Math.abs(b / a);

var direction_;

// console.log('a:' + a + ',b:' + b + ',angle:' + angle);

if (a > 0 && angle<1){

direction_ = 1;

// console.log('右边');

}

if (a < 0 && angle < 1) {

direction_ = 3;

// console.log('左边');

}

if (b > 0 && angle > 1) {

// console.log('上边');

direction_ = 0;

}

if (b < 0 && angle > 1) {

// console.log('下边');

direction_ = 2;

}

return direction_;//上右下左对应0，1，2，3

},

// 根据方向做后续操作

afterslider:function(dir){

var this_ = this;

var modal = this.data.modal;

var cellArr = this.data.cellArr;

var test_ = this.data.test;

switch(dir){

case 0:

// 从上往下循环

for(var i = 1;i

for (var j = 0; j < modal; j++) {

var thisCell = cellArr[i][j];

for(var k=i;k>0;k--){

if (cellArr[k - 1][j].number == 0) {

cellArr[k - 1][j].number = cellArr[k][j].number;

cellArr[k][j].number = 0

}else{

if (cellArr[k - 1][j].number == cellArr[k][j].number) {

var num_ = cellArr[k][j].number;

cellArr[k][j].number = 0;

cellArr[k - 1][j].number = num_ * 2;

this_.scoreFn(num_);

}

}

}

}

}

break;

case 2:

// 从下往上循环

// modal - 2是因为，最底下的方块不用管了

for (var i = modal - 2; i >= 0; i--) {

for (var j = 0; j < modal; j++) {

var thisCell = cellArr[i][j];

for(var k = i;k

if (cellArr[k + 1][j].number == 0) {

cellArr[k + 1][j].number = cellArr[k][j].number;

cellArr[k][j].number = 0

} else {

if (cellArr[k + 1][j].number == cellArr[k][j].number) {

var num_ = cellArr[k][j].number;

cellArr[k][j].number = 0;

cellArr[k + 1][j].number = num_ * 2;

this_.scoreFn(num_);

}

}

}

}

}

break;

case 1:

for (var j = modal - 2; j >= 0;j--){

for(var i=0;i

var thisCell = cellArr[i][j];

for (var k = j; k < modal - 1; k++) {

if (cellArr[i][k + 1].number == 0) {

cellArr[i][k + 1].number = cellArr[i][k].number;

cellArr[i][k].number = 0

} else {

if (cellArr[i][k + 1].number == cellArr[i][k].number) {

var num_ = cellArr[i][k].number;

cellArr[i][k].number = 0;

cellArr[i][k + 1].number = num_ * 2;

this_.scoreFn(num_);

}

}

}

}

}

break;

case 3:

// 从左往右

for(var j = 1;j

for (var i = 0; i < modal; i++) {

var thisCell = cellArr[i][j];

for (var k = j; k >0; k--) {

if (cellArr[i][k - 1].number == 0) {

cellArr[i][k - 1].number = cellArr[i][k].number;

cellArr[i][k].number = 0

} else {

if (cellArr[i][k - 1].number == cellArr[i][k].number) {

var num_ = cellArr[i][k].number;

cellArr[i][k].number = 0;

cellArr[i][k - 1].number = num_ * 2;

this_.scoreFn(num_);

}

}

}

}

}

break;

}

this.refreshcoordinate();

},

watchAgain: function (cellArr, k, j, num_){

if(cellArr[k - 1][j].number == cellArr[k][j].number) {

cellArr[k][j].number = 0;

cellArr[k - 1][j].number = num_ * 2;

var k_ = k - 1;

this.watchAgain(cellArr, k_, j);

}

}

,

/**

* 生命周期函数--监听页面加载

*/

onLoad: function (options) {

this.initFn();

},

/**

* 生命周期函数--监听页面初次渲染完成

*/

onReady: function () {

},

/**

* 生命周期函数--监听页面显示

*/

onShow: function () {

},

/**

* 生命周期函数--监听页面隐藏

*/

onHide: function () {

},

/**

* 生命周期函数--监听页面卸载

*/

onUnload: function () {

},

/**

* 页面相关事件处理函数--监听用户下拉动作

*/

onPullDownRefresh: function () {

},

/**

* 页面上拉触底事件的处理函数

*/

onReachBottom: function () {

},

/**

* 用户点击右上角分享

*/

onShareAppMessage: function () {

}

})