1.pixi.js编写的塔防游戏(类似保卫萝卜)-设计逻辑

news2024/11/13 8:00:28

游戏说明

一个用pixi.js编写的h5塔防游戏,可以用electron打包为exe,支持移动端,也可以用webview控件打包为app在移动端使用

环境说明

  cnpm@6.2.0  
  npm@6.14.13  
  node@12.22.7  
  npminstall@3.28.0  
  yarn@1.22.10  
  
  npm config list  
  electron_mirror = "https://npm.taobao.org/mirrors/electron/"  
  home = "https://www.npmjs.org"  
  registry = "https://registry.npmmirror.com/"  

 核心技术点介绍:

  • 场景数据储存与编辑(场景编辑器)
  • 四叉树的应用
  • a星寻路的应用
  • 子弹跟随spine单位移动
  • 游戏资源打包逻辑gameData.bin说明
  • plist在pixi.js中的使用

目录说明:

目录说明可以点击下面的链接

目录

一些类的继承说明:

behaviorTree.ts 行为管理类 主要作用自动开枪,自动发言,自动追击敌人等行为

openApi.ts 脚本管理类 主要作用控制UI的创建,创建物品,事件的监听

gameMenu.ts 游戏esc健菜单管理 控制菜单的显示隐藏

camera.ts 镜头操作场景位置的一个对象(暂未完善)

main.ts 游戏核心对象 主要控制游戏的一个整体逻辑

gameMain.ts 塔防游戏的主要控制的整体逻辑

gameText.ts 漂浮文字类 人物在被打的时候会向上提示语言,伤害文字显示

bullet.ts 子弹类 子弹的追踪,移动,曲线移动,直线移动

goods.ts 物品基本类 物品丢弃,物品拾取

gun.ts 枪的基本类 在物品的基础上增加了枪特有的逻辑

enemy.ts 敌人基本类 

tower.ts 塔基本类 

tiledmap.ts 瓦片图类 主要根据场景数据生成背景图 

加载逻辑:

  1. 浏览器加载html,css,js资源
  2. 加载gameData.bin游戏打包资源数据
  3. 加载config.json配置文件

  4. 根据配置语言项加载语言包

  5. 加载mod数据重写gameData里面的数据

  6. 将加载gameData的数据写入并加载进内存

  7. 加载运行core.js

  8. 加载场景运行脚本

游戏中常用的数学碰撞判断:

polygonBox 形状与矩形的碰撞判断

boxBox ps:(aabb)盒子碰撞判断

游戏运行截图:

这是我们要做的目标:

 

项目开源地址:

https://github.com/yinhui1129754/towerDefense

游戏开发交流群:

859055710

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/656538.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

1.2 聚合工程与springboot整合

步骤1&#xff1a; 在顶级父工程中添加springboot相关的pom配置 <!--springboot父级依赖&#xff0c;表示是一个是springboot项目 --> <parent><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-parent</artifa…

vue3(基于vite)项目初始基本配置

简介 一个好的项目开始搭建总是需要配置许多初始化配置&#xff0c;比如eslint语法检验、prettier代码格式统一、husky做commit拦截等等&#xff0c;本文从零开始带你一步步搭建一个完整的项目配置&#xff0c;熟悉之后下次直接拿来即用 环境准备 node v16以上pnpm 8.0.0 1.新…

4.3.3 info page

在所有的Unix Like系统当中&#xff0c;都可以利用 man 来查询指令或者是相关文件的用法&#xff1b; 但是&#xff0c;在Linux里面则又额外提供了一种线上求助的方法&#xff0c;那就是利用info。 基本上&#xff0c;info与man的用途其实差不多&#xff0c;都是用来查询指令的…

看完就会,从抓包到接口测试的全过程解析!

一、为什么抓包 1、从功能测试角度 通过抓包查看隐藏字段 Web 表单中会有很多隐藏的字段&#xff0c;这些隐藏字段一般都有一些特殊的用途&#xff0c;比如收集用户的数据&#xff0c;预防 CRSF 攻击&#xff0c;防网络爬虫&#xff0c;以及一些其他用途。这些隐藏字段在界面…

数据库大题

