CocosCreator之KUOKUO带你做疯狂木板-过桥（2）

本次引擎2.0.5

编辑工具VSCode

目标：

第二部分，过桥与得分。

接着上一节：

我们实现了木板的变长与下落。

现在我们实现一个牛逼的平台，怎么说它牛逼呢？我准备全程就用它一个来完成所有功能。

看KUOKUO怎么实现。console.log(滑稽)

首先，我们复制个ground然后改名字为move_ground,然后拖到中间。

好了，然后我们在mian脚本里声明它：

接下来，我们在onLoad中提前随机个位置和宽度：

位置在0到150之间；宽度在100到200之间吧（你们看心情随机）

我们写个方法：

然后在onLoad开始时调用一次：

好了,随机的平台弄好了，我们在结束触摸时进行长度判断吧：

就是先计算一下可以踩住桥的一个范围，然后看看木板的height在不在范围内：

看注释(第二个式子的注释应该是右边界)：

这样就可以判断游戏状态了。

接下来我们写一下判断成功后的动画（判断失败那里我打印了Gameover，小伙伴们去自定义吧，嘿嘿）

然后，成功后小人走过去，木板长度归零，角度回到0，

记得声明个zhujue节点；把主角拖过去：

在长度判断成功后这样：

小人走过去之后把板子复位，然后平台跟小人一起回去，但是板子回去的多，直至出屏幕 

怎么样，注释全吧！！！

嘻嘻！

看看效果：

怎么样？

来，加个分数显示吧！

怎么样，不难吧。

好了，由于这个小游戏就用到了一个脚本（其实不是好习惯，还有我的代码并不是最优的，主要是思维要到位！）

我就不打包上传网盘啦！给出代码：

main.js

cc.Class({extends: cc.Component,properties: {// 木板节点blank : cc.Node,// 变长标志long_flag : 0,// 移动平台move_ground: cc.Node,// 主角zhujue : cc.Node,// 分数显示fen_label : cc.Label,// 分数fen : 0},onLoad () {this.fen_label.string = this.fen + '';// 初始化时木板为0this.blank.height = 0;// 随机平台属性this.randomGround();// 触摸开始this.node.on('touchstart',function() {this.long_flag = 1;},this);// 触摸结束this.node.on('touchend',function() {this.long_flag = 0;// 计算可通过平台的范围// 移动平台的 x 坐标减去木板的 x 坐标再减去宽度的一半为左边界var left = this.move_ground.x - this.blank.x - (this.move_ground.width / 2);// 移动平台的 x 坐标减去木板的 x 坐标再加上宽度的一半为左边界var right = this.move_ground.x - this.blank.x + (this.move_ground.width / 2);// 如果在这个范围内if (this.blank.height >= left && this.blank.height <= right) {// 小人走过去动作// 注意 y 轴坐标是zhujue的var act_go = cc.callFunc(function() {this.zhujue.runAction(cc.moveTo(1,this.move_ground.x,this.zhujue.y));// 加分this.fen ++;this.fen_label.string = this.fen + '';},this);// 开始旋转90度后小人走过去this.blank.runAction(cc.sequence(cc.rotateBy(1.5,90),act_go));// 1.1秒 + 1.5秒 后小人跟平台一起往回走this.scheduleOnce(function() {// 板子复位this.blank.height = 0;this.blank.rotation = 0;// 注意各自 y 坐标this.zhujue.runAction(cc.moveTo(1,-220,this.zhujue.y));this.move_ground.runAction(cc.moveTo(1.5,-330,this.move_ground.y));},2.6);// 平台出屏幕后把 y 减小，然后随机位置浮现this.scheduleOnce(function() {this.move_ground.y = -750;this.randomGround();this.move_ground.runAction(cc.moveBy(1,0,500));},2.6 + 1.5);}else {console.log('Gameover');}},this);},// 随机移动平台属性randomGround () {this.move_ground.x = 0;// 随机x坐标在 0 - 150this.move_ground.x += 150 * Math.random();// 随机宽度 100 - 200；this.move_ground.width = 100 + 100 *Math.random();},update (dt) {if (this.long_flag == 0) {return;}else {this.blank.height += 100 * dt;}}});

Get ！~~~

加我QQ群：（博客里面的项目，群文件里都有哦）

706176551

我们一起学习！

O(∩_∩)O~~