1 /*
  2  * 本层拥有处理星星的实例化以及对星星的操作
  3  * 1/排列星星
  4  * 2/移动和删除星星
  5  */
  6 var GAMESTARLAYOUT;
  7 var GameStarLayout = ccui.Layout.extend(
  8 {
  9     size:null,
 10     starArr:[],//存放点击与被点击状态的星星资源
 11     starObjArr:[],//存放游戏中星星的二位数组
 12     firstTouchStar:null,//第一次选择的星星,用于判断两次选择的星星颜色是否一致
 13     isSelected:false,//是否选择星星,如果已选择则再次点击将星星消灭
 14     starList:[],//相连同色星星列表
 15     starNum:0,//当前关卡星星个数
 16     ctor:function()
 17     {
 18         this._super();
 19         this.zinit();
 20         this.layoutStar();
 21     },
 22     //将星星按10*10的矩阵排列出来
 23     layoutStar:function()
 24     {
 25         for(var i = 0; i < 10; i++)
 26         {
 27             for(var j = 0; j < 10; j++)
 28             {
 29                 //随机从5种不同颜色的星星中选择一个
 30                 var randomNumber = Math.floor(Math.random()*this.starNum);
 31                 var starResource = this.starArr[randomNumber];
 32                 var star = new GameCreateStar(starResource.normal, starResource.id,starResource.selected, i, j);
 33                 this.addChild(star, 0);
 34                 //星星出现的动画
 35                 var moveTo = cc.moveTo(i/10, cc.p(star.width*i, star.height*j));
 36                 star.runAction(moveTo);
 37                 //将星星装到数组中
 38                 this.starObjArr[i][j] = star;
 39                 //给每一个星星注册侦听器
 40                 star.addTouchEventListener(this.onTouchStarFunc, this);
 41             }
 42         }
 43     },
 44     //星星触摸侦听函数
 45     onTouchStarFunc:function(target, state)
 46     {
 47         if(state == ccui.Widget.TOUCH_ENDED)    //松开
 48         {
 49             if(!this.firstTouchStar)    //如果第一次选择的星星为空,则将当前星星赋给它
 50             {
 51                 this.firstTouchStar = target;
 52                 this.findSameColorStar(target);
 53                 //如果计分动作未完成则结束动作,取消定时器
 54                 GAMETOP.cancelSchedule();
 55             }
 56             else
 57             {
 58                 if(this.starList.length <1){return;} //确保相连同色星星列表不为空,代码才会向下执行
 59                 if(this.starList[0].count != target.count) //第二次点击的不是上一次选择的星星
 60                 {
 61                     //将列表中的星星type还原
 62                     this.setStarListItemToNomal(this.starList);
 63                     this.findSameColorStar(target);
 64                 }
 65                 else    //第二次点击相连同色星星列表中的星星
 66                 {
 67                     if(this.starList.length >1)
 68                     {
 69                         this.firstTouchStar = null;
 70                         this.getScore();
 71                         this.resetStarRow();
 72                     }
 73                 }
 74             }
 75         }
 76     },
 77     //消灭信息获得积分
 78     getScore:function()
 79     {
 80         //GAMETOP对象为GameTopInformation的实例;
 81         GAMETOP.updateGameScore(this.starList);
 82     },
 83     //当消灭星星后,如果上方还有星星存在,则要重新设置他们的row值,用于向下移动星星
 84     resetStarRow:function()
 85     {
 86         for(var i = 0; i < this.starList.length; i++)
 87         {
 88             this.starList[i].type = -1;
 89             this.starList[i].removeFromParent();
 90             for(var j = this.starList[i].row+1; j< 10; j++)
 91             {
 92                 if(!this.starObjArr[this.starList[i].col][j]){continue;}
 93                 this.starObjArr[this.starList[i].col][j].row--;
 94                 this.starObjArr[this.starList[i].col][j-1] = this.starObjArr[this.starList[i].col][j];
 95                 this.starObjArr[this.starList[i].col][j] = null;
 96             }
 97         }
 98     },
 99     //消灭相连在一起的同色星星
100     removeSameColorStar:function()
101     {
102         for(var i = 0; i < this.starList.length; i++)
103         {
104             //this.starObjArr是二维数组
105             for(var j = 0; j < this.starObjArr.length; j++)
106             {
107                 for(var k = 0; k < this.starObjArr.length; k++)
108                 {
109                     if(!this.starObjArr[j][k]){continue;}
110                     if(this.starObjArr[j][k].col == this.starList[i].col && this.starObjArr[j][k].row == this.starList[i].row)
111                     {
112                         this.starObjArr[j][k].removeFromParent();
113                     }
114                 }
115             }
116         }
117         this.starList.splice(0);
118     },
119     //逐帧监听器,在游戏过程中一直执行
120     update:function()
121     {
122         //检测是否有需要移动的星星(上边的向下移动,右边的向左边移动
123         this.checkMove();
124     },
125     //检测是否有需要移动的星星,如果被消除的星星上方还有星星,则上方的需要掉下来,如果这一列为空了且右边还有星星,则右边的需要往做移动
126     checkMove:function()
127     {
128         //检测上方
129         this.checkTop();
130     },
131     //检测被移除星星上方是否还有星星,如果有则下移
132     checkTop:function()
133     {
134         var needMove = false;
135         for(var i = 0; i < 10; i++)
136         {
137             for(var j = 0; j < 10; j++)
138             {
139                 if(this.starObjArr[i][j] !=null && this.starObjArr[i][j].type != -1)
140                 {
141                     //向下移动
142                     if(this.starObjArr[i][j].y > this.starObjArr[i][j].row*48)
143                     {
144                         this.starObjArr[i][j].y -= 8;
145                         needMove = true;
146                     }
147                     //向左移动
148                     if(this.starObjArr[i][j].x > this.starObjArr[i][j].col*48)
149                     {
150                         this.starObjArr[i][j].x -= 8;
151                         needMove = true;
152                     }
153                 }
154             }
155         }
156         //当有星星向下移动时,不能移动列
157         if(!needMove)
158         {
159             //检测是否有空列,如果有则把其右边的列向左移动
160             this.checkEmptyColums();
161         }
162     },
163     //检测空列
164     checkEmptyColums:function()
165     {
166         var existEmptyCol = false;
167         for(var i = 0; i < 10; i++)
168         {
169             if(!existEmptyCol)
170             {
171                 //只有在消灭星星后才能检测空列
172                 if(this.firstTouchStar == null)
173                 {
174                     //当列的最下面元素为空时,说明该列为空
175                     if(this.starObjArr[i][0] == null || this.starObjArr[i][0].type == -1)
176                     {
177                         existEmptyCol = true;
178                     }
179                 }
180             }
181             //当有空列时,处理列的移动和col属性的设置
182             else if(existEmptyCol)
183             {
184                 for(var j = 0; j < 10; j++)
185                 {
186                     if(this.starObjArr[i][j] != null )
187                     {
188                         this.starObjArr[i][j].col--;
189                         this.starObjArr[i-1][j] = this.starObjArr[i][j];
190                         this.starObjArr[i][j] = null;
191                     }
192                 }
193             }
194         }
195     },
196     //寻找相连在一起同色的星星
197     findSameColorStar:function(target)
198     {
199         //相连同色星星列表
200         this.starList.splice(0);    //将列表清空
201         this.starList = this.getSameColorStar(target.col, target.row, target.type);
202         //将满足条件的相连同色星星设为选中状态,玩家能对消除星星数量一幕了然
203         this.showCurrentSameStarSelectedState(this.starList);
204     },
205     //如果两次选择的不是同种颜色的星星,则将之前选择的星星设为初始状态
206     setStarListItemToNomal:function(starList)
207     {
208         for(var i = 0; i < starList.length; i++)
209         {
210             //还原列表中星星的初始type值
211             starList[i].type = starList[i].normalType;
212             starList[i].isSelected = false;
213             starList[i].updateTexture();
214             starList[i].count = 0;
215         }
216     },
217     //将满足条件的相连同色星星设为选中状态
218     showCurrentSameStarSelectedState:function(starList)
219     {
220         for(var i = 0; i < starList.length; i++)
221         {
222             starList[i].isSelected = true;
223             starList[i].updateTexture();
224             starList[i].count++;
225         }
226     },
227     //获得相连同色星星列表
228     getSameColorStar:function(col, row, type)
229     {
230         var starList = [];
231         //星星必须在矩阵范围内(9X9)
232         if(this.jugementStarPostion(col, row) == -1)
233         {
234             return starList;
235         }
236         if(this.starObjArr[col][row].type == type)
237         {
238             starList.push(this.starObjArr[col][row]);
239             this.starObjArr[col][row].type = -1;
240             //递归调用,寻找当前星星四周的同色星星
241             starList = starList.concat(this.getSameColorStar(col+1, row, type));//右边
242             starList = starList.concat(this.getSameColorStar(col - 1, row, type));//左边
243             starList = starList.concat(this.getSameColorStar(col, row + 1, type));//上方
244             starList = starList.concat(this.getSameColorStar(col, row - 1, type));//下方
245         }
246         return starList;
247     },
248     //判断col,row值是否在矩阵范围内,
249     jugementStarPostion:function(col, row)
250     {
251         if(col < 0 ||col >9)    //超出水平范围
252         {
253             return -1;
254         }
255         if(row < 0 || row > 9) //超出垂直范围
256         {
257             return -1;
258         }
259         if(this.starObjArr[col][row] == null || this.starObjArr[col][row] == undefined)    //该对象不存在
260         {
261             return -1;
262         }
263         return this.starObjArr[col][row].type;
264     },
265     //检测游戏结束当没有可以消除的星星时游戏宣布结束
266     checkGameOver:function()
267     {
268         //遍历所有的星星
269         for(var i = 0; i < 10; i++)
270         {
271             for(var j = 0; j < 10; j++)
272             {
273                 var starType = this.jugementStarPostion(i, j);
274                 if(starType == -1){continue;}//不存在星星,则继续下一次循环(当starType =-1时表示该位置没有星星)
275                 if(starType == this.jugementStarPostion(i, j+1)){return;}//同理
276                 if(starType == this.jugementStarPostion(i+1, j)){return;}//当相邻有相同颜色星星时还回(因为是遍历每一个星星,所以水平方向只需要检测星星相邻右侧是否有相同颜色的就可以了)
277             }
278         }
279         //当没有相同颜色的星星时,宣布游戏结束
280         this.endGame();
281     },
282     //游戏结束
283     endGame:function()
284     {
285         //未通关,还回游戏初始界面
286         if(GAMETOP.intermediaryScore < GAMETOP.standardScore)
287         {
288             GAMETOP.passedLevelEffect(res.fail);
289             var delayTime = cc.DelayTime.create(2.2);
290             var callFunc = cc.CallFunc.create(function()
291             {
292                 PlayerLocalData.deleteItem();//删除游戏纪录
293                 var newGameScene = GameInitializeScene.createScene();
294                 cc.director.runScene(cc.TransitionFade.create(1, newGameScene));
295             }, this);
296             this.runAction(cc.Sequence.create(delayTime, callFunc));
297         }
298         else//通过,弹出继续游戏和保存退出按钮
299         {
300             var endX = 240;
301             var endY = 850;
302             var b = 400;
303             var c = 330;
304             //继续游戏
305             var continueGameBtn = new myButton(res.resume);
306             continueGameBtn.setAnchorPoint(0.5, 0.5);
307             continueGameBtn.name = "continueGame";
308             continueGameBtn.x = endX;
309             continueGameBtn.y = endY
310             this.addChild(continueGameBtn, 1);
311             //action2
312             var moveTo2 = cc.MoveTo.create(4, cc.p(endX, b));
313             var easeOut2 = moveTo2.clone().easing(cc.easeElasticOut());
314             continueGameBtn.runAction(easeOut2);
315             //保存退出
316             var saveAndOut = new myButton("img/saveexit.png");
317             saveAndOut.setAnchorPoint(0.5, 0.5);
318             saveAndOut.name = "save";
319             saveAndOut.x = endX;
320             saveAndOut.y = endY;
321             this.addChild(saveAndOut, 1);
322             //action3
323             var moveTo3 = cc.MoveTo.create(3, cc.p(endX, c));
324             var easeOut3 = moveTo3.clone().easing(cc.easeElasticOut());
325             saveAndOut.runAction(easeOut3);
326
327             continueGameBtn.addTouchEventListener(this.btnControlGameFunc, this);
328             saveAndOut.addTouchEventListener(this.btnControlGameFunc, this);
329         }
330         cc.log("endGame "+"  **********************************************************")
331     },
332     //按钮侦听函数
333     btnControlGameFunc:function(target, state)
334     {
335         if(state == ccui.Widget.TOUCH_ENDED)//松开
336         {
337             switch (target.name)
338             {
339                 case "continueGame"://继续游戏
340                     var newGameScene = TransitionScene.createScene(false);
341                     cc.director.runScene(cc.TransitionFade.create(1, newGameScene));
342                     cc.log("newGame");
343                     break;
344
345                 case "save"://保存退出
346                     var newGameScene = GameInitializeScene.createScene();
347                     cc.director.runScene(cc.TransitionFade.create(1, newGameScene));
348                     break;
349
350                 default:
351                     break;
352             }
353         }
354     },
355     //初始化
356     zinit:function()
357     {
358         this.size = cc.size(480, 500);
359         GAMESTARLAYOUT = this;//对本类的引用对象
360         //设置层的大小
361         this.setSize(this.size);
362         //将星星资源存放到数字中
363         this.starArr = [
364                         {id:1, normal:res.star1, selected:res.star1s},
365                         {id:2, normal:res.star2, selected:res.star2s},
366                         {id:3, normal:res.star3, selected:res.star3s},
367                         {id:4, normal:res.star4, selected:res.star4s},
368                         {id:5, normal:res.star5, selected:res.star5s},
369                         {id:5, normal:res.star5, selected:res.star5s},
370                         {id:5, normal:res.star5, selected:res.star5s},
371                         {id:5, normal:res.star5, selected:res.star5s},
372                         {id:5, normal:res.star5, selected:res.star5s},
373                         {id:5, normal:res.star5, selected:res.star5s},
374                         {id:5, normal:res.star5, selected:res.star5s},
375                         {id:5, normal:res.star5, selected:res.star5s},
376                         {id:5, normal:res.star5, selected:res.star5s},
377                         {id:5, normal:res.star5, selected:res.star5s}
378                         ];
379         for(var i = 0; i < 10; i++)
380         {
381             this.starObjArr.push([]);
382         }
383         //开启侦听器,逐侦监听
384         this.scheduleUpdate();
385         this.playerGameData = playerGameData;//给玩家信息定义一个新的实例
386         this.levelNumber = this.playerGameData.currentLevel;//玩家达到的关卡数
387         //获得当前关卡的星星个数
388         for(var i = 0; i < levelData.length; i++)
389         {
390             if(this.levelNumber == levelData[i].level)
391             {
392                 this.starNum = levelData[i].starNumber;
393                 break;
394             }
395         }
396     }
397 });
398 //实例化
399 GameStarLayout.createLayout = function()
400 {
401     var starLayout = new GameStarLayout();
402     return starLayout;
403 };

