LayaAir引擎

　　LayaAir引擎是一套全新设计的精简API的游戏引擎，具有极致的性能、轻量易用、支持多语言开发、API功能齐全、工具链完善高效、免费、支持多版本发布等特点；LayaAir是Layabox旗下的第二代HTML5引擎，是全球唯一支持ActionScript3、JavaScript、TypeScript三种开发语言，并且一次开发同时发布Native APP与HTML5的游戏引擎，也是全球首款基于HTML5协议的全能型引擎，除支持2D\3D\VR\AR的游戏开发外，引擎还可以用于应用软件、广告、营销、教育等众多领域；强大又实用，需要的用户可以下载体验

软件功能

　　LayaAir引擎支持精灵、矢量图、文本、富文本、位图字体、动画、骨骼、音频与视频、滤镜、事件、加载、缓动、时间、网络、UI系统、物理系统、TiledMap、prtocol等API；支持开发2D、3D、VR的产品研发，支持Canvas与WebGL模式，支持同时发布为HTML5、Flash、APP（IOS、安卓）多种版本。

　　laya.core是核心包，封装了显示对象渲染，事件，时间管理，时间轴动画，缓动，消息交互，socket，本地存储，鼠标触摸，声音，加载，颜色滤镜，位图字体等。

　　laya.webgl 包封装了webgl渲染管线，如果使用webgl渲染，可以在初始化时调用Laya.init(1000,800,laya.webgl.WebGL);

　　laya.ani.js是动画模块，包含了swf动画，骨骼动画等。

　　laya.filter.js包含更多webgl滤镜，比如外发光，阴影，模糊以及更多。

　　laya.html.js封装了html动态排版功能。

　　laya.ui.js提供了制作UI的各种组件实现。

　　laya.tilemap.js提供tileMap解析支持。

软件特色

　　LayaAir IDE主要包括代码开发编辑器、可视化编辑器、第三方工具链支持工具等。

　　其中主要功能包括：

　　代码开发

　　UI编辑器

　　粒子编辑器

　　时间轴动画

　　场景编辑器

　　3D支持

　　脚本扩展

　　预设

　　APP打包

　　Flash发布

　　JS混淆与压缩

　　第三方工具链转换工具（SWF、Unity3D、3Dmax、TiledMap、Spine、龙骨……）

　　极致性能

　　 LayaAir引擎同时支持WebGL与Canvas渲染。优先使用webgl渲染（当WebGL不可用时，自动无缝转换为canvas渲染）。引擎设计过程中以性能为优先原则进行极致优化，在谷歌等优秀的浏览器环境下运行性能媲美Unity3D等APP原生引擎。LayaAir拥有多款APP级的已上线2D游戏精品和3D游戏精品，证明LayaAir引擎的流畅性能。

　　轻量易用

　　 LayaAir引擎 API设计上追求精简，简单易用，上手容易，引擎本身非常注意自身大小，是目前同等功能最小的HTML5引擎。

　　支持多语言开发

　　 LayaAir引擎同时支持ActionScript3、TypeScript、JavaScript三种语言开发HTML使用任意一种自己喜欢的语言开发即可。

　　功能齐全

　　 LayaAir引擎同时支持2D，3D，VR ，AR，时间轴动画，缓动、UI系统、粒子动画、骨骼动画、物理系统等。

　　工具链完善高效

　　 LayaAir引擎除提供可视化的集成式开发环境LayaAirIDE编辑器外，还支持大量主流的第三方工具链，如：Unity3D、TiledMap、Spine、DragonBones等。建立了完善的工具链生态，可视化的编辑器，清晰的工作流，让美术，策划，程序紧密配合，大幅提升开发效率。

　　免费使用条款

　　 LayaAir引擎可免费使用，包括商用。但必须在游戏加载页或首页的任意可见位置注明：Powered by LayaAir Engine，否则须下架线上产品直到停止引擎的使用。

　　强力的技术支持

　　 LayaAir引擎提供了强力的技术支持，包括官网文档、微信公众号、QQ技术交流群、官网问答社区、在线视频教育的课堂等。

