Cocos2d JS 之消灭星星(八) 处理星星类之——消灭星星

  1 /*
  2  * 本层拥有处理星星的实例化以及对星星的操作
  3  * 1/排列星星
  4  * 2/移动和删除星星
  5  */
  6 var GameStarLayout = ccui.Layout.extend(
  7 {
  8     size:null,
  9     starArr:[],//存放点击与被点击状态的星星资源
 10     starObjArr:[],//存放游戏中星星的二位数组
 11     firstTouchStar:null,//第一次选择的星星,用于判断两次选择的星星颜色是否一致
 12     isSelected:false,//是否选择星星,如果已选择则再次点击将星星消灭
 13     starList:[],//相连同色星星列表
 14     ctor:function()
 15     {
 16         this._super();
 17         this.zinit();
 18         this.layoutStar();
 19     },
 20     //将星星按10*10的矩阵排列出来
 21     layoutStar:function()
 22     {
 23         for(var i = 0; i < 10; i++)
 24         {
 25             for(var j = 0; j < 10; j++)    
 26             {
 27                 //随机从5种不同颜色的星星中选择一个
 28                 var randomNumber = Math.floor(Math.random()*this.starArr.length);
 29                 var starResource = this.starArr[randomNumber];
 30                 var star = new GameCreateStar(starResource.normal, starResource.id,starResource.selected, i, j);
 31                 this.addChild(star, 0);
 32                 //星星出现的动画
 33                 var moveTo = cc.moveTo(i/10, cc.p(star.width*i, star.height*j));
 34                 star.runAction(moveTo);
 35                 //将星星装到数组中
 36                 this.starObjArr[i][j] = star;
 37                 //给每一个星星注册侦听器
 38                 star.addTouchEventListener(this.onTouchStarFunc, this);
 39             }
 40         }
 41     },
 42     //星星触摸侦听函数
 43     onTouchStarFunc:function(target, state)
 44     {
 45         if(state == ccui.Widget.TOUCH_ENDED)    //松开
 46         {
 47             if(!this.firstTouchStar)    //如果第一次选择的星星为空,则将当前星星赋给它
 48             {
 49                 this.firstTouchStar = target;
 50                 this.findSameColorStar(target);
 51             }
 52             else 
 53             {
 54                 if(this.starList.length <1){return;} //确保相连同色星星列表不为空,代码才会向下执行
 55                 if(this.starList[0].count != target.count) //第二次点击的不是上一次选择的星星
 56                 {
 57                     //将列表中的星星type还原
 58                     this.setStarListItemToNomal(this.starList);
 59                     this.findSameColorStar(target);
 60                 }
 61                 else    //第二次点击相连同色星星列表中的星星
 62                 {
 63                     this.firstTouchStar = null;
 64                     this.removeSameColorStar();
 65                 }
 66             }
 67         }
 68     },
 69     //消灭相连在一起的同色星星
 70     removeSameColorStar:function()
 71     {
 72         for(var i = 0; i < this.starList.length; i++)
 73         {
 74             //this.starObjArr是二维数组
 75             for(var j = 0; j < this.starObjArr.length; j++)
 76             {
 77                 for(var k = 0; k < this.starObjArr.length; k++)
 78                 {
 79                     if(this.starObjArr[j][k].col == this.starList[i].col && this.starObjArr[j][k].row == this.starList[i].row)
 80                     {
 81                         this.starObjArr[j][k].removeFromParent();
 82                     }
 83                 }
 84             }
 85         }
 86         this.starList.splice(0);
 87     },
 88     //寻找相连在一起同色的星星
 89     findSameColorStar:function(target)
 90     {
 91         //相连同色星星列表
 92         this.starList.splice(0);    //将列表清空
 93         this.starList = this.getSameColorStar(target.col, target.row, target.type);
 94         //将满足条件的相连同色星星设为选中状态,玩家能对消除星星数量一幕了然
 95         this.showCurrentSameStarSelectedState(this.starList);
 96     },
 97     //如果两次选择的不是同种颜色的星星,则将之前选择的星星设为初始状态
 98     setStarListItemToNomal:function(starList)
 99     {
100         for(var i = 0; i < starList.length; i++)
101         {
102             //还原列表中星星的初始type值
103             starList[i].type = starList[i].normalType;
104             starList[i].isSelected = false;
105             starList[i].updateTexture();
106             starList[i].count = 0;
107         }
108     },
109     //将满足条件的相连同色星星设为选中状态
110     showCurrentSameStarSelectedState:function(starList)
111     {
112         for(var i = 0; i < starList.length; i++)
113         {
114             starList[i].isSelected = true;
115             starList[i].updateTexture();
116             starList[i].count++;
117         }
118     },
119     //获得相连同色星星列表
120     getSameColorStar:function(col, row, type)
121     {
122         var starList = [];
123         //星星必须在矩阵范围内(9X9)
124         if(this.jugementStarPostion(col, row) == -1)
125         {
126             return starList;    
127         }
128         if(this.starObjArr[col][row].type == type)
129         {
130             starList.push(this.starObjArr[col][row]);
131             this.starObjArr[col][row].type = -1;
132             //递归调用,寻找当前星星四周的同色星星
133             starList = starList.concat(this.getSameColorStar(col+1, row, type));//右边
134             starList = starList.concat(this.getSameColorStar(col - 1, row, type));//左边
135             starList = starList.concat(this.getSameColorStar(col, row + 1, type));//上方
136             starList = starList.concat(this.getSameColorStar(col, row - 1, type));//下方
137         }
138         return starList;
139     },
140     //判断col,row值是否在矩阵范围内,
141     jugementStarPostion:function(col, row)
142     {
143         if(col < 0 ||col >9)    //超出水平范围
144         {
145             return -1;
146         }
147         if(row < 0 || row > 9) //超出垂直范围
148         {
149             return -1;
150         }
151         if(this.starObjArr[col][row] == null || this.starObjArr[col][row] == undefined)    //该对象不存在
152         {
153             return -1;
154         }
155         return this.starObjArr[col][row].type;
156     },
157     //初始化
158     zinit:function()
159     {
160         this.size = cc.size(480, 500);
161         //设置层的大小
162         this.setSize(this.size);
163         //将星星资源存放到数字中
164         this.starArr = [
165                         {id:1, normal:res.star1, selected:res.star1s},
166                         {id:2, normal:res.star2, selected:res.star2s},
167                         {id:3, normal:res.star3, selected:res.star3s},
168                         {id:4, normal:res.star4, selected:res.star4s},
169                         {id:5, normal:res.star5, selected:res.star5s}
170                         ];
171         for(var i = 0; i < 10; i++)
172         {
173             this.starObjArr.push([]);
174         }
175     }
176 });
177 //实例化
178 GameStarLayout.createLayout = function()
179 {
180     var starLayout = new GameStarLayout();
181     return starLayout;
182 };
/***************************effect image****************************/
 
 

 

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

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Cocos Creator是一款面向游戏开发者的跨平台游戏开发工具,它集成了Cocos2d-x游戏引擎和Cocos Studio编辑器,支持多种平台上的游戏开发,如iOS、Android、Windows等。 消灭星星是一款基于Cocos Creator开发的游戏。在游戏中,玩家需要消除屏幕上的星星,以获得分数。游戏开始时,屏幕上会随机生成一些星星,玩家可以通过点击相连的星星来消除它们。消除的星星越多,得到的分数就越高。玩家可以通过不断消除星星来刷新高分记录,挑战自己的极限。 在消灭星星游戏中,Cocos Creator提供了丰富的功能和工具,为游戏开发者提供了便利。开发者可以使用Cocos Creator的图形界面编辑器来创建游戏场景、导入资源和设置游戏规则等。同时,Cocos Creator还提供了强大的脚本编写功能,开发者可以使用JavaScript或TypeScript编写游戏逻辑,实现游戏中的各种功能。 除了基本的消除星星玩法,Cocos Creator还支持添加特殊道具、关卡设计、人物角色等功能。开发者可以根据自己的需求,自定义游戏的玩法和功能,使游戏更加有趣和有挑战性。 总而言之,Cocos Creator游戏开发工具提供了强大的功能和便捷的开发环境,使开发者可以轻松地开发出各种各样的游戏,包括消灭星星这样的小而精致的休闲游戏。无论是想要学习游戏开发还是实现自己的游戏创意,Cocos Creator都是一个不错的选择。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值