转载于:https://www.cnblogs.com/zfsSuperDream/p/4080947.html

Cocos2d JS 之消灭星星(九) 处理星星类之——移动和消灭星星相关推荐

  1. 纯js 消灭星星游戏,js 消灭星星游戏实现原理,有道具的消灭星星

    消灭星星游戏的几个核心逻辑 用10*10的数组nums保存星星,1-5表示有星星,0表示已经消去 1.初始化,5种颜色的星星分配. 1-5 这个最容易,随机分配就好,产生1-100的随机数num,nu ...

  2. 让我摘下星星送给你_抖音想摘下星星给你是什么歌 星球坠落原唱是谁

    抖音上好看的小哥哥小姐姐们带火了一批又一批的bgm,甚至各大音乐软件上还有了抖音歌曲专栏.在这样的势头下,每当抖音火了某首歌曲,必然会以鸵鸟一般的速度传播开. 最近抖音上有一首叫"想摘下星星 ...

  3. JS学习笔记(九)深拷贝浅拷贝【Array、Object为例】

    JS学习笔记(九) 本系列更多文章,可以查看专栏 JS学习笔记 文章目录 JS学习笔记(九) 一.赋值&复制 二.浅拷贝(shallow copy) 1. 什么是浅拷贝 2. 数组的浅拷贝 ( ...

  4. 《JS权威指南学习总结--第九章 类和模板》

    内容要点: 一. 1.第六章详细介绍了JS对象,每个JS对象都是一个属性集合,相互之间没有任何联系.在JS中也可以定义对象的类,让每个对象都共享某些属性,这种"共享"的特性是非常有 ...

  5. js中的数据类型分为两大类分别是什么_数据类型有这么重要吗?

    一个没有得到重视的知识点, 数据类型 每种语言都有自己的数据类型,下面以javascript为例 类型的分类 js的数据类型可以分为 两大类: 1,值类型 (String,Number,undefin ...

  6. [js] 如何判断对象是否属于某个类?

    [js] 如何判断对象是否属于某个类? obj.proto === class.prototype 可以递归去找obj instanceof class 个人简介 我是歌谣,欢迎和大家一起交流前后端知 ...

  7. 返回值 包装类_(九)Java常用类

    (九)Java常用类 String类 概述 /*String:字符串,使用一对""来表示. * 1.String声明为final,不能被继承. * 2.String实现了Seria ...

  8. JS获取本机IP的工具类

    JS获取本机IP的工具类 /*** 获取ip地址*/ export function getUserIP(onNewIP) { // onNewIp - 回调函数//兼容for firefox and ...

  9. Java基础语法(九)——String类

    文章目录 Java基础语法(九)--String类 一.定义方式 二.内存 三.字符串比较相等 四.字符串常量池 (1) 直接赋值 (2)采用构造方法 (3)intern 的使用 五.理解字符串不可变 ...

最新文章

  1. matplotlib-plot-绘制折线图
  2. 华为定制版Linux镜像下载,华为OpenEuler体验系列(02)--定制支持NTFS的微型Linux启动盘...
  3. Angular源代码里字母Theta的含义
  4. 自动调试自动编译五分钟上手
  5. JDK源码解析之 Java.lang.Enum
  6. Python连接ActiveMQ的操作
  7. 微软解释:关于Outlook 2007的争议
  8. RDKit化学式 分子式搜索
  9. openlayer右键菜单_OpenLayers添加右键菜单
  10. c语言的加法和平均值程序,编写求一组整数的和与平均值的程序
  11. java循环速度比较_List的二种循环速度比较
  12. matlab 崎岖 视频的起始时间,怎么样给视频打马赛克 视频中打马赛克 视频某个时间段开始局部加马赛克 设置起始时间...
  13. Python如何实现图片显示
  14. PS照片换背景,证件照更换背景色
  15. 固态硬盘多大合适 php,固态硬盘写入寿命是多久
  16. win10下配置maven
  17. 网络 — MB/s、Mb/s、Mbps、Mbit/s、Kbps
  18. GBA火焰纹章改版-智慧的结晶2.0更新(发布)
  19. flume采集数据易出现的bug
  20. 微信JSSDK-录音接口,判断是否成功调用微信录音

热门文章

  1. IPython Notebook简介1
  2. GPU与CPU版本的矩阵乘法对比
  3. kali 设置中文字体
  4. HDU Problem - 5918 Sequence I
  5. Linux内核如何管理内存
  6. Linux下的shell语言编程入门
  7. 解决ubuntu中连接mysql时报错:Access denied for user ‘root‘@‘localhost‘
  8. 使用独立mysql_MYSQL建立独立数据库以及独立数据库用户详细教程,利用PHPstudy自带的MySQL-Front...
  9. ant基本标签 及import properties
  10. dynamic web module 2.5与2.4