CocosCreater的俄罗斯方块游戏实现
前段时间要做课程设计，发现可以做俄罗斯方块，就想着用cocoscreater做一个俄罗斯方块游戏，顺便发上来。
内容就偷个懒，从自己的课程设计拿过来，不再写了。。自己也记录一下构思过程。
当然，首先要把链接发上来：
http://115.159.225.171/zhyTetris/index.html
接下来就照着自己的设计论文一一复制上来啦。
要文档的直接拉到最后啊！
资源需求：
1、 七种颜色单个方块 要求：格式统一。
2、 七种俄罗斯方块贴图。
3、 游戏UI素材
4、 背景音乐选择
资源需求嘛，网上随便找找素材，略过。。
（游戏界面）
需求：协调美观的游戏界面，由 ①主游戏区
②得分区 ③下一组方块预告区 ④暂停区 ⑤调速区 ⑥游戏结束区 ⑦游戏背景 ⑧操作提示 组成
①主游戏区：游戏的方块生成、移动、旋转、消行的显示去，是最重要的游戏逻辑图形化的实现环节，占据游戏界面的大部分。
②得分区： 每次消行，的分区会加上一定的分数，是得分的可视化界面
③下一组方块预告区：下一组方块的预告。让用户预知下一个生成的方块样式，并作出一定的协调。
④暂停区： 游戏的暂停和继续，有助于随时控制游戏。
⑤调速区：调整方块下落的速度，是对游戏难度的调整。
⑥游戏结束区：游戏失败后的游戏结束通知界面，告知用户此回合失败，可以重新开始下一回合。
⑦游戏背景：整个游戏界面的背景，应做到简介，美观，不与方块颜色冲突，且不能影响游戏体验。
⑧操作提示：游戏开始时，向用户告知启用的控制方法，和控制按钮，以及相应界面回馈效果。ui显示的需求很好理解
控制需求
显示更新需求
当做出消除界面中某一行的操作后，界面需要获得运算结果并更新。
几种算法需求的考虑，就是要考虑到的一些注意点吧：
1.视觉上碰撞到方块后停止运动并新建方块的算法。
2.视觉上的旋转操作，不会旋转到游戏界面外的算法。
3.视觉上有限空间内无法旋转的算法。
4.视觉上有限空间内无法移动的算法。
5视觉上同时消除超过一行的算法。
6.新建方块的算法
7.游戏界面由像素转换到方块网格的算法。
然后是方块的定义
定义方块类型：
在编辑器中预制7种不同颜色的正方形方块，分别是：蓝色，绿色，天蓝色，紫色，红色，黄色，橙色。游戏开始时由Math.floor(7*Math.random());代码驱动随即选取0～6号方块中一种颜色的方块，并实例化对应的目标图形。
基本图形的网格化：
实例化出的基本图形的坐标是以像素为单位，利用2维数组来网格化，选择600*1200像素的主游戏区，利用20*10的数组对其进行网格化，刚好200块块方块填满游戏区，每个方块占有60*60像素，并有一个唯一对应的行和列信息，便于以后运算。
流程图，启发一下方块的思路哈。
接下来就是代码、、最后我会附上整个项目文件滴～
模块设计
1.随机生成数并相应实例化图形的模块
2.移动和控制模块
3检查碰撞模块
4移动和旋转的同时下落重叠检测
5得分和调整模块
6整体ui关联控制模块
7游戏整体状态检测判定模块
（1）随机生成数并相应实例化图形的模块：
首先建立一个23*10的二维数组this.box[][]利用两个for循环给数组每一项赋值为0， 但保留this.box[i] 的每一个项，赋值为一，用来作为地面的判断。所以i=0是地面层 i=1～21是游戏层 i>21作为超出界面gameover的判定区。
应用的方法是：在游戏过程中每次监测到会产生碰撞就会停止下落，并重新建立方块，判定停止下落的同时，给四个方块的停留点存储一个唯一的二维数组标示，并赋值为1。前文提到，7种方块的旋转后共有19种不同图形。由于数量并不多，在游戏中选择采取预存储19种图形的四个方块位置和i的关联信息。这些数据共占据76行代码，并有一个基准i，j值作为位置的参考和旋转操作的转轴中心。考虑到未来阶段的代码简介的，不重复的需求，可以选择算法生成。
（2）移动和控制模块
每次更改i的值并调用预存代码，更新位置，做到视觉上控制效果。方块的移动实际上是由this.box[i][j]二维数组的i,j的加减来控制的，加入键盘监听，监听到键盘的输入，分别由上下左右键和W S D A键控制i，j加减和图形旋转，和屏幕上的点击旋转，左右滑动控制左右移动来做到人机的交互。
（3）检查碰撞模块
检查碰撞模块是俄罗斯方块的重要点有几点需要做到
1.边界碰撞检测
整个游戏有三个边界分别是：左侧、右侧、底侧。
由于游戏完成时考虑到使用像素坐标点限制左右侧边界，其范围是0～600而底侧的碰撞检测则是使用到了二维数组的第一行赋值为1的方法，利用二维数组i，j和第一行做对比的方法。考虑到统一边界算法代码修改亮大，现有方法稳定有效就不做统一。
2．已放置方块和下落方块的碰撞检测
在this.box[i][j]数组中
已放置方块在停止时会对坐标点对应的二维数组坐标点赋值
在下落过程中通过算法计算当前图形中j的种类和每种j对应i的最小值所在的点，每个点对应的i值的下一行即this.box[i-1][j]的值如果为1就判定停止，并重新生成。
3．已放置方块和下落方块的左右移动的碰撞检测
在this.box[i][j]数组中,在移动过程中通过算法计算图形中每种i对应的j的最小值，和i的不重复数量，在此需要对数组做去重运算。最后获取的点应该同i的种类数量一样。
做左移操作时，因该获取到i和对应的j最小值。此时利用this.box[i][j-1]如果为一记sum++对所有种类遍历过后，只有所有图像左侧判定方块都为空即sum等于i的种类数，才可以判定左移操作为真，此时j的值减一，并且调用预存数据，更新位置。
同理，做右移操作时需要获取到的是i和对应的最大值，并做和左移类似的操作和判定。
4.旋转操作后错位回退模块
旋转时，获取此时的关键数据包括形态、偏移值、ij值为回退提供数据，获取旋转后如果旋转后的图片位置上已经有相应的this.box[i][j]已经为1则判定无法旋转，此时将收集到的数据重新赋值给所有属性，转变回上一状态。
(4)得分和调整模块
每次重新实例时调用消行检测模块，对this.box[i][j]做一个遍历如果某个i上的所有值合为10做消行方法。消行后由于对应i行为空此时需要调用到降落算法，此时遍历所有i行上为1的box[][]点做i-1操作并更新位置。
(5)整体ui关联控制模块
消行后每成功一次调用加分算法。每次重新实例化回预先随机下一次的目标并用全局变量交给实例化的方法，预告知界面接收到随机值后载入相应图片根据进度条的调整控制图片下落速度。播放暂停按钮，使用全局变量在0和1间根据点击切换，0为正常游戏1为暂停游戏
(6)游戏开始时的操作控制预告知显示版。
每次游戏开始，播放游戏的控制文本，告知用户如何操作整个游戏，并按透明度渐渐消失。
(7)游戏整体状态检测判定模块
包涵全局变量值的使用如0、1的交换确定游戏状态， 值的加减确定图片的旋转状态。
6.1数据初始化
onLoad: function () {
cc.audioEngine.playEffect(this.audio, true);
this.xingtai=0;
this.prefab;
this.jmix;//j的边界最小最大值
this.jmax;
this.out=0;
this.speed=0.3;
this.scorenum=0;
this.one=[];
this.two=[];
this.three=[];
this.arry=[];//去重数组
this.nextgoal=0;
this.gamestate=0;//游戏的状态
this.box=[];
for(leti=0;i<25;i++){
this.box[i]=[];
for(letj=0;j<10;j++){
if(i===0){
this.box[i][j]=1;
}else{
this.box[i][j]=0;
}
}
}
cc.systemEvent.on(cc.SystemEvent.EventType.KEY_DOWN, this.onKeyDown,this);
this.setcolour();
},
6.2随机数的生成，和对应图片的选取和实例化
setcolour(){
this.i=21;
this.j=4;
vargoal=this.nextgoal;
this.gameover();
this.buildbody(goal);
this.drawnext();
},//获取颜色后实例化7种图像
buildbody(goal){
cc.log('实例化：'+goal)
if(goal===0){this.prefab=this.rect0;}
if(goal===1){this.prefab=this.rect1;}
if(goal===2){this.prefab=this.rect2;}
if(goal===3){this.prefab=this.rect3;}
if(goal===4){this.prefab=this.rect4;}
if(goal===5){this.prefab=this.rect5;}
if(goal===6){this.prefab=this.rect6;}
this.type=goal;
this.rectyi=cc.instantiate(this.prefab).getComponent('rect');
this.recter=cc.instantiate(this.prefab).getComponent('rect');
this.rectsan=cc.instantiate(this.prefab).getComponent('rect');
this.rectsi=cc.instantiate(this.prefab).getComponent('rect');
this.point=cc.instantiate(this.basepoint).getComponent('move');
var box=cc.find('Canvas/box');
box.addChild(this.point.node);
box.addChild(this.rectyi.node);
box.addChild(this.recter.node);
box.addChild(this.rectsan.node);
box.addChild(this.rectsi.node);
this.xingtai=0;
this.schedule(this.down,this.speed);//速度
通过计时器，每个speed间隔下落一次
},
down(){
if(this.gamestate===0){
this.i--;
this.choose();
//this.scheduleOnce(this.check,0.1);
this.check();
}
},
choose(){
if(this.type===0){this.buildone();}
if(this.type===1){this.buildtwo();}
if(this.type===2){this.buildthree();}
if(this.type===3){this.buildfour();}
if(this.type===4){this.buildfive();}
if(this.type===5){this.buildsix();}
if(this.type===6){this.buildseven();}
},
6.3七种图片和19种旋转形态的预存储和位置更新
buildone(){//一号图形
var i=this.i;varj=this.j;
this.rectyi.node.x=j*60;this.rectyi.node.y=i*60;
this.recter.node.x=(j+1)*60;this.recter.node.y=i*60
this.rectsan.node.x=j*60;this.rectsan.node.y=(i+1)*60;
this.rectsi.node.x=(j+1)*60;this.rectsi.node.y=(i+1)*60;
this.jmix=j;this.jmax=j+1;
this.one[0]=i; this.two[0]=j; this.three[0]=1;//this.four[0]=1;this.five[0]=0;
this.one[1]=i; this.two[1]=j+1;this.three[1]=1;//this.four[1]=0;this.five[1]=1;
this.one[2]=i+1;this.two[2]=j; this.three[2]=0;//this.four[2]=1;this.five[2]=0;
this.one[3]=i+1;this.two[3]=j+1;this.three[3]=0;//this.four[3]=0;this.five[3]=1;
},
buildtwo(){//二号图形
var i=this.i;varj=this.j;
if(this.xingtai===2){this.xingtai=0}
if(this.xingtai===0){
this.rectyi.node.x=j*60;this.rectyi.node.y=(i+1)*60;
this.recter.node.x=j*60;this.recter.node.y=i*60
this.rectsan.node.x=(j-1)*60;this.rectsan.node.y=i*60;
this.rectsi.node.x=(j-1)*60;this.rectsi.node.y=(i-1)*60;
this.jmix=j-1;this.jmax=j;
this.one[0]=i+1;this.two[0]=j; this.three[0]=0;//this.four[0]=1;this.five[0]=1;
this.one[1]=i; this.two[1]=j; this.three[1]=1;//this.four[1]=0;this.five[1]=1;
this.one[2]=i; this.two[2]=j-1;this.three[2]=0;//this.four[2]=1;this.five[2]=0;
this.one[3]=i-1;this.two[3]=j-1;this.three[3]=1;//this.four[3]=1;this.five[3]=1;
}
if(this.xingtai===0&&this.jmax===8){this.out=-1};//出图的归位
if(this.xingtai===1){
this.rectyi.node.x=j*60;this.rectyi.node.y=(i)*60;
this.recter.node.x=(j-1)*60;this.recter.node.y=(i+1)*60
this.rectsan.node.x=(j)*60;this.rectsan.node.y=(i+1)*60;
this.rectsi.node.x=(j+1)*60;this.rectsi.node.y=(i)*60;
this.jmix=j-1;this.jmax=j+1;
this.one[0]=i; this.two[0]=j; this.three[0]=0;//this.four[0]=1;this.five[0]=0;
this.one[1]=i+1;this.two[1]=j-1;this.three[1]=1;//this.four[1]=1;this.five[1]=0;
this.one[2]=i+1;this.two[2]=j; this.three[2]=0;//this.four[2]=0;this.five[2]=1;
this.one[3]=i; this.two[3]=j+1;this.three[3]=1;//this.four[3]=0;this.five[3]=1;
}
},
buildthree(){//三号
var i=this.i;varj=this.j;
if(this.xingtai===4){this.xingtai=0}
if(this.xingtai===0){
this.rectyi.node.x=(j-1)*60;this.rectyi.node.y=i*60;
this.recter.node.x=(j-1)*60;this.recter.node.y=(i+1)*60;
this.rectsan.node.x=(j)*60;this.rectsan.node.y=(i+1)*60;
this.rectsi.node.x=(j+1)*60;this.rectsi.node.y=(i+1)*60;
this.jmix=j-1;this.jmax=j+1;
this.one[0]=i; this.two[0]=j-1;this.three[0]=1;//this.four[0]=1;this.five[0]=1;
this.one[1]=i+1;this.two[1]=j-1;this.three[1]=0;//this.four[1]=1;this.five[1]=0;
this.one[2]=i+1;this.two[2]=j; this.three[2]=1;//this.four[2]=0;this.five[2]=0;
this.one[3]=i+1;this.two[3]=j+1;this.three[3]=1;//this.four[3]=0;this.five[3]=1;
}
if(this.xingtai===1){
this.rectyi.node.x=(j)*60;this.rectyi.node.y=(i+1)*60;
this.recter.node.x=(j+1)*60;this.recter.node.y=(i+1)*60;
this.rectsan.node.x=(j+1)*60;this.rectsan.node.y=(i)*60;
this.rectsi.node.x=(j+1)*60;this.rectsi.node.y=(i-1)*60;
this.jmix=j;this.jmax=j+1;
this.one[0]=i+1;this.two[0]=j; this.three[0]=1;//this.four[0]=1;this.five[0]=0;
this.one[1]=i+1;this.two[1]=j+1;this.three[1]=0;//this.four[1]=0;this.five[1]=1;
this.one[2]=i; this.two[2]=j+1;this.three[2]=0;//this.four[2]=1;this.five[2]=1;
this.one[3]=i-1;this.two[3]=j+1;this.three[3]=1;//this.four[3]=1;this.five[3]=1;
}
if(this.xingtai===2){
this.rectyi.node.x=(j+1)*60;this.rectyi.node.y=(i)*60;
this.recter.node.x=(j+1)*60;this.recter.node.y=(i-1)*60;
this.rectsan.node.x=(j)*60;this.rectsan.node.y=(i-1)*60;
this.rectsi.node.x=(j-1)*60;this.rectsi.node.y=(i-1)*60;
this.jmix=j-1;this.jmax=j+1;
this.one[0]=i; this.two[0]=j+1;this.three[0]=0;//this.four[0]=1;this.five[0]=1;
this.one[1]=i-1;this.two[1]=j+1;this.three[1]=1;//this.four[1]=0;this.five[1]=1;
this.one[2]=i-1;this.two[2]=j; this.three[2]=1;//this.four[2]=0;this.five[2]=0;
this.one[3]=i-1;this.two[3]=j-1;this.three[3]=1;//this.four[3]=1;this.five[3]=0;
}
if(this.xingtai===3){
this.rectyi.node.x=(j)*60;this.rectyi.node.y=(i-1)*60;
this.recter.node.x=(j-1)*60;this.recter.node.y=(i-1)*60;
this.rectsan.node.x=(j-1)*60;this.rectsan.node.y=(i)*60;
this.rectsi.node.x=(j-1)*60;this.rectsi.node.y=(i+1)*60;
this.jmix=j-1;this.jmax=j;
this.one[0]=i-1;this.two[0]=j; this.three[0]=1;
this.one[1]=i-1;this.two[1]=j-1;this.three[1]=1;
this.one[2]=i; this.two[2]=j-1;this.three[2]=0;
this.one[3]=i+1;this.two[3]=j-1;this.three[3]=0;
}
if(this.xingtai===1&&this.jmix===0){this.out=1};//出图的归位
if(this.xingtai===3&&this.jmax===9){this.out=-1};//出图的归位
},
buildfour(){//四号
var i=this.i;varj=this.j;
if(this.xingtai===4){this.xingtai=0}
if(this.xingtai===0){
this.rectyi.node.x=(j-1)*60;this.rectyi.node.y=i*60;
this.recter.node.x=(j-1)*60;this.recter.node.y=(i-1)*60
this.rectsan.node.x=(j)*60;this.rectsan.node.y=(i-1)*60;
this.rectsi.node.x=(j+1)*60;this.rectsi.node.y=(i-1)*60;
this.jmix=j-1;this.jmax=j+1;
this.one[0]=i ;this.two[0]=j-1;this.three[0]=0;
this.one[1]=i-1;this.two[1]=j-1;this.three[1]=1;
this.one[2]=i-1;this.two[2]=j; this.three[2]=1;
this.one[3]=i-1;this.two[3]=j+1;this.three[3]=1;
}
if(this.xingtai===1){
this.rectyi.node.x=(j)*60;this.rectyi.node.y=(i+1)*60;
this.recter.node.x=(j-1)*60;this.recter.node.y=(i+1)*60
this.rectsan.node.x=(j-1)*60;this.rectsan.node.y=(i)*60;
this.rectsi.node.x=(j-1)*60;this.rectsi.node.y=(i-1)*60;
this.jmix=j-1;this.jmax=j;
this.one[0]=i+1;this.two[0]=j ;this.three[0]=1;
this.one[1]=i+1;this.two[1]=j-1;this.three[1]=0;
this.one[2]=i ;this.two[2]=j-1;this.three[2]=0;
this.one[3]=i-1;this.two[3]=j-1;this.three[3]=1;
}
if(this.xingtai===2){
this.rectyi.node.x=(j+1)*60;this.rectyi.node.y=(i)*60;
this.recter.node.x=(j+1)*60;this.recter.node.y=(i+1)*60
this.rectsan.node.x=(j)*60;this.rectsan.node.y=(i+1)*60;
this.rectsi.node.x=(j-1)*60;this.rectsi.node.y=(i+1)*60;
this.jmix=j-1;this.jmax=j+1;
this.one[0]=i; this.two[0]=j+1;this.three[0]=1;
this.one[1]=i+1;this.two[1]=j+1;this.three[1]=0;
this.one[2]=i+1;this.two[2]=j; this.three[2]=1;
this.one[3]=i+1;this.two[3]=j-1;this.three[3]=1;
}
if(this.xingtai===3){
this.rectyi.node.x=(j+1)*60;this.rectyi.node.y=(i+1)*60;
this.recter.node.x=(j+1)*60;this.recter.node.y=(i)*60
this.rectsan.node.x=(j+1)*60;this.rectsan.node.y=(i-1)*60;
this.rectsi.node.x=(j)*60;this.rectsi.node.y=(i-1)*60;
this.jmix=j;this.jmax=j+1;
this.one[0]=i+1;this.two[0]=j+1;this.three[0]=0;
this.one[1]=i; this.two[1]=j+1;this.three[1]=0;
this.one[2]=i-1;this.two[2]=j+1;this.three[2]=1;
this.one[3]=i-1;this.two[3]=j; this.three[3]=1;
}
if(this.xingtai===3&&this.jmix===0){this.out=1};//出图的归位
if(this.xingtai===1&&this.jmax===9){this.out=-1};//出图的归位
},
buildfive(){//五号
var i=this.i;varj=this.j;
if(this.xingtai===2){this.xingtai=0}
if(this.xingtai===0){
this.rectyi.node.x=j*60;this.rectyi.node.y=i*60;
this.recter.node.x=j*60;this.recter.node.y=(i+1)*60
this.rectsan.node.x=(j+1)*60;this.rectsan.node.y=(i-1)*60;
this.rectsi.node.x=(j+1)*60;this.rectsi.node.y=(i)*60;
this.jmix=j;this.jmax=j+1;
this.one[0]=i; this.two[0]=j; this.three[0]=1;
this.one[1]=i+1;this.two[1]=j; this.three[1]=0;
this.one[2]=i-1;this.two[2]=j+1;this.three[2]=1;
this.one[3]=i; this.two[3]=j+1;this.three[3]=0;
}
if(this.xingtai===1){
this.rectyi.node.x=j*60;this.rectyi.node.y=i*60;
this.recter.node.x=(j+1)*60;this.recter.node.y=(i)*60
this.rectsan.node.x=(j)*60;this.rectsan.node.y=(i-1)*60;
this.rectsi.node.x=(j-1)*60;this.rectsi.node.y=(i-1)*60;
this.jmix=j-1;this.jmax=j+1;
this.one[0]=i; this.two[0]=j; this.three[0]=0;
this.one[1]=i; this.two[1]=j+1;this.three[1]=0;
this.one[2]=i-1;this.two[2]=j; this.three[2]=1;
this.one[3]=i-1;this.two[3]=j-1;this.three[3]=1;
}
if(this.xingtai===0&&this.jmix===0){this.out=1};//出图的归位
},
buildsix(){//六号
var i=this.i;varj=this.j;
if(this.xingtai===2){this.xingtai=0}
if(this.xingtai===0){
this.rectyi.node.x=j*60;this.rectyi.node.y=(i+1)*60;
this.recter.node.x=j*60;this.recter.node.y=(i)*60
this.rectsan.node.x=(j)*60;this.rectsan.node.y=(i-1)*60;
this.rectsi.node.x=(j)*60;this.rectsi.node.y=(i-2)*60;
this.jmix=j;this.jmax=j;
this.one[0]=i+1;this.two[0]=j;this.three[0]=0;
this.one[1]=i; this.two[1]=j;this.three[1]=0;
this.one[2]=i-1;this.two[2]=j;this.three[2]=0;
this.one[3]=i-2;this.two[3]=j;this.three[3]=1;
}
if(this.xingtai===1){
this.rectyi.node.x=j*60;this.rectyi.node.y=i*60;
this.recter.node.x=(j-1)*60;this.recter.node.y=(i)*60
this.rectsan.node.x=(j+1)*60;this.rectsan.node.y=(i)*60;
this.rectsi.node.x=(j-2)*60;this.rectsi.node.y=(i)*60;
this.jmix=j-2;this.jmax=j+1;
this.one[0]=i;this.two[0]=j; this.three[0]=1;
this.one[1]=i;this.two[1]=j-1;this.three[1]=1;
this.one[2]=i;this.two[2]=j+1;this.three[2]=1;
this.one[3]=i;this.two[3]=j-2;this.three[3]=1;
}
if(this.xingtai===0&&this.jmax===9){this.out=-1};//出图的归位
if(this.xingtai===0&&this.jmix===1){this.out=1};//出图的归位
if(this.xingtai===0&&this.jmix===0){this.out=2};//出图的归位
},
buildseven(){//七号
var i=this.i;varj=this.j;
if(this.xingtai===4){this.xingtai=0}
if(this.xingtai===0){
this.rectyi.node.x=j*60;this.rectyi.node.y=i*60;
this.recter.node.x=(j-1)*60;this.recter.node.y=(i)*60
this.rectsan.node.x=(j+1)*60;this.rectsan.node.y=(i)*60;
this.rectsi.node.x=(j)*60;this.rectsi.node.y=(i+1)*60;
this.jmix=j-1;this.jmax=j+1;
this.one[0]=i; this.two[0]=j; this.three[0]=1;
this.one[1]=i; this.two[1]=j-1;this.three[1]=1;
this.one[2]=i; this.two[2]=j+1;this.three[2]=1;
this.one[3]=i+1;this.two[3]=j; this.three[3]=0;
}
if(this.xingtai===1){
this.rectyi.node.x=j*60;this.rectyi.node.y=i*60;
this.recter.node.x=(j+1)*60;this.recter.node.y=(i)*60;
this.rectsan.node.x=(j)*60;this.rectsan.node.y=(i-1)*60;
this.rectsi.node.x=(j)*60;this.rectsi.node.y=(i+1)*60;
this.jmix=j; this.jmax=j+1;
this.one[0]=i; this.two[0]=j; this.three[0]=0;
this.one[1]=i; this.two[1]=j+1;this.three[1]=1;
this.one[2]=i-1;this.two[2]=j; this.three[2]=1;
this.one[3]=i+1;this.two[3]=j; this.three[3]=0;
}
if(this.xingtai===2){
this.rectyi.node.x=j*60;this.rectyi.node.y=i*60;
this.recter.node.x=(j+1)*60;this.recter.node.y=(i)*60;
this.rectsan.node.x=(j-1)*60;this.rectsan.node.y=(i)*60;
this.rectsi.node.x=(j)*60;this.rectsi.node.y=(i-1)*60;
this.jmix=j-1;this.jmax=j+1;
this.one[0]=i; this.two[0]=j; this.three[0]=0;
this.one[1]=i; this.two[1]=j+1;this.three[1]=1;
this.one[2]=i; this.two[2]=j-1;this.three[2]=1;
this.one[3]=i-1;this.two[3]=j; this.three[3]=1;
}
if(this.xingtai===3){
this.rectyi.node.x=j*60;this.rectyi.node.y=i*60;
this.recter.node.x=(j)*60;this.recter.node.y=(i+1)*60;
this.rectsan.node.x=(j-1)*60;this.rectsan.node.y=(i)*60;
this.rectsi.node.x=(j)*60;this.rectsi.node.y=(i-1)*60;
this.jmix=j-1;this.jmax=j;
this.one[0]=i ;this.two[0]=j; this.three[0]=0;
this.one[1]=i+1;this.two[1]=j; this.three[1]=0;
this.one[2]=i; this.two[2]=j-1;this.three[2]=1;
this.one[3]=i-1;this.two[3]=j; this.three[3]=1;
}
if(this.xingtai===1&&this.jmix===0){this.out=1};//出图的归位
if(this.xingtai===3&&this.jmax===9){this.out=-1};//出图的归位
},
6.4键盘监听，控制图片的移动和旋转,和触摸监听
onKeyDown (event) {
switch(event.keyCode) {
casecc.KEY.a:
casecc.KEY.left:
if(this.jmix>=1){
this.sidemath();
this.leftside();
this.choose();
}
break;
casecc.KEY.d:
casecc.KEY.right:
if(this.jmax<=8){
this.sidemath();
this.rightside();
this.choose();
}
break;
casecc.KEY.w:
casecc.KEY.up:
this.j+=this.out;
this.choose();
varorixingtai=this.xingtai;
cc.log('变换前的形态'+this.xingtai);
this.xingtai++;
this.choose();
//检查有没有重合
for(leti=0;i<4;i++){
if(this.box[this.one[i]][this.two[i]]===1){
cc.log('检查重合');
this.xingtai=orixingtai;
this.j-=this.out;
this.choose();
cc.log('返回前一步');
}
}
this.out=0;
break;
}
},
触摸监听代码
ontouchmove(){
var self =this;
self.node.on(cc.Node.EventType.TOUCH_START, function (event) {
var touches= event.getTouches();
vartouchLoc = touches[0].getLocation();
self.touchx=touchLoc.x;
}, self.node);
self.node.on(cc.Node.EventType.TOUCH_MOVE, function (event) {
var touches= event.getTouches();
var touchLoc = touches[0].getLocation();
}, self.node);
self.node.on(cc.Node.EventType.TOUCH_END, function (event) {
cc.log('触摸结束')
cc.log('触摸起始点'+self.touchx)
var touches= event.getTouches();
vartouchLoc = touches[0].getLocation();
cc.log('触摸结束点'+touchLoc.x)
if(self.touchx===touchLoc.x){
self.j+=self.out;
self.choose();
varorixingtai=self.xingtai;
self.xingtai++;
self.choose();
//检查有没有重合
for(leti=0;i<4;i++){
if(self.box[self.one[i]][self.two[i]]===1){
self.xingtai=orixingtai;
self.j-=self.out;
self.choose();
}
}
self.out=0;
}
if(self.touchx if(self.jmax<=8){ self.sidemath(); self.rightside(); self.choose(); } } if(self.touchx>touchLoc.x){ if(self.jmix>=1){ self.sidemath(); self.leftside(); self.choose(); } } }, self.node); }, 由于边界碰撞检测前文提及没有规范数组横向坐标。使用了像素坐标点，预存储在代码中，同时，旋转出界的检测判定，由于旋转中心点选择合理，计算量少，也做了预先存储操作。使用的是左侧补充偏移量，右侧减少偏移量的方法，重制回游戏区域中。这之中用到了this.xingtai同一图片的旋转类型、 this.out出界偏移量 、this.xmix最大边界、this.xmin最小边界等全局变量。在预存储的代码中可以查询到。 check(){ for(let i=0;i if(this.three[i]===1){ if(this.box[this.one[i]-1][this.two[i]]===1){ this.box[this.one[0]][this.two[0]]=1; this.box[this.one[1]][this.two[1]]=1; this.box[this.one[2]][this.two[2]]=1; this.box[this.one[3]][this.two[3]]=1; this.rectyi.node.name =this.one[0].toString()+this.two[0].toString(); //cc.log('节点名：'+this.rectyi.node.name); this.recter.node.name =this.one[1].toString()+this.two[1].toString(); //cc.log('节点名：'+this.recter.node.name ); this.rectsan.node.name=this.one[2].toString()+this.two[2].toString(); //cc.log('节点名：'+this.rectsan.node.name); this.rectsi.node.name =this.one[3].toString()+this.two[3].toString(); //cc.log('节点名：'+this.rectsi.node.name); this.unschedule(this.down); this.setcolour(); break;//防止以上三个用法被多次循环调用 } } } this.cleancheck(); //this.one.length=0; //this.two.length=0; //this.three.length=0; this.arry.length=0; }, sidemath(){//除重：i var num=0; this.arry[0]=this.one[0]; for(leti=1;i<4;i++){ for(letj=0;j if(this.arry[j]!==this.one[i]){ num++ if(num===this.arry.length){ this.arry.push(this.one[i]);//后期有一个归0操作 } } } num=0; } }, leftside(){ var num=0; var mix=100; for(leti=0;i for(letj=0;j<4;j++){ if(this.arry[i]===this.one[j]){ mix=Math.min(mix,this.two[j]); } } if(this.box[this.arry[i]][mix-1]!==1){ num++//成立才可以左移 } mix=100; } if(this.arry.length===num){ this.j--; } }, rightside(){ var num=0 var max=-1; for(leti=0;i for(letj=0;j<4;j++){ if(this.arry[i]===this.one[j]){ max=Math.max(max,this.two[j]); } } if(this.box[this.arry[i]][max+1]!==1){ num++ //成立才可以右移 } max=-1; } if(this.arry.length===num){ this.j++; } }, for(let i=0;i<4;i++){ if(this.box[this.one[i]][this.two[i]]===1){ cc.log('检查重合'); this.xingtai=orixingtai; this.j-=this.out; this.choose(); cc.log('返回前一步'); } } ui关联、得分等一系列function //ui gameover(){ for(letj=0;j<10;j++){ if(this.box[20][j]===1){ cc.audioEngine.stop(this.audio); this.gamestate=0; this.over.active=true; this.gamestype(); } } }, regame(){ cc.director.loadScene("russsia"); }, addscore(){ this.scorenum+=100; this.score.string=this.scorenum; }, drawnext(){ this.nextgoal=Math.floor(7*Math.random()); varnext=cc.find('Canvas/kuang1/shownext/next').getComponent('shownext'); next.init(this.nextgoal); }, gamestype(){ if(this.gamestate===1){ var self =this; cc.loader.loadRes('play',cc.SpriteFrame,function(err, spriteFrame){ self.button.getComponent(cc.Sprite).spriteFrame = spriteFrame; }); self.gamestate=0; self.schedule(self.down,self.speed);//速度 }elseif(this.gamestate===0){ var self =this; cc.loader.loadRes('stop',cc.SpriteFrame,function(err, spriteF){ self.button.getComponent(cc.Sprite).spriteFrame = spriteF; }); self.gamestate=1; self.unschedule(self.down); } }, movespeed(){ this.speed=0.2+0.8*this.sliderv.progress; } for(let i=0;i<4;i++){ if(this.box[this.one[i]][this.two[i]]===1){ this.i++; this.choose(); } } 7种基本图形。19种旋转。做好这19个图形，对19个图形做好游戏控制和操作，管理到每个小方块，做好消行的准备，其实俄罗斯方块游戏就出来啦～ 感觉自己好不负责任。。 链接: https://pan.baidu.com/s/1pL1yEMn 密码: 8pwf6.5边界碰撞检测
6.6下落检测
6.7左右移动检测
6.8旋转归位检测
6.9移动时降落反应的延迟导致重叠检