Cocos Creator实现左右跳游戏,提供完整游戏代码工程
1. 玩法说明
游戏开始后,点击屏幕左右两侧,机器人朝左上方或右上方跳一步,如果下一步有石块,成功得1分,否则游戏结束。
2. 模块介绍
游戏场景分为2个:主页场景(home)、游戏场景(game)。
主页场景(home)作为游戏入口,没有其他功能,单纯提供游戏入口。
游戏场景(game)实现游戏玩法以及游戏逻辑控制,界面如下:
游戏的主体功能,都在游戏场景内,游戏场景的主要功能结构如下图:
3. 开发说明
这里主要介绍游戏场景的逻辑,按照上面功能结构进行介绍,先看一下游戏场景内的所有课件UI组件:
下面分模块介绍:
石块逻辑(Box)
脚本挂载在石块预制上,实现石块相关逻辑,主要有2个:
1. 石块往下运动
根据机器人当前屏幕位置,机器人跳动后,无论成功还是失败,让石块往下方运动,运动到屏幕外,对应代码如下:
down(y: number){
this.node.runAction(cc.sequence(
cc.moveBy(0.4, 0, y),
cc.callFunc( () => {
NodeMgr.putBox(this.node);
})
));
}
2. 记录数据
private mPrevBox: cc.Node = null; // 上一个石块
private mNextBox: cc.Node = null; // 下一个石块
private mOffset: number = 0; // 左右偏移量 [-4,4]
上下石块主要是为了提供给机器人使用,让机器知道下一个跳过去的位置在哪里,而偏移量则记录石块在屏幕水平方向上的位置,从左到右,取值[-4,4]整数。
节点管理逻辑(NodeMgr)
游戏中的石块,最多的时候,只铺满3个屏幕高度,超出了以后,幕布会移动到最下,石块重绘,如此循环,以达到一直玩下去的目的,所以石块是反复的移除和添加的,使用节电池,能让游戏有更好的表现。
1. 获取石块节点
判断节电池中是否已经有,有就去现成的,没有则返回空,让游戏逻辑自己生成一个新的节点,代码如下:
public static putBox(box: cc.Node){
if(this.mBoxNodePool == null){
this.mBoxNodePool = new cc.NodePool('boxs');
}
if(box != null){
this.mBoxNodePool.put(box);
}
}
2. 回收石块节点
移除节点时,直接把节点放入节点池,提供下次需要时使用,代码如下:
public static getBox(){
if(this.mBoxNodePool != null && this.mBoxNodePool.size() > 0){
let box = this.mBoxNodePool.get();
box.stopAllActions();
return box;
}else{
return null;
}
}
游戏逻辑(Game)
Game脚本组件挂载在游戏场景的根节点上,石块管理脚本组件也一样,如下图:
主要功能有3个:
1. 点击事件逻辑
根据点击位置的x坐标判断,在屏幕左边往左跳,在屏幕右边往右跳。能不能跳之前,需要判断机器人现在是否正在跳,需要注意,代码如下:
onTouchCallback(event: any){
if(!this.mIsPlaying){
return;
}
if(this.nodeRobot.getComponent('Robot').isJumping()){
return;
}
this.bgDown();
this.mIsPlaying = true;
let location = event.getLocation();
if(location.x < cc.winSize.width / 2){
this.robotJumpLeft();
}else{
this.robotJumpRight();
}
}
2.游戏背景运动控制
游戏开始时,计算背景运动的最大y坐标,运动前,判定跳以后是否超过最大坐标,移动到第一屏位置,类似石块摆放逻辑,主要代码如下:
bgDown(){
let maxY = -cc.winSize.height / 2 - 2 * cc.winSize.height;
let interval = this.node.getComponent('BoxMgr').getIntervalY(); // 超出了,刷屏
if(this.nodeBg.y - interval <= maxY){
this.nodeBg.y += 2 * cc.winSize.height;
this.reloadBoxs();
}
// 下移
this.nodeBg.runAction(cc.sequence(
cc.moveBy(0.2, 0, -interval),
cc.callFunc( () => { })
));
}
3.控制石块重绘
结合游戏背景控制逻辑,判断所有石块是否需要重绘制。
石块管理逻辑(BoxMgr)
挂载在游戏场景根节点,主要完成以下3项功能:
1. 生成新的石块
对应代码中的 reloadNew函数,代码太多,就不贴代码了,需要的话,下载工程代码看。
2. 加载所有石块
先判断有没有上一屏保留的,有的话,先绘制上一屏,再绘制新的,新的在第三屏能显示的,需要保留,用来下次切屏的时候绘制。
3. 清理石块
清理所有石块,保留在NodeMgr中,代码如下:
clearAll(){
if(this.mMemBoxs != null){
for(let i = 0; i < this.mMemBoxs.length; i++){
this.putBox(this.mMemBoxs[i]);
}
this.mMemBoxs = [];
}
if(this.mNewBoxs != null){
for(let i = 0; i < this.mNewBoxs.length; i++){
this.putBox(this.mNewBoxs[i]);
}
this.mNewBoxs = [];
}
}
机器人逻辑(Robot)
主要功能
根据下一跳方向,判断机器人能否跳过去,对应代码中的jump函数。
关注微信公众号『 一枚小工 』获取游戏源码,微信扫描以下二维码,关注公众号。
Cocos Creator实现左右跳游戏,提供完整游戏代码工程的更多相关文章
- Cocos Creator实现左右跳游戏
1. 玩法说明 游戏开始后,点击屏幕左右两侧,机器人朝左上方或右上方跳一步,如果下一步有石块,成功得1分,否则游戏结束. 2. 模块介绍 游戏场景分为2个:主页场景(home).游戏场景(game) ...
- cocos creator主程入门教程(八)—— 代码结构
五邑隐侠,本名关健昌,10年游戏生涯,现隐居五邑.本系列文章以TypeScript为介绍语言. 这一篇简单介绍下代码结构,清晰的代码结构更有利于团队对项目的理解和维护. 1.前面我们介绍了一系列基础功 ...
- 新编辑器Cocos Creator发布:对不起我来晚了!
1月19日,由Cocos创始人王哲亲手撰写的一篇Cocos Creator新品发布稿件在朋友圈被行业人士疯狂转载,短短数小时阅读量突破五位数.Cocos Creator被誉为“注定将揭开Cocos开发 ...
- cocos creator 入门理解点
简单解释, [来源:官方文档] Cocos是触控科技推出的游戏开发一站式解决方案,包含了从新建立项.游戏制作.到打包上线的全套流程.开发者可以通过cocos快速生成代码.编辑资源和动画,最终输出适合于 ...
- Cocos Creator 性能优化:DrawCall
前言 在游戏开发中,DrawCall 作为一个非常重要的性能指标,直接影响游戏的整体性能表现. 无论是 Cocos Creator.Unity.Unreal 还是其他游戏引擎,只要说到游戏性能优化,D ...
- Cocos Creator 通用框架设计 —— 资源管理
如果你想使用Cocos Creator制作一些规模稍大的游戏,那么资源管理是必须解决的问题,随着游戏的进行,你可能会发现游戏的内存占用只升不降,哪怕你当前只用到了极少的资源,并且有使用cc.loade ...
- Cocos Creator - 入门教程项目 - 博客频道 - CSDN.NET
3457 教程司令部 [20160418] | Cocos Creator - CocoaChina CocoaChina_让移动开发更简单cocoachina.com 2033 Cocos Crea ...
- cocos creator 事件
cocos creator 事件 在做一个消除类游戏时,需要对点击的方块做出响应.代码很简单,可背后的原理还多着呢. 1. 普通节点注册click事件 在cc中如果需要相应click事件,需要为该节点 ...
- 反复横跳的瞄准线!从向量计算说起!基于射线检测的实现!Cocos Creator!
最近有小伙伴问我瞄准线遇到各种形状该怎么处理?如何实现反复横跳的瞄准线?最近刚好在<Cocos Creator游戏开发实战>中看到物理系统有一个射线检测,于是,基于这个射线检测,写了一个反 ...
随机推荐
- SIA-GateWay之API网关安装部署指南
SIA-GATEWAY是基于SpringCloud微服务生态体系下开发的一个分布式微服务网关系统.具备简单易用.可视化.高可扩展.高可用性等特征,提供云原生.完整及成熟的接入服务解决方案.本文介绍AP ...
- 算法与数据结构基础 - 递归(Recursion)
递归基础 递归(Recursion)是常见常用的算法,是DFS.分治法.回溯.二叉树遍历等方法的基础,典型的应用递归的问题有求阶乘.汉诺塔.斐波那契数列等,可视化过程. 应用递归算法一般分三步,一是定 ...
- Spring+Mybatis整合的练手小项目(一)项目部署
声明:教程是网上找的,代码是自己敲的 项目目录大致如下: 1. 首先创建Maven工程,在pom.xml中加入项目所需依赖: <?xml version="1.0" enco ...
- 小斌之SpringCloud 开发某某交易所
最近一个月都在弄某某交易所,让之前学的东西能够用上,在这里分享一下收货的东西吧 #### 简介 系统是进行了二次开发,用的是ZTuo开源框架第一个版本,节省了很多时间(坑也挺多,哈哈哈),文章结尾贴源 ...
- python语言程序设计部分习题
第二章 python程序实例解析 程序练习题 2.1 实例1的修改,采用eval(input(<提示内容>))替换现有输入部分,并使输出的温度值为整数. vv 2.2 汇率兑换程序.按 ...
- Java使用Optional与Stream来取代if判空逻辑(JDK8以上)
Java使用Optional与Stream来取代if判空逻辑(JDK8以上) 通过本文你可以用非常简短的代码替代业务逻辑中的判null校验,并且很容易的在出现空指针的时候进行打日志或其他操作. 注:如 ...
- 会用python把linux命令写一遍的人,进大厂有多容易?
看过这篇<2000字谏言,给那些想学Python的人,建议收藏后细看!>的读者应该都对一个命令有点印象吧?没错,就是 linux 中经常会用到的 ls 命令. 文章中我就提到如何提升自己的 ...
- 【Python爬虫】第四课(查询照片拍摄地址)
首先,要能够查询到照片地址,查询的照片必须要开GPS拍,且上传时用原图…… 查询图片的exif信息,使用exifread包 import exifread img = exifread.process ...
- Kubernetes学习之应用部署变迁
从物理单机.虚拟化(容器化)到云原生 历史 云原生 ---初期 总结
- 从零开始OpenGL—— 一、 环境配置
前言 高考完之后填志愿,当时想以后去做游戏,所以选择了计算机这个专业,之前捣鼓过U3D,这学期也开始了计算机图形学的学习,最近学习了OpenGL相关的一些内容,将在博客中记录这系列的学习.这篇开篇博客 ...