安装说明

　　1、浏览至此，需要的用户可以点击本网站提供的下载路径下载得到对应的程序安装包

　　2、通过解压功能将压缩包打开，找到主程序，双击主程序即可进行安装

　　3、安装完成后，即可得到对应的编辑环境

使用说明

　　对于很多新手开发者而言最大的问题，就是学习思路。面对一项新的技术，如果不知道如何下手，这才是最头痛的。本文提供一些自学的思路，抛砖引玉以作借鉴，自学能力强的开发者可跳过本文，直接查看官网引擎示例与API。

　　第一步：选择开发语言

　　由于LayaAir引擎支持ActionScript3（AS3）、TypeScript（TS）、JavaScript（JS）三种语言开发，到底用哪种语言更好呢？常常困惑着刚接触引擎的新手们。其实开发者更熟悉哪种语言就采用哪种语言开发即可，引擎的API与性能都是完全一样的。

　　需要大家注意的是JS语言虽然上手更为容易，但是作为一弱类型语言，开发与调试的难度，以及大型项目的管理与多人协作等方面，都不如TS与AS3这种强类型语言。当前来看，AS3语言与TS相比，AS3在当前更友好一些，因为LayaAir引擎也是AS3语言开发，另外如果原本就是AS3程序员，在AS3原有的环境下开发也是非常不错的选择。而TS语言在未来的前景方面，由于对JS新特性的支持比较友好，又拥有强类型语言的特性，也是一种不错的开发语言选择。

　　最后，大家不要对语言的选择有什么畏惧，因为只需要学一下语言的基本规则即可，语言的学习切换其实是很快的。在游戏开发的过程中，引擎提供的API能完全满足开发游戏的需要，游戏的开发经验才是游戏研发团队最看重的。所以，各位开发者可根据项目需要，去选择LayaAir引擎支持的任何一种语言开发。

　　第二步：准备好开发环境

　　如果是TS和JS开发者，仅下载LayaAir IDE即可，因为LayaAir IDE集成了代码编写调试、UI编辑、动画编辑、粒子编辑等可视化游戏开发环境。如果是AS3开发者，在代码编写的工具方面，推荐采用更为成熟的FlashDevelop或者是Flash Builder。这两种工具是主流的AS3代码编辑器，从语法纠错等方面Flash Builder更加强大，支持MAC苹果系统，但是工具安装包非常大，且属于收费软件。FlashDevelop比较轻量，仅有几十兆，是免费软件，不过苹果系统下需要借助付费软件CrossOver才可以运行。

　　由于采用TS或AS3语言开发都需要配置编译器环境，在发布产品的时候把项目代码编译为JS代码运行，所以这两种语言的开发者，还需要进行一些额外的准备工作。

　　第三步：写第1个LayaAir引擎程序“Hello Layabox”；

　　学程序写“Hello world”已成为国际惯例。LayaAir引擎学习也不例外。当看到第一个LayaAir引擎的程序“Hello Layabox”显示出来的时候，不仅会带来入门成功的成就感，同时也说明了你的开发环境配置是没有问题的。

　　第四步：体验全部的LayaAir示例

　　 完成Hello Layabox的文本显示后，我们需要去了解其它的API，但是并不建议新手直接去看API。为什么呢？光靠看API文档去脑补使用方法，对新开发者而言会感觉内容多且枯燥。所以，在这里推荐大家先去官网开发者中心认真体验并研究LayaAir引擎的全部在线示例。在体验引擎示例的过程中，再针对示例中出现的API进行深入的了解，打开API文档进行学习。即便开发者时间有限，暂时不能全部深入研究每一个示例中的API，那也要先把示例看一遍，至少要做到知道有哪些引擎示例，都可以实现哪些功能。因为官网提供的引擎在线示例包含了游戏开发常用的引擎API。所以当体验完成全部示例后，会对LayaAir引擎的API有一个基本的认知，在开发游戏的时候就可以做到心中有数了。

