掉瓶子小游戏
欢迎来到程序小院
掉瓶子
玩法:旋转的瓶子,根据瓶子方向,点击鼠标左键瓶子掉落,从桌面中间掉下即得1分,卡在桌边瓶子碎了游戏结束,快去掉瓶子吧^^。
开始游戏
https://www.ormcc.com/play/gameStart/203

html
<div id="phaser-example" style="text-align: center;"></div>
css
body{margin: 0%;padding: 0%;
}
js
gameover = false;
//console.log(this.sound);
var bg = this.add.image(0, 0, 'bg').setOrigin(0);
bg.width = game.config.width;
bg.height = game.config.height;//bottle = this.add.sprite(0, 0, 'bottle').setOrigin(0.5).setScale(0.2).setInteractive();
bottle = this.physics.add.sprite(0, 0, 'bottle').setOrigin(0.5).setScale(0.2);
bottle.body.offset.set(bottle.width*2,0);//设置身体偏移量 锚点缩小2倍 偏移需放大2倍
bottle.isRotation = true;
//对象在游戏内居中
// bottle.x = (game.config.width - bottle.width*bottle.scaleX)/2;
// bottle.y = (game.config.height - bottle.height*bottle.scaleY)/2;
bottle.x = (game.config.width - bottle.width*bottle.scaleX)/1.85;
bottle.y = (game.config.height - bottle.height*bottle.scaleY)/4;
bottle.on('pointerdown', function (pointer) { //对象的事件监听器//this.setTint(0xff0000); //设置当前元素的填充色});
this.input.on('pointerdown', function (pointer) {bottle.isRotation = false;bottle.body.gravity.y = 500;//game.sound.play('swing');});tables = this.physics.add.staticGroup();
tablel = tables.create(320 - 560/1.67, 480 - 700/4, 'tablel').setScale(0.5);
//tablel.body.y = 340;
tabler = tables.create(560/1.49, 480 - 700/4, 'tabler').setScale(0.5);scoreText = this.add.text(0,0,score);
scoreText.setColor('#0');
scoreText.setFontSize(36);
Phaser.Display.Align.In.TopRight(scoreText, bg);
if(gameover){return;
}
if(bottle.isRotation == true){bottle.angle += angle;
}if (checkOverlap(bottle, tablel)) {collider = true;
} else {collider = false;
}
if (checkOverlap(bottle, tabler)) {collider = true;
} else {collider = false;
}if(collider & bottle.y > 340)
{bottle.destroy();//this.sound.play('sklo2');//此处播放粒子动画particles = this.add.particles('Debris');particles.createEmitter({setFrame: 'sprite-sheet0.png',//frame: [ 'sprite-sheet0.png', 'sprite2-sheet0.png', 'sprite3-sheet0.png' ],x: game.config.width/2,//横坐标y: 340,//纵坐标speed: 50,//速度gravityY: 200,//重力frequency: 1000,//频率lifespan: 2000,//周期alpha: { start: 1, end: 0 },scale: { min: 0.05, max: 0.4 },rotate: { start: 0, end: 360, ease: 'Back.easeOut' },angle: { min: 0, max: 360 },speed: { min: 10, max: 100 },quantity: 12,//一次性的数量on:!false//开关});this.time.addEvent({ delay: 1000, callback: destroyParticles, callbackScope: this });//gameovergameover = true;
}
if(bottle.y > game.config.height){//此处关卡通行进入下一级//this.sound.play('gift');score++;if(Math.floor(Math.random()*(9+1)) >= 5){angle = score;} else {angle = -score;}gameover = false;stateStart('demo',this);
}
// if (isNull(score)){
// scoreText.setText('score');
// }
scoreText.setText(score);
console.log(score);
var bg = this.add.image(0, 0, 'bg').setOrigin(0);
bg.width = game.config.width;
bg.height = game.config.height;
var bar = this.add.image(0,0,'bar').setOrigin(0).setScale(1,0.6);
bar.setX(0);
bar.setY(bar.height*bar.scaleY*1.25);
bar.width = game.config.width;
bar.height *= bar.scaleY;
scoreText = this.add.text(0,0,'Score:' + score);
var bestText = this.add.text(0,0,'Best:' + bestScore);
Phaser.Display.Align.In.Center(scoreText, bar);
scoreText.y -= scoreText.height;
Phaser.Display.Align.In.Center(bestText, bar);
bestText.y += bestText.height;
var overText = this.add.text(0,0,'Game Over');
overText.setColor('#0');
overText.setFontSize(36);
Phaser.Display.Align.In.TopCenter(overText, bg);
overText.y = bar.y - overText.height * 1.25;var btnRePlay = this.add.image(0,0,'btn').setScale(0.5).setInteractive();
Phaser.Display.Align.In.BottomCenter(btnRePlay, bg);
btnRePlay.y -= btnRePlay.height*btnRePlay.scaleY;
var that = this;
btnRePlay.on('pointerdown', function (pointer) {//game.sound.play('click');score = 0;angle = 1;//alert(this.scene.scene.key);//that.scene.setVisible(false);stateStart('demo',that);btnRePlay.destroy();
});
源码
需要源码请关注添加好友哦^ ^
转载:欢迎来到本站,转载请注明文章出处
https://ormcc.com/

相关文章:
掉瓶子小游戏
欢迎来到程序小院 掉瓶子 玩法:旋转的瓶子,根据瓶子方向,点击鼠标左键瓶子掉落,从桌面中间掉下即得1分,卡在桌边瓶子碎了游戏结束,快去掉瓶子吧^^。开始游戏https://www.ormcc.com/play/gameStart/203 htm…...
Elasticsearch7 入门 进阶
1、全文检索 1.1、数据分类 按数据分类的话,主要可以分为以下三类: 结构化数据:固定格式、有限长度,比如mysql存的数据非结构化数据:不定长、无固定格式,比如邮件、Word文档、日志等半结构化数据…...
你是怎么封装微信小程序的数据请求的?
当封装微信小程序的数据请求时,可以采用一种模块化的方法,将请求逻辑与界面逻辑分离,以提高代码的可维护性和可扩展性。以下是一个基于前言、高质量代码、理解、优缺点和结尾的范例: 前言 在微信小程序中,数据请求是…...
C++ vector中capacity()和size() 的区别
size是指容器当前拥有元素的个数, capacity是指容器在必须分配新的存储空间之前可以存放的元素总数。 如vector<int> ivect(10),ivect.capacity()10,ivect.size()0, 当向ivect中插入元素时,只要没有超过10个,那么capacity就…...
【Redis】redis-server和redis-cli
上一篇《redis 的下载和安装》 https://blog.csdn.net/m0_67930426/article/details/134341071?spm1001.2014.3001.5501 安装完之后开始使用 打开客户端之前需要先打开服务端 redis-server 直接使用该命令打开就行 然后在打开客户端 redis-cli 使用ping命令查看是否连接服…...
【系统架构设计】架构核心知识: 2.4 系统建模过程和系统设计
目录 一 系统建模过程 1 结构化建模 2 信息工程建模方法 3 面向对象建模方法...
企业电子招标采购系统源码之从供应商管理到采购招投标、采购合同、采购执行的全过程数字化管理
功能描述 1、门户管理:所有用户可在门户页面查看所有的公告信息及相关的通知信息。主要板块包含:招标公告、非招标公告、系统通知、政策法规。 2、立项管理:企业用户可对需要采购的项目进行立项申请,并提交审批,查看所…...
ubantu libssl.so.1.1: cannot open shared object file
libssl.so.1.1: cannot open shared object file 使用 Ubuntu 22.04 时,有时候会遇到如下错误 error while loading shared libraries: libssl.so.1.1: cannot open shared object file: No such file or directory 这是因为Ubuntu 22.04 默认使用的是 openssl3.0 …...
python matlplotlib/seaborn 绘制曲线的平均值标准差阴影图
1. seaborn 旧版本(0.8.1)中使用tsplot,新版本中使用lineplot 直线代表均值,阴影代表meanstd(带有置信区间,参数ci) import seaborn as sns import matplotlib.pyplot as plt import numpy as np import pandas as p…...
【Linux基础IO篇】深入理解文件系统、动静态库
【Linux基础IO篇】深入理解文件系统、动静态库 目录 【Linux基础IO篇】深入理解文件系统、动静态库再次理解文件系统操作系统内存管理模块(基础)操作系统如何管理内存 Linux中task_struct源码结构 动态库和静态库动静态库介绍:生成静态库库搜…...
flink 写入 starrocks 报错 too many filtered rows attachment
可能原因1 把你starrocks中DDL里的varchar(...) 先修改为STRING. 一般是因为字段超出定义的长度. 可能原因2 csv里有脏数据 导致3列被切分为4列 ....PRIMARY KEY (id) NOT ENFORCED ) WITH (connector starrocks,jdbc-url ...,username ...,password ...,database-nam…...
Windows 安装 Maven
目录 安装 JDK下载 Maven配置阿里云镜像配置环境变量 安装 JDK Windows 安装 JDK 下载 Maven 下载地址:https://maven.apache.org/download.cgi 下载 apache-maven-3.9.5-bin.zip 到本地解压到 D:\Software\apache-maven-3.9.5 配置阿里云镜像 配置阿里云远程仓…...
一文读懂关于IPv6的那些事
作为下一代互联网的战略发展方向,我国正加速IPv6的升级改造,目前从网络基础设施如运营商骨干网、城域网到互联网服务商如各类云服务以及包括手机、电脑、路由器等终端设备厂商都开始支持IPv6网络。那么到底什么是IPv6?IPv6有哪些特点呢&#…...
数据结构—队列的实现
前言:上次我们已经学习了数据结构中一个重要的线性表—栈,那么我们这一次就来学习另外一个重要的线性表—队列。 目录: 一、 队列的概念 二、 队列的实现: 1.队列的创建 三、 队列的操作 1.初始化队列 2.队尾入队列 3.队头出队列…...
Linux_shell脚本中的stty
shell脚本中的stty stty是用于配置终端(tty)设置的命令。它允许用户查看和修改与终端相关的各种参数。下面是stty命令的一些常见用法和参数: 基本语法: stty [OPTION] [SETTING]常见选项和参数: 基本设置࿱…...
HTML转PDF模板
一、准备pom依赖 <dependency><groupId>com.itextpdf</groupId><artifactId>html2pdf</artifactId><version>1.0.2</version></dependency><dependency><groupId>org.freemarker</groupId><artifactId&g…...
Clickhouse学习笔记(14)—— Clickhouse监控
ClickHouse 运行时会将一些个自身的运行状态记录到众多系统表中,如下所示: 为了直观方便地监控ck的运行情况,使用Prometheus Grafana 的组合来进行监控 Prometheus 负责收集各类系统的运行指标;Grafana 负责可视化 Prometheus&a…...
Vue3 + Three.js + gltf-pipeline大型园区场景渲染与3D业务
在非使用unity作为3D渲染方案的前提下,对与目前web开发者比较友好的除了canvas场景需要的2D babylon.js,fabric.js, Three.js是目前针对于jsWeb用户最直接且比较友好的3D引擎方案了。 准备工作: 1.明确需要用的场景方案都有那些,模…...
基于FPGA的PS端的Si5340的控制
1、功能 Si5340/41-D可以输出任意频率,当然有范围,100Hz1GHz。外部输入为24M或者4854M的XTAL,VCO在13500~14256Mhz之间,控制接口采用IIC或者SPI。 芯片架构图 2、IIC控制方式 3、直接上控制代码 使用米联客ZU3EG,将…...
安装 Lua 的 HTTP 库
首先,你需要安装 Lua 的 HTTP 库。可以使用 LuaRocks 来安装。以下是安装命令: luarocks install http然后,你可以使用以下代码来爬取网页内容: local http require http-- 设置代理信息 http.set_proxy(jshk.com.cn)-- 网页UR…...
第19节 Node.js Express 框架
Express 是一个为Node.js设计的web开发框架,它基于nodejs平台。 Express 简介 Express是一个简洁而灵活的node.js Web应用框架, 提供了一系列强大特性帮助你创建各种Web应用,和丰富的HTTP工具。 使用Express可以快速地搭建一个完整功能的网站。 Expre…...
React 第五十五节 Router 中 useAsyncError的使用详解
前言 useAsyncError 是 React Router v6.4 引入的一个钩子,用于处理异步操作(如数据加载)中的错误。下面我将详细解释其用途并提供代码示例。 一、useAsyncError 用途 处理异步错误:捕获在 loader 或 action 中发生的异步错误替…...
RocketMQ延迟消息机制
两种延迟消息 RocketMQ中提供了两种延迟消息机制 指定固定的延迟级别 通过在Message中设定一个MessageDelayLevel参数,对应18个预设的延迟级别指定时间点的延迟级别 通过在Message中设定一个DeliverTimeMS指定一个Long类型表示的具体时间点。到了时间点后…...
线程与协程
1. 线程与协程 1.1. “函数调用级别”的切换、上下文切换 1. 函数调用级别的切换 “函数调用级别的切换”是指:像函数调用/返回一样轻量地完成任务切换。 举例说明: 当你在程序中写一个函数调用: funcA() 然后 funcA 执行完后返回&…...
电脑插入多块移动硬盘后经常出现卡顿和蓝屏
当电脑在插入多块移动硬盘后频繁出现卡顿和蓝屏问题时,可能涉及硬件资源冲突、驱动兼容性、供电不足或系统设置等多方面原因。以下是逐步排查和解决方案: 1. 检查电源供电问题 问题原因:多块移动硬盘同时运行可能导致USB接口供电不足&#x…...
高危文件识别的常用算法:原理、应用与企业场景
高危文件识别的常用算法:原理、应用与企业场景 高危文件识别旨在检测可能导致安全威胁的文件,如包含恶意代码、敏感数据或欺诈内容的文档,在企业协同办公环境中(如Teams、Google Workspace)尤为重要。结合大模型技术&…...
IT供电系统绝缘监测及故障定位解决方案
随着新能源的快速发展,光伏电站、储能系统及充电设备已广泛应用于现代能源网络。在光伏领域,IT供电系统凭借其持续供电性好、安全性高等优势成为光伏首选,但在长期运行中,例如老化、潮湿、隐裂、机械损伤等问题会影响光伏板绝缘层…...
爬虫基础学习day2
# 爬虫设计领域 工商:企查查、天眼查短视频:抖音、快手、西瓜 ---> 飞瓜电商:京东、淘宝、聚美优品、亚马逊 ---> 分析店铺经营决策标题、排名航空:抓取所有航空公司价格 ---> 去哪儿自媒体:采集自媒体数据进…...
【Java学习笔记】BigInteger 和 BigDecimal 类
BigInteger 和 BigDecimal 类 二者共有的常见方法 方法功能add加subtract减multiply乘divide除 注意点:传参类型必须是类对象 一、BigInteger 1. 作用:适合保存比较大的整型数 2. 使用说明 创建BigInteger对象 传入字符串 3. 代码示例 import j…...
A2A JS SDK 完整教程:快速入门指南
目录 什么是 A2A JS SDK?A2A JS 安装与设置A2A JS 核心概念创建你的第一个 A2A JS 代理A2A JS 服务端开发A2A JS 客户端使用A2A JS 高级特性A2A JS 最佳实践A2A JS 故障排除 什么是 A2A JS SDK? A2A JS SDK 是一个专为 JavaScript/TypeScript 开发者设计的强大库ÿ…...
