html5游戏工具,html5网页游戏

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

Egret Wing

Egret Wing是一款开源免费的HTML5游戏开发工具，Egret Wing支持目前市面主流的开发语言和技术，作为一款可视化编辑器，它可以帮你提高开发效率。这款工具还支持 Node.js 开发扩展插件，可以让你更好的定制化自有内容。

渲染模式：dom，cavase，webGL

不同的地图、不同的元素，好玩的道具（充值付费获得道具、融合形成新的道具）

创建项目-资源（json/png）resDepot-模块game

地图、步数、道具、消除

1.地图：元素按照地图排列

最大宽高格子数为8

形状可配置

包含自己的背景图

不同关卡背景图不同

无论地图形状如何改变，尺寸不变

2.步数：

不同关卡步数不同

步数为0时，游戏结束

3.道具

一共五种道具，道具功能不同，使用道具时候不消耗步数，来源于游戏奖励

4.消除：

三个及以上相同元素可消除

元素随机出现

初局开始时，不可有消除元素

没有可消除元素时，自动乱序

数据：地图数据、基础数据、关卡数据、道具数据

视图：元素、背景、关卡、道具

逻辑：主逻辑控制器、数据解析器、地图数据控制器、算法控制器、视图控制器

mapData:

一维数组：数据整理方便，下标

二维数组：空间表示方便，获取位置方便

index = row * 8 + column

json数据描述

地图配置信息如何描述

{"map": [0,1,8,9,6,7,14,15]} 一维数组记录不展示以及不可放置元素的方格

游戏元素数据设计

元素：type、ID（唯一）、location

eg:

mapData[3][6] = element.ID

elements[mapData[3][6]] 元素对象池访问想要的数据

ID:45

location:30

public static unmapnum: number = 0;//空白地图块数量

public static mapData: number[][]; //游戏地图,-1表示块地图不能使用，－2表示，此地图没有元素

public static stepNum: number = 0;//玩家剩余步数

public static levelStepNum: number = 0;//当前关卡步数

public static elementTypes: number[];//当前关卡出现的元素类型

public static unusedElements: number[];//游戏中未使用得元素，仅记录元素ID

public static levelBackgroundImageName = ""; //当前关卡背景图资源名

public static MaxRow: number = 8;//最大的行

public static MaxColumn: number = 8;//最大的列

public static currentElementNum: number = 0;//当前关卡游戏中地图可用元素数量

public static levelReq: LevelRequire;//当前关卡过关条件

public static elements: GameElement[];//游戏中出现得元素数据池，最多为64个，因为8*8

//舞台宽高，此封装为了方便调用

public static stageW: number = 0;

public static stageH: number = 0;

DisplayObjectContainer

public constructor() {

super();

this.addEventListener(egret.Event.ADDED_TO_STAGE, this.onAddToStage, this);

}

Sprite 类是基本显示列表构造块：一个可包含所有子项的显示列表节点

Sprite() 实例化一个容器

1.背景

var gbg:GameBackGround = new GameBackGround();

this._gameStage.addChild(gbg);

gbg.changeBackground();

2.地图

this.mapc = new MapControl();

this.mapc.createElementAllMap();

3.过关条件

let lec:egret.Sprite = new egret.Sprite();

this._gameStage.addChild(lec);

this.levm = new LevelReqViewManage(lec);

this.levm.createCurrentLevelReq();

4.元素

let cc:egret.Sprite = new egret.Sprite();

this._gameStage.addChild(cc);

this.evm = new ElementViewManage(cc);

this.evm.showAllElements();

1.寻找可消除元素

2.预检索可消除元素算法设计与实现

3.是否可以互相交换

交换后是否可以消除

相关问答

Q1: 常见的HTML5工具有哪些

推荐我们的 Epub360，专业H5页面制作工具，可以灵活制作邀请函、小游戏、招聘、节日贺卡等多种类型。

关于编辑器专业能力

专业交互功能

支持专业级动画控制、交互设定、社交应用与数据应用，保障企业的商业需求顺利实现。

操作简易、流畅

采用由简到难递进式产品设计模式，效果组件化，减少用户上手难度，稳定的操作环境助力企业持续创意输出。

提供企业/媒体培训和定制服务

