白鹭引擎_白鹭引擎源码 - CSDN
精华内容
参与话题
  • egret白鹭引擎基础介绍

    万次阅读 2017-09-10 07:58:49
    软件介绍 (一)Egret Engine多版本系统 (二)Egret Wing 强大的IDE工具 (三)ResDepot 资源管理工具 (四)Texture Merger:资源打包工具 1. 精灵表输出 ...Texture Merger可将零散的小图合并为大图文理集,...

    软件介绍

    (一)Egret Engine多版本系统

    (二)Egret Wing 强大的IDE工具

    (三)ResDepot 资源管理工具

    (四)Texture Merger:资源打包工具

    1. 精灵表输出

    Texture Merger可将零散的小图合并为大图文理集,提高资源加载速度和游戏性能,在游戏研发过程中,开发者可使用小图开发,在产品发布时对资源进行合并,无须修改代码

    2. MovieClip动画旋转

    Twxture Merger可方便地将GIFSWF动画转换为Egret支持的动画格式

    3. 位图字体

    为高品质游戏的个性文字效果输出提供了方便快捷的解决方案

    案例:Hello World绘制一个圆

    项目代码目录

    1.Main.ts为项目入口类,也成为文档类,文档类时衔接项目运行容器环境与项目中所有类的重要文件,

    2. oadingUI.ts是加载过程中的辅助显示组件,用来显示加载进度

    项目配置文件

    1. 模块配置modules

      模块配置中,列出项目所需的各个模块,默认新建项目会包含core模块和res模块。core模块是一个核心模块,通常使用Egret开发项目,这是必选项,因为引擎中提供的大部分基础类库都处于这个模块,res模块也是相当常用的模块,只要涉及资源文件加载,就需要用到这个模块,

    ① ore模块是一个核心模块,通常使用Egret开发项目,这是必选项,因为引擎中提供的大部分基础类库都处于这个模块,

    ②  res模块也是相当常用的模块,只要涉及资源文件加载,就需要用到这个模块,

    2. 原生打包设定native

    该选项中的设置适用于原生打包

    3. 版本号egrety_version

    该选项指示项目最后打包时所使用的Egret引擎版本,如果该版本号与所安装的Egret引擎不一致,通常需要升级到所需安装版本财可以正常编译

    4. 项目运行容器环境

    项目运行环境为launcher目录,项目运行环境总体上分为两种,即HTML5环境和Runtime/Native环境,接下来对这种环境分别进行说明

    ① HTML5环境由于标准Egret项目(相对于Runtime/Native来说)依赖于HTML5环境,运行需要从某个静态HTML5页面开启,这个目录存有两个HTML5页面,index.htmlrelease.html,分别用于调试和发布环境的启动页面。另外HTML5环境运行需要两个js文件配合:egret_require.jsegret_loader.jsegret.loader.js中可以对项目运行进行一些定制配置

    ② Runtime/Native环境

    Runtime/Native环境由于已经脱离原本的HTML5环境,因此不需要任何HTML5页面,因为这个环境也没有任何HTML解析器,这个环境只需要3js文件,native_loader.jsnative_require.jsruntime_loader.js、其中在native_loader.jsruntime_loader.js中可以分别对原生打包和Runtime打包项目进行某些配置

    5. 项目运行库libs

    libs目录中包含项目各模块所对的所有类库

    a. egret

    b. eui

    c. res

    d. tween

    e. exml.e.ts

    当对项目配置文件egretProperties.json中的模块进行修改后,需要通过编译引擎命令来重新生成项目运行库,这个命令可以从Project菜单找到(Project ——》Build Engine

    6. 项目编译目录bin-debug

    项目编译的结果文件都会被存储到bin-debug目录中,这也是调试运行过程将会调用到的文件。其中源代码目录中的文件将会被编译到bin-debug/src目录中,在bin-debug/lib有个列表文件,用来列出所需要的所有运行库文件,在运行过程中,这些都会将在合适的时间被调用到

    7. 项目资源目录resource

    resource是用来存放项目运行所需要的所有资源的,包含图片和配置文件,通常在资源目录建立一个资源清单文件,默认为:resource.json.图片或声音等资源文件的默认存储目录为:resource/assets。配置数据文件的默认存储目录为:recource/config。当然这些目录都可以根据自己喜好设置,只要在程序中使用保持一致即可

    assets

    config

    eui_skins

    default.res.json

    default.thm.json

    8. 项目发布目录

    代码风格

    1.Egret采用的是TypeScript作为开发语言,是一种标准的OOP语言

    2. 对于大项目,建议将类分包建立

    3. 类名大写,包名小写例如:egret.Bitmap

    4. Egret类中的常量,通常采用全部字母大写,单词之间用下划线隔开的风格,如触摸事件egret.TouchEvent.TOUCH_BEGIN

    注意:Egret引擎源代码中定义,类中的属性与方法如果以下划线开头,则表明此方法或属性为引擎内部使用,在编写游戏时,千万不要调用此类方法或属性,否则会引发不可预测的bug

    建议风格。例如:有一个项目benchmark项目,我们要在benchmark.boid包内创建一个名为Boid的类,

    5. 类与方法的命名规范

    1) 类名

    类名建议用大写字母开头,后每个单词也都以大写字母开头,其他字母小写,如一个控制翻页的类,命名为PageSlipCenter,其定义即为:

    class PageSlipCenter extends egret.EventDispatcher{}

    2) 方法名

    方法名建议第一个单词用小写字母开头,后续每个单词都以大写字母开头,其他字母小写,如有一个触摸事件处理方法,命名为touchHandler,其定义为:private touchHandler(evt:egret.TouchEvent):void{}

    核心库与扩展库的使用方法

    1. egret模块是最为核心的模块,所有的Egret项目都应该包含这个模块,否则所有的基础功能都无法实现,

    2. dragonbones

    3. eui

    4. game

    5. gui

    6. res模块是一个重要的模块,涉及资源载入的工作,都需要这个模块来完成,

    7. socket

    8. tween

    如果需要添加或者删除直接在egretProperties.json中添加或者删除即可

    第三方库的集成方法

    1.准备第三方模块

    第三方模块可以使用现成的js库也可以自己写js

    由于tsjs在语法结构上的差异,在ts中不能直接调用js库中的API,不过TypeScript团队提供了一套虚构声明语法,可以把现有的代码API用头文件的形式描述出来,这种文件称为ts类型定义,扩展名为d.ts(d.ts命名提醒编译器这种文件不需要编译),这套虚构定义语法不需要去实现函数体力的代码,类似定义interface和抽象类,

    2. 部署第三方模块

    第三方库重要规则:创建位置处于其他Egret项目外部,否则无法运行

    egret create_lib<库名称>

    注意:库名称应该是英文字符串,执行该命令将会创建以库名称为名的目录,目录内将包含binsrclibs3个字目录,还有一个packagejson配置文件,再次强调一遍:不要在其他Egret项目内创建库,通常的做法是你有个放不同Egret项目的工作空间目录,然后第三方模块的库项目与其他Egret项目均处于该工作空间目录,处于并列位置

    1、将第三方模块的js和对应的d.ts文件复制到刚刚创建的Egret库项目的src文件夹中。

    2、如果该库项目src中的文件需要引用其他的库的代码,--通常称为依赖库,请把这些依赖库的TypeScript描述文件(也就是,,d,ts文件) 放到libs目录下,注意在libs目录下其他类型的文件入.js*.ts一概不需要

    3、编辑Egret库项目中的配置文件package.json,将之前放入src目录下的文件名称依次作为file_list数组中的元素列出,

    3.Egret项目中导入第三方模块

    Egret项目的egretProperties.json文件中,添加一下代码:

    moddules:

    [

    {

    "name":"physics"//模块名称

    "path":"path/to/egret/library/project/root/",  //路径

    }

    ]

    编译某第三方库后,在indexhtml文件中应该以模块名称physics.jsscript外部脚本引用行

     


    展开全文
  • 白鹭引擎入门教程一(Egret)

    千次阅读 2019-07-02 18:12:05
    1.下载并安装Egret引擎: http://www.egret.com/products/engine.html 2.命令行(Win+R键输入cmd): 有些喜欢用命令行的童鞋,可以通过命令行对白鹭H5项目进行创建、构建、发布、更新等操作;不喜欢的话可以使用 ...

    1.下载并安装Egret引擎:

    http://www.egret.com/products/engine.html

    2.命令行(Win+R键输入cmd):

    有些喜欢用命令行的童鞋,可以通过命令行对白鹭H5项目进行创建、构建、发布、更新等操作;不喜欢的话可以使用 Egret Wing开发和管理项目。

    参考文档: http://edn.egret.com/cn/docs/page/582

    在这里插入图片描述
    3.使用TypeScript
    Egret 项目使用 TypeScirpt 语言来开发。TypeScript 是 JavaScript 的超集,具体内容可以参考:

    1、TyptScript官网下载和文档:http://www.typescriptlang.org/
    2、TypeScript详细手册参考TypeScript Handbook(中文版):https://www.gitbook.com/book/zhongsp/typescript-handbook/details
    3、白鹭社区教学文档(小白可以看这个哦):http://bbs.egret.com/thread-886-1-1.html

    4.HelloWorld
    打开Egret Engine,点击工具,安装Egret Wind后打开它。

    在这里插入图片描述
    当大家熟悉 Egret 开发之后可以直接创建Egret游戏项目或者Egret EUI 项目等,里面包含了很多默认的配置。现在学习 Egret 第一步还是从一个Egret游戏项目来开始。
    在这里插入图片描述
    在这里插入图片描述
    在这里插入图片描述
    在这里插入图片描述
    5.理解项目结构:
    在这里插入图片描述

    • src 目录,存放我们的代码。我们编写的代码都放在src目录下面。
    • bin-debug 目录,项目编译和运行的debug目录,一般我们不要修改该目录下的内容。
    • libs 目录,这里面存放我们的库文件,包括 Egret 核心库和其他扩展库。当然以后添加了第三方库的话也会放在这里。
    • resource 目录,这里放置我们的资源文件,这里面有一个default.res.json 配置文件,用来配置资源。
    • template 目录,这里是项目调试过程中所需的目录,一般我们不需要修改该目录下的内容。
    • egretProperties.json 项目的配置文件,一般我们会用到里面的modules 字段来配置项目的模块。
    • index.html 项目访问的入口文件,我们可以在这里面配置项目的旋转缩放模式背景颜色等。
    • favicon.ico 一个ico。
    展开全文
  • 白鹭引擎支持自定义资源加载器, 可以方便的使用加密资源;例如有一个 expmble.png, 加密后为 example.png.enc 下面是自定义资源处理器的示例: 在Main.ts里面, 注册一个自定义的解析器, EncryptAnalyzer; //...

    白鹭引擎支持自定义资源加载器, 可以方便的使用加密资源;
    例如有一个 expmble.png, 加密后为 example.png.enc

    下面是自定义资源处理器的示例:

     在Main.ts里面, 注册一个自定义的解析器, EncryptAnalyzer;

     

    //Main.ts入口文件, 增加enc格式注册
    
    RES.processor.map("enc",EncryptAnalyzer);
    

      

    增加 EncryptAnalyzer.ts  文件


    //EncryptAnalyzer.ts var EncryptAnalyzer:RES.processor.Processor = { onLoadStart(host,resource){ return new Promise(( reslove ,reject ) => { var request: egret.HttpRequest = new egret.HttpRequest(); request.responseType = egret.HttpResponseType.ARRAY_BUFFER; request.open(resource.root+resource.url, "get"); request.send(); let onSuccess = ()=>{ let bufData = request['response'];
              //对加密的数据, 使用xxtea解密 let _xxtea = xxtea.getInstance(); let bytes = _xxtea.decrypt(new Uint8Array(bufData), 'password'); egret.BitmapData.create('arraybuffer', bytes, function(bmpData){ let texture = new egret.Texture(); texture._setBitmapData(bmpData); return reslove(texture); }); } request.addEventListener(egret.Event.COMPLETE, onSuccess, this); }) }, onRemoveStart(host,resource){ let texture = host.get(resource); texture.dispose(); return Promise.resolve(); } }

      

     

    转载于:https://www.cnblogs.com/DouKeKe/p/9429291.html

    展开全文
  • 白鹭引擎(Egret Engine )

    万次阅读 2015-11-17 21:36:04
    什么是白鹭引擎 Egret引擎是一个开源免费的游戏框架,用于构建二维游戏、演示程序和其他图形界面交互应用等。Egret使用TypeScript脚本语言开发。当游戏完成最终的打包后,可以将程序转换为HTML5游戏。实现跨平台...

    什么是白鹭引擎

    Egret引擎是一个开源免费的游戏框架,用于构建二维游戏、演示程序和其他图形界面交互应用等。Egret使用TypeScript脚本语言开发。当游戏完成最终的打包后,可以将程序转换为HTML5游戏。实现跨平台特性。

    Egret不仅仅是一个基于HTML5技术的游戏引擎,我们的产品线中除了Egret引擎还提供了很多辅助游戏开发的工具。准确的来说,Egret是一套游戏开发的解决方案。你可以使用Egret引擎来帮助你开发HTML5游戏,并运行在手机和PC端的浏览器中,同时也你可以使用Egret提供的相关工具搭建你自己的游戏开发工作流。


    在今年深圳举行的HTML5峰会上,就有看到有人介绍这款白鹭引擎,它是一款html5游戏引擎,据说许多东东都是从FLASH搬过来的,如果会用FLASH做游戏的人学起来特别快!
    Egret Engine(白鹭引擎)是白鹭时代推出的一款使用TypeScript语言构建的开源免费的移动游戏引擎。通过白鹭引擎,开发者可以快速地创建可以运行在手机App的WebView或者浏览器中的HTML5移动游戏,也可以编译输出成基于Android、iOS、Windows Phone的跨平台原生移动游戏。应用Egret引擎开发HTML5移动游戏,不但能让H5游戏具备牛逼的性能表现,并且效率很高。

    《围住神经猫》的一夜蹿红,让一个h5游戏引擎也跟着火热起来了——egret。

      官网传送门:点击打开链接

    安装和helloworld的demo官网给了很简明易懂的文档,这里就不啰嗦。不过官网给的helloworld的demo的背景图片,实在没法不让人不吐槽。

    项目目录如下:需要关心的有两个文件夹:launcher、src。

    launcher 文件夹下面,需要关心的是 index.html文件,改文件是项目的入口。egret帮助建立的,自己可以自行修改里面内容,只要别把加载框架的部分干掉就行。

    其中必要说明的是 Id 为 gameDiv 的<div> 是游戏引擎用来操作的地方。框架会在改<div>下面自动建立一个<canvas>,然后在这上面绘制游戏界面。可以自行控制gameDiv的样式,别删除或者修改ID就行。launcher文件夹下面暂时没有别的需要关注的了。

    src 文件夹下面两个文件,后缀名为ts,是typescript 文件,其实就是javascript 的一个超集而已。其中loadingUI.ts ,暂时也不需要关心,这个是加载网页的时候让用户安心等待的一个提示界面。

    好了下面就是最重要的Main.ts

    标注的两个方法,就是egret对html所干的事情。整个hello world分析就结束了。

    总结一下:

    egret采用的是typescript 语言,在入口(index.html)文件里面操作 ID 为 gameDiv的标签(在改标签下面增加一个画布<canvas>)。项目启动交给了main.ts(改文件名字可更换),main.ts会加载预先准备的资源,资源加载完成之后,开始绘制<canvas>里面的内容。

    展开全文
  • 白鹭引擎的使用(一)

    千次阅读 2018-03-27 15:16:39
    白鹭引擎学习文档:http://edn.egret.com/cn/index.php/article/index/id/154一:命令行手册1.本地开启egret服务器:egret startserver HelloWorld --port 30002.重置项目:egret clean [project_name];例如:egret...
  • 白鹭引擎开发H5游戏(项目结构)

    万次阅读 2016-12-12 09:29:16
    主要使用 EgretWing (是白鹭扩展的 VisualStudio Code) 新建 项目中 选择 生成的项目的结构: src 是TypeScript源码目录 resource 是我们项目中的资源路径,一般我们把图片音频等素材放置asset目录下,json等...
  • 写在前面:随着越来越多的新人开始接触白鹭引擎,创作属于自己的游戏。考虑到初学者会遇到一些实际操作问题,我们近期整理推出“菜鸟”系列技术文档,以便更好的让这些开发者们快速上手,Egret大神们可以自动忽略...
  • 简单介绍了解白鹭引擎Egret

    千次阅读 2015-05-12 00:42:57
    (一)关于白鹭引擎Egret Egret引擎是一个开源免费的游戏框架,用于构建二维游戏、演示程序和其他图形界面交互应用等。Egret使用TypeScript脚本语言开发。当游戏完成最终的打包后,可以将程序转换为HTML5游戏。...
  • egret_渲染优化-降低dc

    千次阅读 2019-03-16 15:03:45
    按照 egret_渲染源码阅读.md , 对项目进行实际操作优化, 降低 drawcall. 主要是使用图集 这里的ui是使用 fairygui. 一个包就一个图集 ... 确认过无误之后, 就往这个方向优化.... 工具使用 通过egret的Chrome插件 ...
  • 内自建了一个类叫myMain,在src文件夹下,该目录清晰地分析了整个程序的开始
  • 白鹭引擎正式支持微信小游戏开发

    千次阅读 2019-07-05 10:10:42
    在微信发布新版本后,白鹭引擎立即添加了对于微信小游戏开发的支持,开发者只需要使用白鹭引擎的最新版本,通过使用白鹭引擎完整工具流,就可以快速创建、开发与发布微信小游戏,而无需过多的关注底层技术细节。...
  • WebAssembly在白鹭引擎5.0中的实践

    千次阅读 2019-07-05 10:09:55
    作者:王泽,北京白鹭时代信息技术有限公司白鹭引擎首席架构师。目前主要聚焦于HTML5游戏引擎开发、TypeScript以及WebAssembly技术相关的研究与实践工作。 责编:陈秋歌,关注前端开发领域,寻求报道或者投稿请发...
  • 白鹭引擎之Scroller容器

    千次阅读 2018-08-26 00:06:09
    最近由我这个Unity3D大师负责公司H5项目,主要实现白鹭引擎Scroller滚动框中物体可以拖拽的效果,并且物体拖拽时,Scroller不可滚动。。。我这门外汉一听这要求,瞬间想打死策划。我研究了一下Scroller,首先,如果...
  • 白鹭引擎egret页面跳转

    千次阅读 2019-03-15 17:31:01
    白鹭引擎egret页面跳转定义场景管理类新建场景exml文件定义相应exml文件的场景类Main.ts 定义场景管理类 首先在src下定义一个场景切换管理类与抽象类 class SceneManager { private static _instance: SceneManager...
  • 白鹭引擎增加点击事件实例

    千次阅读 2019-04-18 16:44:14
    白鹭引擎 描述:给图像,元素 按钮增加点击事件 加入点击按钮: //加入一个开始按钮 let gameStart = new egret.Shape(); gameStart.graphics.beginFill(0x000000,1); gameStart.graphics.drawRect(stageW*...
  • 白鹭引擎

    2018-04-02 17:24:59
    Egret Launcher白鹭引擎 Egret不仅仅是一个基于HTML5技术的游戏引擎,我们的产品线中除了Egret引擎还提供了很多辅助游戏开发的工具。准确的来说,Egret是一套游戏开发的解决方案。你可以使用Egret引擎来帮助你开发...
  • 白鹭引擎报跨域错误

    千次阅读 2019-07-19 22:33:10
    使用白鹭4.1.0引擎打开一个老项目,发现发送urlxxx请求时,控制台报错: XMLHttpRequest cannot load http://urlxxx No 'Access-Control-Allow-Origin' header is present on the requested resource. 结果检查了...
  • 个人开发白鹭引擎 的一个4399游戏源码 请笑纳
  • 白鹭引擎 版本:5.2.8 描述:引入文字图层代码实例 代码片段: private jf_tit: eui.Label; public create_text(){ this.jf_tit = new eui.Label(); this.jf_tit.text = &amp;quot;0 积分&amp;...
  • 白鹭引擎01》场景中添加图片

    千次阅读 2018-06-22 17:17:37
    准备入白鹭的坑 看了看文档 发现根本看不懂只好找各种书和教程 然而由于版本更新很多代码已经执行不出来 在此一点一点记录学习心得 第一篇我们就从熟悉项目目录和给项目添加资源开始首先我们应该下载好白鹭引擎和...
1 2 3 4 5 ... 20
收藏数 1,425
精华内容 570
关键字:

白鹭引擎