现在我们使用egret来起步开发一个名叫《成语大挑战》的小游戏,关于egret的开发环境就不在这里啰嗦了,直接去官方下载安装就可,egret是我见过开发环境部署最简单的解决方案,这个系列教程中,使用了egret的Wing和ResDepot,只需要安装这两个就行,首先打开EgretWing,选择创建项目,输入你想要的项目名称,项目类型为“Egret EUI项目”,然后下一步:

由于游戏设计的是竖屏,而素材的分辨率为720x1136,所以设置是如上的选择,然后选择完成,稍等就会构建一个模板项目出来,只需要在此基础上进行开发,这时对于有洁癖的我来说,比较忍受不了的是模板中提供的默认皮肤,由于我们是自己有资源素材开发游戏,所以这些默认资源没什么用,可是创建空egret项目的话,配套的eui设置就得自己搞了,所以才用模板创建好了之后以下操作方式干掉没用的资源:

   

直接删除掉assets下的文件和eui_skins目录素材之后,还得要去编辑“default.res.json”和“default.thm.json”文件,确保它们没问题,首先打开“default.res.json”,删除清理掉丢失掉的资源:

然后打开“default.thm.json”文件,将没用配置给删除掉,最后变成如下的模样

顿时觉得清爽多了,这只是我的个人喜好,按照上面方法可以创建一个比较干净的项目。

下面将准备的资源放入到项目中,在assets目录下建立三个目录:“images”、“res”、“sound”,这三个目录的说明:

images:这里存放了游戏中的题目图片,由于有400道题目,所以,题目图片还是按需加载比较靠谱,大约有13MB

res:这里存放了游戏的ui图片等,将来要preload预先加载,将它们放在一起的原因是将来方便整合打包

sound:这是游戏的音乐和音效,至于是否要提前加载,看个人情况而定,本项目中使用异步加载

素材资源下载,请查看文章尾部的附件。

然后刷新当前项目,双击打开“default.res.json”,你就会发现有这个提示:

此时,建议不要点是,而是点否,自己通过拖拽进来按照自己需要安排资源比较好控制,将需要预先加载的资源扔到preload组里面

好了,在开搞之前的准备工作已经完成了,后面就可以进入正式状态了,敬请浏览下一篇

本篇中所使用的附件素材在这里下载:

成语大冒险图片1.zip 

成语大冒险图片2.zip

成语大冒险图片其他.zip

由于博客园限制,只能上传分为3个包了

Html5 Egret游戏开发 成语大挑战(二)干净的eui项目和资源准备的更多相关文章

  1. Html5 Egret游戏开发 成语大挑战(一)开篇

    最近接触了Egret白鹭引擎,感觉非常好用,提供了各种各样的开发工具让开发者和设计者更加便捷,并且基于typescript语言开发省去了很多学习成本,对于我们这种掉微软坑许久的童鞋来说,确实很有吸引力 ...

  2. Html5 Egret游戏开发 成语大挑战(八)一般性二级页面处理

    在游戏中,我们一般会有各种各样的二级页面,比如游戏暂停界面或者游戏结束界面,这些界面组成了对玩家交互主要手段,在游戏开发中,对于这些界面的coding组织是非常有学问的,如果倒退到十年前,游戏开发的老 ...

  3. Html5 Egret游戏开发 成语大挑战(六)游戏界面构建和设计

    本篇将主要讲解游戏界面的构建和设计,会应用到egret.eui的自定义组件,可以很直观的构建一个游戏整体,这里我们仍然只需要使用EgretWing就可以达到目的,本篇可能是篇幅最少的一个,但是涉及自定 ...

  4. Html5 Egret游戏开发 成语大挑战(九)设置界面和声音管理

    在上一篇中,简单的使用界面元素快速实现了一个游戏中的二级页面,这种直接在游戏页面上做UI的做法并不太好,原因是,UI会让游戏的压力变大,即使它是隐蔽的,如果同样的功能在其它的地方也是一样的,那么就要写 ...

  5. Html5 Egret游戏开发 成语大挑战(七)游戏逻辑和数据处理

    本篇在前面的基础上,将进行逻辑的编码开发让游戏能够正式的玩起来,这里没有注重太多的体验细节,而是直接实现游戏的规则逻辑,将分成两个部分说明:数据处理和游戏逻辑. 初始化游戏数据 在前面的第五篇中,我们 ...

  6. Html5 Egret游戏开发 成语大挑战(四)选关界面

    通过前面的开始界面基本上了解了eui的使用方法,可以简单快速的制作一个UI界面,本篇使用第二界面选关界面展示更为难一点的代码控制,来展现关卡地图的内容,请确保素材和资源完整,可以在前面的教程中找到下载 ...

  7. Html5 Egret游戏开发 成语大挑战(三)开始界面

    本篇需要在前面的素材准备完毕,才可以开始,使用egret的eui结合代码编辑,快速完成基本的界面搭建,这里写的可能比较细,目的是减少大家对于其中一些操作疑问,我去掉了很多无用的步骤,以最精简的流程来完 ...

  8. Html5 Egret游戏开发 成语大挑战(五)界面切换和数据处理

    经过前面的制作,使用Egret的Wing很快完成了开始界面和选关卡界面,下面通常来说就是游戏界面,但此时界面切换和关卡数据还没有准备好,这次讲解界面的切换和关卡数据的解析.前面多次修改了Main.ts ...

  9. HTML5物理游戏开发 - 越野山地自行车(三)粉碎自行车

    自上一章公布到如今已时隔四月,实在对不住大家.让大家久等了~话说不是我不关注我的博客,而是事情一多起来写博客的时间就少了. 待到今日有空了,回头看了看自己曾经写的文章,猛得发现已经四个月不曾写文章了. ...