我们为企业/媒体单位提供H5工具培训及定制服务，定制服务包含扫码签到、大屏互动、H5游戏等多种场景，是上海解放日报、招商银行、广西日报等多家单位长期合作伙伴。

提供优质模板库

提供丰富的模板库，500+优质的企业H5模板，各种邀请函、招聘、节日海报、H5小游戏应有尽有。

提供私有化部署服务

上海意派科技的私有化部署系统功能架构覆盖功能层、服务层、系统支撑层三个层级。

功能层：

H5内容管理、H5编辑器、H5发布管理、H5访问统计、H5数据收集、素材资源管理、表单管理、数据库定义、个人账号信息管理。

服务层：

用户管理、素材资源管理、H5作品管理、作品播放、表单管理、数据库管理、访问统计、微信jssdk、微信授权、H5互动数据处理、数据库服务、语音、图片处理、消息列队。

系统支撑层：

Django应用服务器、MySQL 数据库存储、MongoDB、Redis 内存数据库、Memcache 缓存、OSS文件存储、OpenSearch、Celery 列队

对比一些简易化的模板平台，意派Epub360 H5平台可以使用更专业的组件，创造更多创意的可能，更大的创作自由空间以及更多的营销数据效果。

Q2: html5游戏开发工具常用的有哪几款

为大家推荐12款经常会用到的html5开发工具。

1、Adobe Dreamweaver CS6

Dreamweaver CS6是世界顶级软件厂商Adobe推出的一套拥有可视化编辑界面，用于制作并编辑网站和移动应用程序的网页设计软件。由于Dreamweaver支持代码、拆分、设计、实时视图等多种方式来创作、编写和修改网页，对于初级人员，你可以无需编写任何代码就能快速创建Web页面。其成熟的代码编辑工具更适用于Web开发高级人员的创作！

2、Adobe Edge

Adobe Edge是一个用HTML5、CSS、Java开发动态互动内容的设计工具。它的一个重要功能是web工具包界面，用于方便确保在不同浏览器中架构的一致性，此外，Adobe Edge还将整合TypeKit这样的字体服务。通过Edge设计的内容可以兼容iOS和Android设备，也可以运行在火狐、Chrome、Safari和IE9等主流浏览器上。

3、DevExtreme

DevExtreme Complete Subion是性能最优的HTML5,CSS和Java移动开发框架，可以直接在Visual Studio集成开发环境，构建iOS，Android，Tizen和Windows Phone 8应用程序。DevExtreme包含 PhoneJS 和 ChartJS 两个原生UI组件，并且提供源代码。目前，DevExtreme支持VS2010/2012/2013集成开发环境，兼容Android 4+、iOS5+、Windows 8、Window Phone 8、Tizen五大移动平台，是Visual Studio开发人员开发跨平台移动产品的首选工具。

4、JetBrains WebStorm

WebStorm 是jetbrains公司旗下一款JS开发工具。被广大中国JS开发者誉为“Web前端开发神器”、“最强大的HTML5编辑器”、“最智能的JavaS IDE”等。与IntelliJ IDEA同源，继承了IntelliJ IDEA强大的JS部分的功能。

5、Sencha Architect

在开发移动和桌面应用的工具中，Sencha的定位是HTML5可视化应用开发。开发团队可以在一个单一集成的环境中完成应用的设计、开发和部署。开发者还可以开发Sencha Touch2和Ext JS4 Java应用，并实时预览。

6、Initializr

Initializr 是制作 HTML5 网站最好的入门辅助开发工具，你可以使用提供的特色模板快速生成网站，也可以自定义，Initializr 会为你生成代码简洁的可定制的网页模板。

7、HTML5demos

想知道你的浏览器是否支持 HTML5 Canvas 吗？想知道 Safari 是否可以运行简单的 HTML5 聊天客户端吗？HTML5demos 会告诉你每一个HTML5特性在哪些浏览器中支持。

8、HTML5 Tracker

想了解 HTML5的最新动向吗? 使用 HTML5 Tracker 吧，它可以跟踪 HTML5 最新修订信息。

9、HTML5 visual cheat sheet

想要快速超找一个标签或者属性吗？看看这个非常酷的速查手册吧，每个Web开发人员的必备。