小老鼠历险记Cocos Creator

2023-10-12 18:50
文章标签 creator cocos 小老鼠 历险记

本文主要是介绍小老鼠历险记Cocos Creator，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

1.设计思路

突发奇想设计一个游戏，游戏名是《小老鼠历险记》，设计思路是一只可怜的小老鼠，他的敌人是猫和狗，它的活动区间只能是他的窝窝附近，不时还有猫猫和狗狗想吃它，所以小老鼠要走位躲过他们的偷袭，然而因为狗狗还是比较喜欢是骨头，所以和老鼠达成一个协议，可以用一个骨头换帮我对付一只猫，如果我没有骨头，狗狗就把我吃了，所以我一边要躲他们，一边收集骨头和狗一起攻击猫，玩家操纵小老鼠，让小老鼠生存下去。

2.结果展示

在这里插入图片描述
在这里插入图片描述

3. 实现逻辑

3.1 操控小老鼠
在这里插入图片描述
小老鼠的操控方式为键盘操控，分别为
w->向上 s->向下 a->向左 d->向右
设计的方式为设置一个速度变量，分别为横轴和纵轴的速度，向右 向上为正，向下 向左为负。在update()中更新小老鼠的位置。
在这里插入图片描述
在这里插入图片描述
为小老鼠添加监听器，分别为w,a,s,d键的按下和松开。

    //键盘按下事件onKeyDown(event){switch(event.keyCode) {//按下a，则老鼠向前case cc.macro.KEY.w:console.log('老鼠前进');this.DirectionY = 1;break;case cc.macro.KEY.s:console.log('老鼠后退');this.DirectionY = -1;break;case cc.macro.KEY.a:console.log('老鼠向左');this.DirectionX = -1;break;case cc.macro.KEY.d:console.log('老鼠向右');this.DirectionX = 1;break;}}//按键松下事件onKeyUp(event){if(event.keyCode==cc.macro.KEY.w&&this.DirectionY==1){this.DirectionY=0;}if(event.keyCode==cc.macro.KEY.s&&this.DirectionY==-1){this.DirectionY=0;}if(event.keyCode==cc.macro.KEY.a&&this.DirectionX==-1){this.DirectionX=0;}if(event.keyCode==cc.macro.KEY.d&&this.DirectionX==1){this.DirectionX=0;}}

3.2 为小老鼠设置活动区间
在这里插入图片描述
小老鼠的活动区间为下方边界和木棍组成的区间，若没有区间限制，小老鼠就会在键盘的控制下，跃出游戏界面。
这里采用了刚体的方法，设置方法如下：
小老鼠的刚体：
在这里插入图片描述

设置为圆形的刚体，这里类型设置为Dynamic,
box2d 原本的刚体类型是三种：Static、Dynamic、Kinematic。Cocos Creator 多添加了一个类型：Animated。分别为静态、动态、运动学。取消睡眠，设置重力加速度为0.
为边界和木棍设置刚体，设置方式和小老鼠类似：
在这里插入图片描述
这里注意：一开始我在操纵老鼠的时候，老鼠可以越界，询问了一下，问题是刚体要全部设置为不休眠，这样才不会出现越界问题。
现在运行程序，就可以实现键盘控制小老鼠在制定区间活动了。

