Cocos---大作业:简单H5小游戏
Cocos大作业:传统美食分分类
知识点清单:
场景切换,监听时间,碰撞组件及回调,拖动角色移动,分数记录,随机数和定时器,背景音乐控制,资源池控制,预制体,进度条...
源码+q:1431448323
效果图展示


游戏玩法如图所示
制作流程
场景切换
在按钮事件上
cc.director.loadScene('Play');
拖动物体
挂载美食上即可
start () {
this.node.on('touchmove',this.func1,this);
}
func1(t){
let p = this.node.parent.convertToNodeSpaceAR(t.getLocation());
this.node.position=p;
}
音乐管理
先构建如下
开关下面是两张图片
挂载脚本在‘开关’上

flag是用于检测开关的状态
@property(cc.Node)
kaiguan: cc.Node = null;
@property(cc.AudioClip)
bgAudio:cc.AudioClip=null;
audioID:number=0;
flag =false ;
protected onLoad(): void {
this.audioID=cc.audioEngine.play(this.bgAudio,true,0.5);
}
click(){
this.flag=!this.flag;
if(this.flag){
cc.audioEngine.pause(this.audioID);
this.kaiguan.getChildByName("关闭").active=true;
}
else {
cc.audioEngine.resume(this.audioID);
this.kaiguan.getChildByName("关闭").active=false;
}
}
碰撞检测
必须先开启检测
需要提前输入目标名字
@property(String)
TargetName:string="1111";
// @property(cc.AudioClip)
// rightAudio:cc.AudioClip=null;
// dfs:string="dfasdf";
protected start(): void {
let manager = cc.director.getCollisionManager();
// 开启碰撞检测系统
manager.enabled = true;
}
onCollisionStay(other,self){
let b = other.world.aabb;
let a = self.world.aabb;//b中是否包含a
if(b.containsRect(a)&&other.node.name == this.TargetName){
console.log('ok');
MAIN.fenshu++;
// this.playRight();
this.node.destroy();
}
}
资源池
预制体
cc.Prefab 资源池:cc.NodePool
MAIN.pool2.put(newlibao);
bao=MAIN.pool2.get();
cc.NodePool API: 放入put(),获得get()
随机数:
//介于1-3秒之间的随机数,发礼包的随机事件
// Math.floor(Math.random()*(max-min+1)+min);
if(this.rongqi.childrenCount>8)return ;
监听时间
// 每0.5秒执行this.Food()函数
this.schedule(this.Food,0.5);
//10秒后执行over函数
this.scheduleOnce(this.over,11);
随机获取食物显示在盘子中
Food(){
//介于1-3秒之间的随机数,发礼包的随机事件
// Math.floor(Math.random()*(max-min+1)+min);
if(this.rongqi.childrenCount>8)return ;
let suiji = Math.floor(Math.random()*(4-0+1)+0);
let bao = null;
if(suiji<1&&MAIN.pool1.size()>0)bao=MAIN.pool1.get();
else if(suiji<2&&MAIN.pool2.size()>0)bao=MAIN.pool2.get();
else if(suiji<3&&MAIN.pool3.size()>0)bao=MAIN.pool3.get();
else if(suiji<4&&MAIN.pool4.size()>0)bao=MAIN.pool4.get();
else return ;
if(MAIN.pool4.size()==0){
bao = cc.instantiate(this.yuebing);
}
//x坐标在-180到180之间随机
let randomX = Math.floor(Math.random()*(110+110+1)-110);
bao.position = cc.v3(randomX,-160,0);
this.rongqi.addChild(bao);
}
结束
over(){
this.replay.active = true;
this.rongqi.destroy();
this.unscheduleAllCallbacks(); //取消所有定时器
}
更改分数
update(t){
if(this.txt.string == MAIN.fenshu.toString())
return ;
else {
this.txt.string = MAIN.fenshu.toString();
cc.audioEngine.play( this.rightAudio,false,1);
}
}
Cocos---大作业:简单H5小游戏的更多相关文章
- java实现简单窗体小游戏----球球大作战
java实现简单窗体小游戏----球球大作战需求分析1.分析小球的属性: 坐标.大小.颜色.方向.速度 2.抽象类:Ball 设计类:BallMain—创建窗体 BallJPanel—画小 ...
- Egret白鹭H5小游戏开发入门(一)
前言: 好久没更新博客了,以前很多都不会,所以常常写博客总结,倒是现在有点点经验了就懒了.在过去的几个月里,在canvas游戏框架方面,撸过了CreateJS,玩得了Egret,又学过PIXI.js. ...
- 开发H5小游戏
Egret白鹭H5小游戏开发入门(一) 前言: 好久没更新博客了,以前很多都不会,所以常常写博客总结,倒是现在有点点经验了就懒了.在过去的几个月里,在canvas游戏框架方面,撸过了CreateJ ...
- “倔驴”一个h5小游戏的实现和思考(码易直播)——总结与整理
3月23日晚上8点半(中国队火拼韩国的时候),做了一期直播分享.15年做的一个小游戏,把核心代码拿出来,现场讲写了一遍,结果后面翻车了,写错了两个地方,导致运行效果有点问题,直播边说话边写代码还真不一 ...
- 从零开始开发一款H5小游戏(三) 攻守阵营,赋予粒子新的生命
本系列文章对应游戏代码已开源 Sinuous game. 每个游戏都会包含场景和角色.要实现一个游戏角色,就要清楚角色在场景中的位置,以及它的运动规律,并能通过数学表达式表现出来. 场景坐标 canv ...
- Egret白鹭H5小游戏开发入门(二)
前言: 昨天的文章中简单的介绍了Egret白鹭引擎从安装到基本的使用配置等问题,今天着重介绍H5小游戏开发的起步阶段,如Wing面板的使用,素材的处理,类的说明,开始布局等等. 整体概况: 根据上一篇 ...
- 青瓷qici - H5小游戏 抽奖机 “one-arm bandit”
写在前面 本文实现一个简单的抽奖效果,使用青瓷qici引擎,其中应用了Tween动画,粒子系统,遮罩,UI界面布局,项目设置,发布等功能呢. 目前开发采用1.0.7版本,后续如果界面有所变化请参考这个 ...
- 原生JS实现的h5小游戏-植物大战僵尸
代码地址如下:http://www.demodashi.com/demo/12755.html 项目介绍 本项目是利用原生js实现的h5小游戏-植物大战僵尸,主要结合了一下自己对于h5小游戏的理解,结 ...
- 从零开始开发一款H5小游戏(二) 创造游戏世界,启动发条
本系列文章对应游戏代码已开源 Sinuous game 上一节介绍了canvas的基础用法,了解了游戏开发所要用到的API.这篇文章开始,我将介绍怎么运用这些API来完成各种各样的游戏效果.这个过程更 ...
随机推荐
- Linux文件管理 | Liunx 常用命令
文件与目录基本操作 目录: 一.显示文件内容 cat 命令 more 命令 less 命令 head 命令 tail 命令 二.文件内容查询(grep) 三.文件查找命令 find 命令 locate ...
- html实体编码遇上js代码
单双引号 在js代码中 在js中单.双引号引起来的是字符串,如果我们要在字符串中使用单.双引号,需要反斜杠进行转义 let str='user\'s name'; // or let str=&quo ...
- zhilizhili-ui 荡平ie8910 还我前端清净地
zhilizhili-ui 给大家带来一个目前最新版本的ie8方案 特色 flexbox部分功能 vw vh calc部分功能 angular1.4 todo avalon是因为无法和polyfill ...
- Android Studio配置openvc
最近项目中需要用到opencv,于是就研究了一下怎么在Android studio中配置opencv,记录一下,免得以后还会使用. 一.因为本人Android Studio是4.1的,网上资料大多是3 ...
- PAT B1056组合数的和
给定 N 个非 0 的个位数字,用其中任意 2 个数字都可以组合成 1 个 2 位的数字.要求所有可能组合出来的 2 位数字的和.例如给定 2.5.8,则可以组合出:25.28.52.58.82.85 ...
- FreeRTOS学习记录--任务创建函数详解
开局一张图.一步一步分析就好. (一)什么是任务? 在多任务系统中,我们按照功能不同,把整个系统分割成一个个独立的,且无法返回的函数,这个函数我们称为任务:任务包含几个属性:任务堆栈,任务函数.任务控 ...
- Java设计模式——抽象工厂模式
抽象工厂模式也是创建模式,可以把它理解成创建工厂的工厂,这种模式也是我们经常使用的.在抽象工厂中的接口是用来创建工厂的,每个生成的工厂又都可以按照工厂模式创建其他对象. 举例说明: 创建Shape接口 ...
- Twitter上怎么保存视频的教程来啦
玩了多年的推特, 我发现竟然有这么便捷的方法把推特上的视频给保存下来 如果你也需要的话那么我来告诉你怎么操作吧~ Twitter(通称推特)是一家美国社交网络及微博客服务的网站 是全球互联网上访问量最 ...
- nginx服务优化大全
第18章 nginx服务优化 18.1 复习以前的nginx知识 18.1.1 复习nginx编译安装的3部曲 ./configure 配置(开启/关闭功能),指定安装目录 make ...
- Android Studio 的蓝牙串口通信(附Demo源码下载)
根据相关代码制作了一个开源依赖包,将以下所有的代码进行打包,直接调用即可完成所有的操作.详细说明地址如下,如果觉得有用可以GIthub点个Star支持一下: 项目官网 Kotlin版本说明文档 Jav ...
