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小游戏的更多相关文章

  1. java实现简单窗体小游戏----球球大作战

    java实现简单窗体小游戏----球球大作战需求分析1.分析小球的属性: ​ 坐标.大小.颜色.方向.速度 2.抽象类:Ball ​ 设计类:BallMain—创建窗体 ​ BallJPanel—画小 ...

  2. Egret白鹭H5小游戏开发入门(一)

    前言: 好久没更新博客了,以前很多都不会,所以常常写博客总结,倒是现在有点点经验了就懒了.在过去的几个月里,在canvas游戏框架方面,撸过了CreateJS,玩得了Egret,又学过PIXI.js. ...

  3. 开发H5小游戏

    Egret白鹭H5小游戏开发入门(一)   前言: 好久没更新博客了,以前很多都不会,所以常常写博客总结,倒是现在有点点经验了就懒了.在过去的几个月里,在canvas游戏框架方面,撸过了CreateJ ...

  4. “倔驴”一个h5小游戏的实现和思考(码易直播)——总结与整理

    3月23日晚上8点半(中国队火拼韩国的时候),做了一期直播分享.15年做的一个小游戏,把核心代码拿出来,现场讲写了一遍,结果后面翻车了,写错了两个地方,导致运行效果有点问题,直播边说话边写代码还真不一 ...

  5. 从零开始开发一款H5小游戏(三) 攻守阵营,赋予粒子新的生命

    本系列文章对应游戏代码已开源 Sinuous game. 每个游戏都会包含场景和角色.要实现一个游戏角色,就要清楚角色在场景中的位置,以及它的运动规律,并能通过数学表达式表现出来. 场景坐标 canv ...

  6. Egret白鹭H5小游戏开发入门(二)

    前言: 昨天的文章中简单的介绍了Egret白鹭引擎从安装到基本的使用配置等问题,今天着重介绍H5小游戏开发的起步阶段,如Wing面板的使用,素材的处理,类的说明,开始布局等等. 整体概况: 根据上一篇 ...

  7. 青瓷qici - H5小游戏 抽奖机 “one-arm bandit”

    写在前面 本文实现一个简单的抽奖效果,使用青瓷qici引擎,其中应用了Tween动画,粒子系统,遮罩,UI界面布局,项目设置,发布等功能呢. 目前开发采用1.0.7版本,后续如果界面有所变化请参考这个 ...

  8. 原生JS实现的h5小游戏-植物大战僵尸

    代码地址如下:http://www.demodashi.com/demo/12755.html 项目介绍 本项目是利用原生js实现的h5小游戏-植物大战僵尸,主要结合了一下自己对于h5小游戏的理解,结 ...

  9. 从零开始开发一款H5小游戏(二) 创造游戏世界,启动发条

    本系列文章对应游戏代码已开源 Sinuous game 上一节介绍了canvas的基础用法,了解了游戏开发所要用到的API.这篇文章开始,我将介绍怎么运用这些API来完成各种各样的游戏效果.这个过程更 ...

随机推荐

  1. Mybatis实现简单增删改查

    Mybatis的简单应用 学习内容: 需求 环境准备 代码 总结: 学习内容: 需求 使用Mybatis实现简单增删改查(以下是在IDEA中实现的,其他开发工具中,代码一样) jar 包下载:http ...

  2. java JDK的安装和环境配置(windows10)

    1.下载JDK,安装.http://www.oracle.com/technetwork/java/javase/archive-139210.html   下载地址 2.配置JDK. (右键我的电脑 ...

  3. FastAPI(七十四)实战开发《在线课程学习系统》接口开发-- 删除留言

    之前文章FastAPI(七十三)实战开发<在线课程学习系统>接口开发-- 回复留言,那么我们这次分享删除留言接口的开发 可以对留言进行删除,这里的删除,我们使用的是逻辑的删除,不是物理删除 ...

  4. Java安全之Commons Collections6分析

    Java安全之Commons Collections6分析 0x00 前言 其实在分析的几条链中都大致相同,都是基于前面一些链的变形,在本文的CC6链中,就和前面的有点小小的区别.在CC6链中也和CC ...

  5. numpy教程01---ndarray的创建

    欢迎关注公众号[Python开发实战], 获取更多内容! 工具-numpy numpy是使用Python进行数据科学的基础库.numpy以一个强大的N维数组对象为中心,它还包含有用的线性代数,傅里叶变 ...

  6. 集成JUnit测试

    集成JUnit测试 既然使用了Spring,那么怎么集成到JUnit中进行测试呢,首先大家能够想到的肯定是: public class TestMain { @Test public void tes ...

  7. Quartz 使用记录

    Quartz 使用记录 官网 https://www.quartz-scheduler.org/ 参考文档 Quartz 2.3.0 什么是 Quartz? 官方描述: Quartz is a ric ...

  8. Blazor 发布WebAssembly使用Brotli 压缩提升初次加载速度

    使用Brotli提高网站访问速度 在优化网站打开速度上,我们有很多的方法,而其中一个就是减少诸如Javascript和CSS等资源文件的大小,而减少文件大小的方法除了在代码上下功夫外,最常用的方法就是 ...

  9. “九韶杯”河科院程序设计协会第一届程序设计竞赛 D数列重组 next_permutation

    "九韶杯"河科院程序设计协会第一届程序设计竞赛 D数列重组  next_permutation 题目 原题链接: https://ac.nowcoder.com/acm/conte ...

  10. 多行,溢出隐藏 css

     .ellipsis-line{width:200px; line-height:18px;font-size:14px; overflow:hidden; text-overflow:ellipsi ...