onLoad () {//给老鼠添加监听器cc.systemEvent.on(cc.SystemEvent.EventType.KEY_DOWN, this.onKeyDown, this);cc.systemEvent.on(cc.SystemEvent.EventType.KEY_UP, this.onKeyUp, this);//开启物理特性cc.director.getPhysicsManager().enabled = true;//开启碰撞检测cc.director.getCollisionManager().enabled = true;}

记得要开启物理特性，不然还是没有刚体的效果。
3.3 骨头，猫，狗掉落效果

他们的实现方法类似，都是先把图片拖到场景里面，然后加载脚本，再拖到资源管理器，成为预设体。
以骨头为例，脚本为：

const {ccclass, property} = cc._decorator;@ccclass
export default class BoneControl extends cc.Component {// LIFE-CYCLE CALLBACKS:@propertySpeed: number = 100;//骨头移动速度// onLoad () {}start () {}update (dt) {this.node.y -= this.Speed*dt;if(this.node.y<-755){this.die();}}die(){this.node.destroy();}
}

注意越界后要去销毁。挂载好脚本后，设置为预设体
在这里插入图片描述
3.4 设置批量产生猫，狗，骨头
这里我设置了一个空节点，猫，狗，骨头都生成在该节点下面
在这里插入图片描述
为该空节点挂载脚本
要想实现批量产生猫，狗和骨头，就要引用他们的脚本和控件。
在这里插入图片描述
设置一个计时器，每隔一段时间就随机产生一个精灵。
这里利用schedule()方法，每隔0.8s就从猫，狗和骨头选一个生成，初始位置为空节点的高度，水平位置为游戏屏幕宽度之间的随机位置。

onLoad () {        this.schedule(function() {//随机产生一个随机数确定是产生猫还是狗还是骨头let randn = Math.random()*100;if(randn>=0&&randn<=30){//生成骨头this.chooseBorn = 1;}else if(randn>30&&randn<=70){//生成猫this.chooseBorn = 2;}else{//生成狗this.chooseBorn = 3;}let thing = null;switch(this.chooseBorn){case 1:thing = cc.instantiate(this.BonePre);break;case 2:thing = cc.instantiate(this.CatPre);break;case 3:thing = cc.instantiate(this.DogPre);break;}//获得当前的场景let scene = cc.director.getScene();//设置骨头的父节点thing.parent = scene;//设置位置thing.y = this.node.y;//y和节点位置相同thing.x = Math.random()*400;}, 0.8);}

生成后设置父节点，这样就产生随机生成猫，狗和骨头的效果了。
3.5 设置碰撞事件
为每个事物添加碰撞，以老鼠为例
在这里插入图片描述
这里设置为圆形碰撞，为每个事物设置不同的Tag,这里我设置为Tag=1为骨头，Tag=0是老鼠，Tag=2是猫,Tag=3是狗，可以在预设体中设置，也可以一开始就设置碰撞再设置为预设体，预设体中设置记得保存。
接下来，在老鼠的脚本中实现碰撞检测：
在onCollisionStay(other)函数中，根据other的tag值判断碰撞的是什么事物。

//检测碰撞onCollisionStay(other){if(other.tag==1){//如果接到的是骨头console.log("与骨头发生碰撞")this.BoneNumber++;this.num_Bones.string = this.BoneNumber+"";let bone = other.getComponent(BoneControl);bone.die();}if(other.tag==2){//如果接到的是猫console.log("与猫发生碰撞")let cat = other.getComponent(CatControl);//检测有没有和狗的协议if(this.DealNumber>0){//协议数减一this.DealNumber--;this.num_agreenments.string = this.DealNumber+"";//猫死亡cat.die();this.KillCatNumber++;this.num_kills.string = ""+this.KillCatNumber;}else{//猫胜利cat.vectory();//自己死亡this.die();}}if(other.tag==3){console.log("与狗发生碰撞")//如果接到的是狗let dog = other.getComponent(DogControl);//检测骨头数是否大于0，用于和狗狗交易if(this.BoneNumber>0){//骨头数减一this.BoneNumber--;this.num_Bones.string = this.BoneNumber+"";//狗狗离开dog.die();//协议数加一this.DealNumber++;this.num_agreenments.string = this.DealNumber+"";}else{//狗狗胜利dog.vectory();//狗狗吃了老鼠this.die();}}}

在这里插入图片描述

碰撞处理的方法大致为获得碰撞体的脚本，然后处理各种情况，更新结果。
情况分为：
1.碰到的是骨头
接收骨头，骨头数+1，然后销毁骨头
2.碰到的是猫
判断是否有协议，如果协议大于等于1，则协议数-1，销毁猫，杀死猫的个数+1。
否则，销毁老鼠和猫，游戏结束，猫胜利。
3.碰到的是狗
判断收集的骨头数，若大于等于1则和狗达成协议，协议数+1，骨头数-1,销毁狗，
否则，销毁老鼠和狗，游戏结束，狗胜利。

3.6 记录游戏中的参数
在这里插入图片描述
Killed Cat为杀死猫的个数
Left Bone为剩下的骨头数
Agreements为协议数
添加控制，每当参数改变的时候，更新Label的值
在这里插入图片描述
玩家在游戏过程中注意自己的骨头数是否大于0，才能和狗进行交易，并且只有当手中有协议的时候，才能和猫抗衡。

4.程序代码及框架

4.1 层级管理器
在这里插入图片描述
4.2 脚本代码
4.2.1 BoneControl.ts

const {ccclass, property} = cc._decorator;@ccclass
export default class BoneControl extends cc.Component {// LIFE-CYCLE CALLBACKS:@propertySpeed: number = 100;//骨头移动速度// onLoad () {}start () {}update (dt) {this.node.y -= this.Speed*dt;if(this.node.y<-755){this.die();}}die(){this.node.destroy();}
}

4.2.2 CatControl.ts

const {ccclass, property} = cc._decorator;@ccclass
export default class CatControl extends cc.Component {//计分控件@property(cc.Label)num_kills: cc.Label = null;//计分控件@property(cc.Label)num_Bones: cc.Label = null;@propertySpeed: number = 200;//猫移动的速度// onLoad () {}start () {}update (dt) {this.node.y -= this.Speed*dt;if(this.node.y<-755){this.die();}}die(){this.node.destroy();}vectory(){console.log("猫猫胜利");}
}

4.2.3 DogControl.ts


const {ccclass, property} = cc._decorator;@ccclass
export default class DogControl extends cc.Component {@propertySpeed: number = 200;//猫移动的速度// onLoad () {}start () {}update (dt) {this.node.y -= this.Speed*dt;if(this.node.y<-755){this.die();}}die(){this.node.destroy();}vectory(){console.log("狗狗胜利")}
}

4.2.4 CreatorControl.ts

const {ccclass, property} = cc._decorator;@ccclass
export default class CreatorControl extends cc.Component {// 骨头预设体@property(cc.Prefab)BonePre : cc.Prefab = null;//猫预设体@property(cc.Prefab)CatPre : cc.Prefab = null;//狗预设体@property(cc.Prefab)DogPre : cc.Prefab = null;chooseBorn: number = 0;onLoad () {        this.schedule(function() {//随机产生一个随机数确定是产生猫还是狗还是骨头let randn = Math.random()*100;if(randn>=0&&randn<=30){//生成骨头this.chooseBorn = 1;}else if(randn>30&&randn<=70){//生成猫this.chooseBorn = 2;}else{//生成狗this.chooseBorn = 3;}let thing = null;switch(this.chooseBorn){case 1:thing = cc.instantiate(this.BonePre);break;case 2:thing = cc.instantiate(this.CatPre);break;case 3:thing = cc.instantiate(this.DogPre);break;}//获得当前的场景let scene = cc.director.getScene();//设置骨头的父节点thing.parent = scene;//设置位置thing.y = this.node.y;//y和节点位置相同thing.x = Math.random()*400;}, 0.8);}start () {}// update (dt) {}
}

4.2.5 MouseControl.ts

import BoneControl from "./BoneControl";
import CatControl from "./CatControl";
import DogControl from "./DogControl";const {ccclass, property} = cc._decorator;@ccclass
export default class MouseControl extends cc.Component {@propertySpeed: number = 200;//老鼠移动速度//计分控件@property(cc.Label)num_kills: cc.Label = null;//计分控件@property(cc.Label)num_Bones: cc.Label = null;//计分控件@property(cc.Label)num_agreenments: cc.Label = null;DirectionX: number = 0;//0->不动,1->前,-1->后DirectionY: number = 0;//0->不动,1->右,-1->左/*游戏中记录结果的参数*/BoneNumber: number = 0;//骨头的数目KillCatNumber: number = 0;//杀死猫的数目DealNumber: number = 0;//达成协议的个数onLoad () {//给老鼠添加监听器cc.systemEvent.on(cc.SystemEvent.EventType.KEY_DOWN, this.onKeyDown, this);cc.systemEvent.on(cc.SystemEvent.EventType.KEY_UP, this.onKeyUp, this);//开启物理特性cc.director.getPhysicsManager().enabled = true;//开启碰撞检测cc.director.getCollisionManager().enabled = true;}//键盘按下事件onKeyDown(event){switch(event.keyCode) {//按下a，则老鼠向前case cc.macro.KEY.w:console.log('老鼠前进');this.DirectionY = 1;break;case cc.macro.KEY.s:console.log('老鼠后退');this.DirectionY = -1;break;case cc.macro.KEY.a:console.log('老鼠向左');this.DirectionX = -1;break;case cc.macro.KEY.d:console.log('老鼠向右');this.DirectionX = 1;break;}}//按键松下事件onKeyUp(event){if(event.keyCode==cc.macro.KEY.w&&this.DirectionY==1){this.DirectionY=0;}if(event.keyCode==cc.macro.KEY.s&&this.DirectionY==-1){this.DirectionY=0;}if(event.keyCode==cc.macro.KEY.a&&this.DirectionX==-1){this.DirectionX=0;}if(event.keyCode==cc.macro.KEY.d&&this.DirectionX==1){this.DirectionX=0;}}start () {}//在update中修改位置更自然update (dt) {this.node.x+=this.DirectionX*this.Speed*dt;this.node.y+=this.DirectionY*this.Speed*dt;}//检测碰撞onCollisionStay(other){if(other.tag==1){//如果接到的是骨头console.log("与骨头发生碰撞")this.BoneNumber++;this.num_Bones.string = this.BoneNumber+"";let bone = other.getComponent(BoneControl);bone.die();}if(other.tag==2){//如果接到的是猫console.log("与猫发生碰撞")let cat = other.getComponent(CatControl);//检测有没有和狗的协议if(this.DealNumber>0){//协议数减一this.DealNumber--;this.num_agreenments.string = this.DealNumber+"";//猫死亡cat.die();this.KillCatNumber++;this.num_kills.string = ""+this.KillCatNumber;}else{//猫胜利cat.vectory();//自己死亡this.die();}}if(other.tag==3){console.log("与狗发生碰撞")//如果接到的是狗let dog = other.getComponent(DogControl);//检测骨头数是否大于0，用于和狗狗交易if(this.BoneNumber>0){//骨头数减一this.BoneNumber--;this.num_Bones.string = this.BoneNumber+"";//狗狗离开dog.die();//协议数加一this.DealNumber++;this.num_agreenments.string = this.DealNumber+"";}else{//狗狗胜利dog.vectory();//狗狗吃了老鼠this.die();}}}die(){// 停止 Player 节点的跳跃动作this.node.stopAllActions(); // 重新加载场景 gamecc.director.loadScene('Game');//销毁自己this.node.destroy();}}

4.3 运行结果
在这里插入图片描述
4.4 资源及代码
链接：https://pan.baidu.com/s/1YOlpKq6HIwxoXAg4sIzaKg
提取码：vbua
–来自百度网盘超级会员V3的分享

Cocos Creator版本是2.4.7哦，如有错误还请指导。

这篇关于小老鼠历险记Cocos Creator的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！


http://www.chinasem.cn/article/197793。

相关文章

Debugging Lua Project created in Cocos Code IDE creates “Waiting for debugger to connect” in Win-7

Debugging Lua Project created in Cocos Code IDE creates “Waiting for debugger to connect” in Win-7

转自 I Installed Cocos Code IDE and created a new Lua Project. When Debugging the Project(F11) the game window pops up and gives me the message waiting for debugger to connect and then freezes. Also a
阅读更多...
在 Qt Creator 中，输入 /** 并按下Enter可以自动生成 Doxygen 风格的注释

在 Qt Creator 中，输入 /** 并按下Enter可以自动生成 Doxygen 风格的注释

在 Qt Creator 中，当你输入 /** 时，确实会自动补全标准的 Doxygen 风格注释。这是因为 Qt Creator 支持 Doxygen 以及类似的文档注释风格，并且提供了代码自动补全功能。 以下是如何在 Qt Creator 中使用和显示这些注释标记的步骤： 1. 自动补全 Doxygen 风格注释 在 Qt Creator 中，你可以这样操作： 在你的代码中，将光标放在
阅读更多...
git管理历险记

git管理历险记

本篇文章主要是记录一下公司内git管理策略的变更，又如何因地制宜的磨合出适合团队的方法论，以便未来的职业生涯遇到类似的问题可以稍微触类旁通下。 传统git策略 dev -> test -> pre -> main 这也是比较经典的一个环境对应一个分支，许多没有并行开发需求的公司都会使用这个。 但是开始并行开发多个需求就遇到了问题： 所有代码都在环境分支上开发，可能导致dev、test分支
阅读更多...
ubuntu下qt编译显示Cannot connect creator comm socket /tmp/qt_temp.xxx/stub-socket的解决办法

ubuntu下qt编译显示Cannot connect creator comm socket /tmp/qt_temp.xxx/stub-socket的解决办法

Cannot connect creator comm socket /tmp/qt_temp.u14973/stub-socket: No such file or directory   于是查了一下，知道qt不能用gnome-terminal执行，需要使用x-team，于是想到了解决方法： 找到：工具（Tools）->环境（environment）->系统(Sy
阅读更多...
王楠首次讲述Cocos Creator背后的故事

王楠首次讲述Cocos Creator背后的故事

Cocos Creator发布至今，得到了许多开发者的支持和喜爱，甚至有小伙伴留言说：幸福来得太突然。水滴石穿，非一日之功。这款工具从诞生到问世究竟经历了怎么样的曲折，未来又会走向何方?这方面，大概没有谁比Cocos Creator制作人王楠更有发言权了。 　　今天不妨抽出10分钟，听听王楠的讲述，相信或多或少会对你有所启发。 　　开发Cocos Creator的初衷是什么? 　　我和几
阅读更多...
creator物理引擎 /RPG运动类型 /坦克

creator物理引擎 /RPG运动类型 /坦克

1 applyForce/ToCenter(). 这个力怎么计算 （牛顿第二定律F=ma） 2 .linearVelocity()是像素/米 （看源码） 3 why到第四帧才有速度 CocosCreator官方文档物理引擎Demo（physics-example，下载链接：https://github.com/2youyou2/physics-example） ----------------
阅读更多...
creator 物理引擎 骨骼动画 TS

creator 物理引擎 骨骼动画 TS

物理引擎 cocos论坛 遇到坑： 1 不会发生碰撞：A无Collider碰撞组件. B未添加分组***重要 2 获取质量世界坐标=0？ 弄了一天 3 碰撞回调函数不会调用；A 碰撞组件依附的节点下挂的脚本中有实现以下函数 B 开启enableContractListener 4 动态调整反弹力: 找不到函数,官网也找不到。setRestitution() 解决：断点看有哪些value和funct
阅读更多...
解决Qt Creator与MSVC不匹配的问题

解决Qt Creator与MSVC不匹配的问题

解决Qt Creator与MSVC不匹配的问题 解决调试环境的缺失问题 首先安装window调试器，点击：下载winsdksetup.exe，然后仅需要选择Debugging Tools这一项，安装调试环境即可。 新建MSVC编译器 新编译器要通过克隆旧的编译器实现。将ABI选为自定义，选择MSVC2017，然后选择正确的bit，就完成了编译的新建。
阅读更多...
问题记录之Qt Creator下qDebug中文乱码

问题记录之Qt Creator下qDebug中文乱码

前言 环境如下 Windows11Qt5.14.2 + MingWQt Creator 4.11.1 现象如下,调试模式下qDebug输出中文乱码 运行模式下，qDebug输出中文正常显示 解决记录 第一步 升级Qt Creator，由Qt Creator 4.11.1升级为Qt Creator 13.0.2 ，此时效果如下图 第二步 修改windows语言设置 设置 -->
阅读更多...
【第一章】Cocos Creator 3.8

【第一章】Cocos Creator 3.8

一、Cocos Creator 介绍 Cocos Creator 既是一款高效、轻量、免费开源的跨平台 2D&3D 图形引擎，也是一个实时 2D&3D 数字内容创作平台。拥有 高性能、低功耗、流式加载、跨平台 等诸多优点，您可以用它来创作 游戏、车机、XR、元宇宙 等领域的项目。 二、主要学习方向 1、场景制作 2、资源系统 3、脚本指南及事件系统 4、发布跨平台游戏 5、图形渲染 6、2D
阅读更多...

Copyright China编程 23002807@qq.com

沪ICP备2023033072号-2