随机推荐

  1. 【读书笔记】iOS网络-三种错误

    一,操作系统错误. iOS人机界面指南中,Apple建议不要过度使用AlertViews,因为这会破坏设备的使用感受. 操作系统错误: 1,没有网络. 2,无法路由到目标主机. 3,没用应和监听目标端 ...

  2. AndroidStudio添加依赖库

    以Gson为例 Step1:点击下图中的入口,进入ProjectStructure Step2: 在app项中选择Dependencies窗口,点击右侧的加号 Step3:在搜索框中输入gson,点击 ...

  3. composer快速入门

    composer.json 文件内容定义 ====================================================={ "require":{ &q ...

  4. 最新Sublime Text 2 激活 汉化

    0x00 Sublime Text 2 Sublime Text 2 是一个轻量.简洁.高效.跨平台的编辑器,一直在使用它,简直是coder的必备神器,自从使用它之后就深深爱上它了(/▽\=),可能因 ...

  5. WPF学习之路(十)实例:用户注册

    通过一个注册用户的实例了解页面间数据的传递 首先构建一个User类  User.cs public class User { private string name; public string Na ...

  6. js和jquery获取父级元素、子级元素、兄弟元素的方法

    最近工作中总遇到取各种父啊子啊兄弟姐妹啊,每次都得查,这次整理个全乎的~ [js的获取方式] function dom(){      var a = document.getElementByIdx ...

  7. 找出如下数组中最大的元素和最小的元素, a[][]={{3,2,6},{6,8,2,10},{5},{12,3,23}}

    int [][]a={{3,2,6},{6,8,2,10},{5},{12,3,23}}; //先对二维数组进行遍历:然后把二维数组合成一个数组 int[] k=new int[11]; int q= ...

  8. SQL Server 2008 R2——VC++ ADO 操作 重复利用_ParameterPtr

    ==================================声明================================== 本文原创,转载在正文中显要的注明作者和出处,并保证文章的完 ...

  9. 像编程一样写文章—Markdown

    Markdown是什么 是一种极其简单的标记语言,写的时候只需要普通编辑器即可: 它可以使文本内存具有某种格式: Markdown设计理念使文本易读.易写 文件后缀名:.md . .markdown. ...

  10. Jmeter之Bean shell使用(一)

    一.什么是Bean Shell BeanShell是一种完全符合Java语法规范的脚本语言,并且又拥有自己的一些语法和方法; BeanShell是一种松散类型的脚本语言(这点和JS类似); BeanS ...