(计算题&#xff0c;20分) 设有两个关系R和S,求① R ∪ S R \cup S R∪S;② R − S R - S R−S;③ R S R \times S RS;④ ∏ C , A ( R ) \prod_{C,A}(R) ∏C,A​(R);⑤ σ B > ′ 4 ′ ( R ) \sigma_{B>4}(R) σB>′4′​(R) 关系R关系S (简答题&#xff0c;10…

Telnet是什么协议?如何使用?

作者&#xff1a;Insist-- 个人主页&#xff1a;insist--个人主页 作者会持续更新网络知识和python基础知识&#xff0c;期待你的关注 目录 ​编辑 一、Telnet是什么协议&#xff1f; 二、Telnet用在哪&#xff1f; 三、Telnet协议的优点和缺点 ​编辑 1、优点 ①简单易…

Microservice架构模式简介

在2014年&#xff0c;Sam Newman&#xff0c;Martin Fowler在ThoughtWorks的一位同事&#xff0c;出版了一本新书《Building Microservices》。该书描述了如何按照Microservice架构模式设计及搭建一个具有良好扩展性并可持续开发的系统。除此之外&#xff0c;该书还将基于该模式…

pygame光栅化三角形 用像素填充三角形

参考文章 DirectX C 3D编程基础 5 [三角形光栅化] 自制中字 这次用像素填充三角形&#xff0c;是为了下次用图片做纹理填充三角形做准备。 前面的文章说了根据直线方程求出已知两点间任意一点的坐标&#xff0c;现在来试试用像素填充三角形。 首先画一个三角形 pygame.draw.…

whisperX 语音识别本地部署

WhisperX 是一个优秀的开源Python语音识别库。 下面记录Windows10系统下部署Whisper 1、在操作系统中安装 Python环境 2、安装 CUDA环境 3、安装Annaconda或Minconda环境 4、下载安装ffmpeg 下载release-builds包&#xff0c;如下图所示 将下载的包解压到你想要的路径&#xf…

华为OD机试之Boss分销提成计算(boss的收入)(Java源码)

Boss分销提成计算&#xff08;boss的收入&#xff09; 题目描述 一个XX产品行销总公司&#xff0c;只有一个boss&#xff0c;其有若干一级分销&#xff0c;一级分销又有若干二级分销&#xff0c;每个分销只有唯一的上级分销. 规定&#xff0c;每个月&#xff0c;下级分销需要将…

利用OpenCV做个熊猫表情包吧

有的时候很想把一些有意思的图中的人脸做成熊猫表情&#xff0c;但是由于不太会ps&#xff0c;只能无奈放弃&#xff0c;so sad... 正好最近想了解下opencv的使用&#xff0c;那就先试试做个简单的熊猫表情生成器把~~ 思路就是&#xff0c;工具给两个参数&#xff0c;一个是人…

矩阵卷积之边缘计算

目录 note code test note code // 不扩充边缘的矩阵卷积&#xff0c;输出矩阵和输入矩阵一样大 void MyMatConvolute2(Mat& src, Mat& kernel, Mat& res) {if (src.type() ! CV_8UC1) {return;}if ((kernel.type() ! CV_8UC1) || (kernel.rows ! kernel.cols) …

2023年端午节放假通知

过节、业务两不误&#xff0c;服务“不打烊”。欢迎新老客户前来咨询下单&#xff01;感谢各位一直以来的支持和信赖&#xff0c;你们是易天光通信成长道路上不可或缺的力量&#xff0c;提前祝大家在端午节玩得开心&#xff0c;吃得开心&#xff01; 深圳易天光通信有限公司 …

C#打印控件ReportViewer使用总结(三)

ReportViewer控件设计 在工具箱中添加ReportViewer控件&#xff0c;控件名称为reportViewer1。 2.绑定报表和数据集 /// <summary> /// 绑定报表和数据集 /// </summary> private void DataBing() { //绑定报表 this.reportViewer1.LocalReport.ReportPath Syste…

Java官方笔记8泛型

泛型 为什么需要泛型&#xff1f;generics enable types (classes and interfaces) to be parameters when defining classes, interfaces and methods. 说白了就像Python动态语言的变量&#xff0c;是动态的&#xff0c;可以指向任意类型。 泛型有个好处是不需要类型转换&…

有没有不限制群发数量的软件?

父亲节的由来 父亲节&#xff08;Fathers Day&#xff09;&#xff0c;顾名思义是感恩父亲的节日。 世界上第一个父亲节&#xff0c;1910年诞生于美国。 而中国的父亲节起源要追溯到民国时代。民国三十四年的八月八日&#xff08;1945.8.8&#xff09;&#xff0c;上海文人所…

git-在当前分支做变基(rebase current onto selected)

文章目录 git rebase变基git rebase使用场景git rebase还是git merge?在当前分支做变基使用总结 git rebase变基 初学git&#xff0c;在合并分支上必定会常用到 git merge 语法。git除了使用合并(merge)集成2个分支之间的更改&#xff0c;还有另外一种称为rebase的方法。 gi…

R -- corrplot包

文章目录 常用参数简介method测试部分type参数测试diag参数测试order参数测试 常用参数简介 corrplot包常用参数介绍&#xff1a; corr: 必需参数&#xff0c;表示相关性矩阵&#xff0c;可以是数据框或者矩阵。 method: 表示绘制相关性矩阵的方法&#xff0c;有以下几种取值…

H5语义化标签

语义化标签 HTML5引入了一组语义化标签,这些标签旨在更好地描述网页内容的结构和含义。通过使用这些标签,可以提高网页的可读性、可访问性、搜索引擎优化,以及代码的可维护性。以下是对HTML5语义化标签的详细解释: <header>:用于定义页面或区块的页眉部分,通…

centos8 KDC认证

20国赛公开卷KDC做法&#xff08;个人整理&#xff09; 先根据题意&#xff0c;用chrony服务同步时间 Linux-1为KDC服务器&#xff0c;认证Linux-2和Linux-3.三台都先同步时间。 所有的Linux selinux都为enforcing&#xff0c;防火墙都是打开的。此次为临时测试整理&#xff…