学习跃动小球小游戏

玩法：小球会不断的上下跳动，点击屏幕小球会加速掉落，下面的白色跳板一直在移动，小球需要准确的跳到跳板上才能得分。

效果图
【截图】

ball脚本
- 小球碰撞回调
block脚本
- 初始跳板的宽度以及自身碰撞体的宽度
game脚本
- 开启物流引擎
- 生成跳板
- 点击加速事件
- 跳板超出屏幕后，填补到最后面，实现循环使用

首先，我们先做好场景的布局
【截图】

为ball节点添加物理组件RigidBody(钢体)，再添加一个物理组件里的collider—>Box组件，这个组件可以调节碰撞体的大小。
【截图】

跳板设置为预制体，同样添加RigidBody与physicsBoxCollider组件。
【截图】

1、现在开始编写代码，game脚本挂载到BG节点上，在ganme脚本中开启物理引擎，并设置一个重力值

// game.js// 初始化物流引擎
initPhysics() {let manager = cc.director.getPhysicsManager()manager.enabled = true;manager.gravity = cc.v2(0, -2400);
},

2、生成跳板

// game.js// 初始化跳板
initBlock() {this.lastBlockPosX = this.ballNode.x; // 最后一个方块的X轴this.blockNodeArr = []; // 存放所有的跳转数组for (let i = 0; i < 10; i++) {let blockNode = cc.instantiate(this.blockPrefab);blockNode.x = this.lastBlockPosX;blockNode.y = 0;let width = 100 + (Math.random() > 0.5 ? 1 : -1) * (Math.random() * 40); // 跳板随机宽度值blockNode.getComponent('block').init(width); // 调用block脚本中的初始化跳板宽度以及自身碰撞体宽度的接口this.blockAreaNode.addChild(blockNode);this.blockNodeArr.push(blockNode);this.lastBlockPosX += 200;}
},

block脚本中初始化跳板的宽度以及自身碰撞宽度

// block.js// 初始化跳板宽度以及自身碰撞体宽度；
init (width) {let collider = this.node.getComponent(cc.PhysicsBoxCollider);this.node.width = width;collider.size.width = width; // 设置碰撞体宽度与节点宽度相同
}

3、点击加速事件。在小球第一次碰撞后，才能点击加速，是为了获取到小球最初的线性速度。

onLoad()中注册点击事件与一些初始化操作

// game.jsonLoad () {this.initPhysics(); // 初始化物流引擎this.node.on('touchstart', this.boost, this); // 点击屏幕调用this.boost事件this.score = 0; // 得分this.gameStart = 0; // 游戏开始标识this.initBlock(); // 初始化跳板
},

小球加速事件

// game.js// 加速
boost() {// 先判断ball脚本中是否有初始速度，如果没有，点击无效if (this.ballNode.getComponent('ball').initVel) {let rigidBody = this.ballNode.getComponent(cc.RigidBody);rigidBody.linearVelocity = cc.v2(0, -1600);this.gameStart = 1;}
},

ball脚本中获取小球的最初线性速度

// ball.jsonLoad () {this.initVel = 0; // 初始速度
},// onBeginContact是内置的碰撞回调方法
onBeginContact(contact, selfCollider, otherCollider) {// 设置小球最初的线性速度，碰撞后要设置为最初的线性速度，这样小球就不会在加速后越弹越高let rigidBody = selfCollider.node.getComponent(cc.RigidBody);if (!this.initVel) {this.initVel = rigidBody.linearVelocity.y;} else {rigidBody.linearVelocity = cc.v2(0, this.initVel);}
}

4、update（）中实现跳板的重复利用与游戏结束逻辑

// game.jsupdate (dt) {if (this.gameStart) {let speed = -350 * dt;for (let blockNode of this.blockNodeArr) {blockNode.x += speed;// 跳板超出屏幕后，填补到最后面，实现循环使用if (blockNode.x < -cc.winSize.width / 2 - blockNode.width / 2) {this.incrScore(1); // 调用得分函数blockNode.x = this.getLastBlockPosX() + 200; // 重新设置X轴的位置}}}// 如果小球超出了屏幕，游戏结束if (this.ballNode.y < -cc.winSize.height / 2) {console.log('游戏结束');cc.director.loadScene('game');}
},// 获取最后一块跳板的X轴
getLastBlockPosX() {let posX = 0;for (let blockNode of this.blockNodeArr) {if (blockNode.x > posX) {posX = blockNode.x;}}return posX;
},

5、简单的得分逻辑

// game.js// 得分
incrScore(incr) {this.score += incr;this.scoreLabel.string = this.score;
}

学习跃动小球小游戏（cocos creator）相关推荐

学习完美方块小游戏（cocos creator）
学习完美方块小游戏通过学习完美方块小游戏,了解缓动系统(cc.tween)的简单运用 [游戏效果图] [游戏玩法]:玩家通过长按屏幕,使方块放大到一定的大小后下落,如果被基座接住算是过关,掉落或者被 ...
C语言弹小球小游戏（控制台）
C语言实现弹小球游戏编译环境:vs2019 需求: 小球在控制台界面内不停移动,碰到边界则改变方向,控制棍子接住小球,得分加一,小球没有被接住则游戏结束. 思路: _getch()函数接收a.d两个 ...
Udacity利用深度学习玩赛车小游戏
Udacity利用深度学习玩赛车小游戏简单介绍准备工作训练网络效果简单介绍这是Udacity无人驾驶课程里一个利用深度学习实现的玩赛车小游戏, 附上链接:github项目原理就是玩家手动 ...
用ts代码实现吃鸡游戏刷毒小demo(cocos creator引擎)
闲来无事,写下来的,用的cocos creator引擎刷毒逻辑一般为四个步骤: 1,安全区在毒圈内重新刷新,外圆必须全包含内圆 2,倒计时结束,毒圈沿着毒圈圆心点缩小 3,当外圆与内圆相切的时候,相 ...
python学习之——综合小游戏
照着笨方法学python的书写了一个小游戏 #!/usr/bin/env python # -*- coding:utf-8 -*- from sys import exit from random ...
Pytorch强化学习玩微信小游戏
文章目录 1.前言: 2.环境准备: 3.代码讲解 A.首先是与调试环境交互相关的代码讲解: B.其次是神经网络代码的讲解 C.最后就是模型训练的代码了四.总结 1.前言: 学习了DQN有一段时间了 ...
java开发桌球游戏源代码_Java学习的开端小游戏----桌球游戏
此小游戏只为让Java初学者感受到学习Java的乐趣,不为严谨. 以下是完整代码: package com.bjsxt.game; import java.awt.Graphics; import j ...
Unity3D学习之射箭小游戏
一.了解基础知识对于射箭小游戏来说,新增加了物理引擎的运用.物理引擎主要包括三个方面:Rigidbody.Collide.PhysicMaterial.其中,Collider是最基本的触发物理的条件 ...
QT学习之QT小游戏-----猜数字游戏
经过几天的qt视频学习,基本掌握了时间,信号和槽以及qt定时器的使用,还有QT UI设计器的一些布局,自己根据上课流程,写了一个小游戏,基本还算可以.ui布局基本都是使用设计器完成的,下面是部分源代码 ...

学习跃动小球小游戏（cocos creator）

学习跃动小球小游戏

学习跃动小球小游戏（cocos creator）相关推荐

最新文章

热门文章