　　额外提示一下，在引擎示例的代码区，JavaScript版本提供在线编辑与执行功能。可以直接在浏览器中学习与体验，其它开发语言或者是想在本地开发环境中体验引擎示例的，也可以前往GitHub上去下载示例源码，

　　第五步：学习LayaAir引擎的工具链

　　当体验和研究完引擎示例和API后后，其实已经可以用代码工具直接开发游戏的功能了。但是对于复杂一些的游戏，工欲善其事必先利其器，学习掌握一些可视化开发工具，是大幅提升开发效率的必经之路。LayaAirIDE作为可视化集成开发环境，除了代码编写还包括了UI编辑、动画编辑、粒子编辑、场景编辑等等功能，是首先给推荐大家的。

　　其次是第三方对LayaAir引擎的支持，Layabox官网已罗列了一些主流的工具对LayaAir引擎的支持，这些第三方工具与LayaAirIDE形成了强大的工具链，让开发者在使用LayaAir引擎的时候无需对工具链产生担忧，可高效的开发各种类型的游戏。这里就不逐一介绍了，重点推荐几款第三方工具，第一是用于骨骼动画的编辑器Spine、第二是地图编辑器TiledMap、第三是3D编辑器Unity3D。

　　第六步：学习项目调试

　　项目的调试本身并不是很难的要点，但是一些刚接触H5开发的开发者常会就项目调试提出各种问题，在LayaAir技术文档的”2D进阶篇“中会针对开发环境与发布环境下的调试方式，进行介绍说明。

　　第七步：学习并熟记性能优化原则

　　在当前，移动设备的硬件性能远不及PC硬件，尤其是中低端机型的市场占有率并不低。那么引擎的性能优化将成为很重要的选择因素。那是不是选择了性能高的引擎，项目就一定不会出现性能问题呢？并不是这样。因为引擎的优化仅仅是提供了一个项目性能的天花板。

　　如果引擎的性能不行，项目再如何优化，也无法突破这个天花板，导致项目开发完了。只能跑在性能特别好的机型上，那时候再去换引擎或者去改引擎，成本和代价就非常的高了。但是，引擎性能明明可以达到APP级的流畅度，如果在项目编写的过程中并不进行优化或错误的使用引擎。那仍然可能出现卡顿问题。因此大家学好引擎的基础之后，一定要认真阅读性能优化的文章，把性能优化的方法熟记于心，在项目编写的过程中熟练的运用。

　　第八步：用小游戏或项目实战验证学习成果

　　按以上步骤学习完全部的文档后，对于有游戏项目研发经验的开发者，已经可以用项目实战来验证学习的成果了。对于近期还没有游戏立项，或者是没有游戏研发经验的开发者，建议先用小游戏实战的方式，完整体验开发流程来验证学习成果。

　　关于小游戏的教程文档在”实战开发篇”内，腾讯课堂教学内也有小游戏实战开发的视频教学。

　　第九步：学习分包与分模块开发

　　在与开发者接触的时候，会碰到反馈大型项目编译速度变慢的问题。因为涉及大量的代码与代码文件，带来编译变慢是必然的，这不仅是H5大型项目面临的问题，是任何一种大型项目研发都会面临的问题。对于有有大型游戏项目经验的开发者大多数会采用分模块协同开发的方式进行。而分模块开发后如何整合加载，由于LayaAir引擎支持分包加载。

　　第十步：如何获得官方的技术答疑与指导

　　在开发实践的过程中，对引擎不是非常熟悉的开发者难免还会遇到各种引擎使用问题，此时如何能尽快获得解答呢？首先要注意的是，不要直接在QQ群中提问，因为QQ群中留言信息较多时，问题很容易被淹没，并且会造成类似的问题反复解答。所以，我们建议开发者在问答社区（ask.layabox.com）中进行搜索，是否有类似问题已经提出或被解决。如果没有类似问题，可以在社区中创建提问并详细描述问题，把代码、截图、问题的现象等信息提供的越细致越好，尽可能减少沟通成本。官方技术支持人员会优先处理社区中的问题，并保障每一个问题会得到解答，当然也可以在提问后，把社区中的提问链接粘贴到开发者群里并@管理员。

　　对于已回复，但需要持续跟进的问题，由于社区问题较多时，容易遗漏。这时，需要开发者主动跟进，在社区中的原问题中再次跟帖，或将社区中的提问链接粘贴到开发者群里并@管理员。

　　在学习过程中，如果有高速网络条件的，也建议大家查看视频教程，全程跟随式操作，会更加直观和易理解。视频教程分为免费观看和付费教学两种。免费教程可以直接在优酷视频网站搜索LayaAir关键字查看相关视频。付费教学可以前往腾讯课堂（layabox.ke.qq.com）查看，相对于优酷等视频网站的免费视频，腾讯课堂中没有片头广告，教学目录结构清晰，还有专享的学员QQ群，直接在QQ群中享受超值的课程问题即时答疑，基础入门课程更是在仅为几元的超低收费门槛，适合开发者快速入门学习和进阶。

　　LayaAir引擎AS3与Flash原生AS3的开发差异

　　 LayaAir引擎支持Flash AS3语言开发HTML5游戏，但是开发者需要注意的是，Flash AS3的原生API，LayaAir引擎是不支持的，由于LayaAir自身拥有非常完善与强大的API，所以引擎仅支持采用AS3的基础语法进行HTML5产品开发。尤其是对于拥有原生Flash AS3开发经验的开发者，除API外，还需要注意以下差异，有少量的Flash AS3的用法，在LayaAir也是不可以使用的。

　　一、LayaAir引擎不支持int();

　　 开发者在使用LayaAir引擎的时候，请注意不要再使用int()，该方法在LayaAir引擎中不被支持，如有相关功能的开发需要时，可以采用parseInt()替代。

　　原生as3支持，但是不被LayaAir引擎支持的示例：

　　LayaAir引擎中正确的用法示例：

　　二、mask遮罩的使用差异

　　 在LayaAir引擎里，使用Mask有两点需要注意。

　　 1、Mask添加在显示对象的内部，也就是说，LayaAir 下的Mask坐标是相对于被遮罩对象的，而并非舞台。

　　 2、如果遮罩是动态的，需要调用下被遮罩对象的repaint()方法。

　　 下面通过代码查看一下差异。

　　2.1 静态遮罩

　　原生as3支持，但是不被LayaAir引擎支持的示例：

　　LayaAir引擎中正确的用法示例：

　　2.2 动态遮罩

　　原生as3支持，但是不被LayaAir引擎支持的示例：

　　LayaAir引擎中正确的用法示例：

　　三、Sprite自身绘制的graphics矢量图形注册事件点击区域差异;

　　 在原生Flash AS3中，Sprite精灵创建完成后会自动计算宽高。但是在layaAir引擎中，为了节约性能，默认Sprite精灵是没有宽高的，需要为Sprite设置一个碰撞区域，也就是hitArea 或 size。

　　原生as3支持，但是不被LayaAir引擎支持的示例：

　　LayaAir引擎中正确的用法示例：

　　实现方法一：

　　实现方法一：

　　四、事件对象派发差异

　　 关于事件对象的派发方面，主要是语法差异。LayaAir引擎针对该方法的关键字以及参数做了精简和丰富。LayaAir在派发和监听事件的同时可以携带数据，譬如派发对象.event(‘自定义事件类型’,[‘数据源’])，监听对象.on(‘事件类型’,’事件侦听函数的执行域’,’事件侦听函数’,’回调参数’)。

　　原生as3支持，但是不被LayaAir引擎支持的示例：

　　派发：

　　监听:

　　LayaAir引擎中正确的用法示例：

　　派发：

　　监听:

　　五、LayaAir与AS3的差异

　　在Flash AS3的原生API写法中可以直接继承Sprite，但是LayaAir引擎里主文档类入口（初始化引擎前）不能直接继承Sprite，按照AS3传统的习惯继承Sprite会导致报错。

　　错误的写法：

　　正确的写法：