LayaAir IDE是一款開(kāi)發(fā)環(huán)境軟件，軟件中集成了各種實(shí)用的可視化編輯工具，支持2D、3D、VR的開(kāi)發(fā)，并且讓用戶實(shí)現(xiàn)開(kāi)發(fā)3D產(chǎn)品時(shí)同步發(fā)布VR產(chǎn)品，減少用戶在開(kāi)發(fā)時(shí)可能遇到的問(wèn)題。

軟件介紹

LayaAir IDE(可視化集成開(kāi)發(fā)工具)是一款功能齊全的開(kāi)發(fā)環(huán)境，一款次時(shí)代的3D游戲引擎，用戶可以在軟件中進(jìn)行代碼的開(kāi)發(fā)，軟件還提供UI編輯器、例子編輯器、時(shí)間軸動(dòng)畫(huà)等等內(nèi)容，可以幫助用戶進(jìn)行3D形象和動(dòng)畫(huà)的制作，軟件集成了完整的開(kāi)發(fā)功能，用戶在開(kāi)發(fā)過(guò)程中需要的內(nèi)容都能輕松找到。軟件還有一個(gè)特色就是極輕，其核心引擎庫(kù)僅100K左右、運(yùn)行內(nèi)存僅占用2M左右，可以說(shuō)是簡(jiǎn)潔干凈到了極致。

支持2D、3D、VR的開(kāi)發(fā)，并實(shí)現(xiàn)開(kāi)發(fā)3D產(chǎn)品時(shí)同步發(fā)布VR產(chǎn)品，一次投入多處回報(bào)；但是功能性并未打折，包括動(dòng)畫(huà)、UI、粒子、骨骼、物理、3D等系統(tǒng)，還具有支持引擎擴(kuò)展與分包的獨(dú)家優(yōu)勢(shì)，適用于廣告、教育、營(yíng)銷等各領(lǐng)域，可以說(shuō)，極強(qiáng)。LayaAir以巔峰實(shí)力吹響了H5游戲與APP游戲同臺(tái)PK的號(hào)角，勢(shì)必掀起H5引擎領(lǐng)域one is more的新浪潮。

軟件功能

LayaAir 引擎

裸跑性能媲美APP的HTML5引擎

多語(yǔ)言支持

支持AS3、TypeScript、JavaScript三種語(yǔ)言開(kāi)發(fā)HTML5

適用領(lǐng)域廣

核心庫(kù)100K左右，適用游戲、廣告、營(yíng)銷、應(yīng)用、教育等領(lǐng)域

極致性能

唯一擁有大型游戲線上產(chǎn)品（裸跑）案例的HTML5引擎

功能強(qiáng)大

支持2D\3D、動(dòng)畫(huà)、UI、粒子、骨骼、物理等，支持引擎擴(kuò)展與分包

LayaFlash引擎

頁(yè)游MMOPRG《醉西游》成功轉(zhuǎn)換HTML5

快速Flash產(chǎn)品轉(zhuǎn)換

Flash頁(yè)游\手游僅需1個(gè)人7天即可轉(zhuǎn)換為HTML5和APP游戲

LayaFlash IDE

支持代碼編譯、調(diào)試、壓縮與混淆加密、資源轉(zhuǎn)換、在線文檔等功能

HTML5零學(xué)習(xí)成本

AS3開(kāi)發(fā)者可直接使用Flash開(kāi)源框架和工具鏈進(jìn)行開(kāi)發(fā)HTML5

性能媲美APP

LayaFlash引擎的重度游戲已運(yùn)行于QQ空間等平臺(tái)，性能媲美APP

軟件優(yōu)勢(shì)

唯一實(shí)現(xiàn)H5重度游戲裸跑達(dá)到APP性能，并擁有線上案例的商業(yè)級(jí)開(kāi)源引擎；

唯一覆蓋當(dāng)前所有主流H5開(kāi)發(fā)語(yǔ)言的引擎，支持ActionScript3、TypeScript、JavaScript三種語(yǔ)言以及ES6語(yǔ)言規(guī)范的開(kāi)發(fā)；

唯一使用自身引擎開(kāi)發(fā)IDE工具，實(shí)現(xiàn)UI、粒子、骨骼、地圖場(chǎng)景、動(dòng)畫(huà)等常用開(kāi)發(fā)環(huán)境的可視化，極大提升開(kāi)發(fā)者效率，優(yōu)化工作流；

唯一實(shí)現(xiàn)一次開(kāi)發(fā)，同時(shí)發(fā)布Flash頁(yè)游版、APP版（Android、IOS）、H5版的全平臺(tái)引擎。

Debug調(diào)試工具怎么用

LayaAir Debug調(diào)試工具無(wú)需下載安裝任何插件，只需引入調(diào)試庫(kù),可以直接運(yùn)行在項(xiàng)目中。

1、導(dǎo)入調(diào)試庫(kù)

在項(xiàng)目中引入LayaAir Debug類庫(kù)“ laya.debug.DebugTool”;

1   import laya.debug.DebugTool;

初始化類庫(kù)：

1   DebugTool.init();

LayaAir Debug初始化成功后，在H5項(xiàng)目中會(huì)顯示出一個(gè)調(diào)試窗口，調(diào)試窗口可能顯示出來(lái)后又會(huì)被隱藏，這時(shí)可以通過(guò)雙擊屏幕的方式，再次顯示LayaAir Debug調(diào)試窗口;

2、功能說(shuō)明

A.點(diǎn)擊選取按鈕：點(diǎn)擊圖標(biāo)后，通過(guò)點(diǎn)擊指定的節(jié)點(diǎn)查看選中節(jié)點(diǎn)的屬性信息；

點(diǎn)擊”設(shè)置顯示屬性”圖標(biāo)，可以添加/刪除節(jié)點(diǎn)要顯示的屬性信息：

B.拖動(dòng)選取按鈕：點(diǎn)擊圖標(biāo)后，然后按住鼠標(biāo)左鍵，將圖標(biāo)按鈕拖動(dòng)到想要查看的顯示對(duì)象上：

C.查詢按鈕：顯示當(dāng)前在場(chǎng)景里選中的顯示對(duì)象(Alt+V移動(dòng)鼠標(biāo)來(lái)選擇對(duì)象)

D.性能按鈕：

(1).對(duì)象創(chuàng)建：當(dāng)前游戲運(yùn)行過(guò)程中所創(chuàng)建的對(duì)象信息；

(2).渲染用時(shí)：當(dāng)前游戲渲染所消耗的用時(shí)，單位為毫秒(ms)

(3).Cache：當(dāng)前重繪過(guò)對(duì)象

3、節(jié)點(diǎn)屬性面板操作：在節(jié)點(diǎn)、選中或性能標(biāo)簽面板頁(yè)”右擊”要查看的節(jié)點(diǎn)，會(huì)彈出：

創(chuàng)建場(chǎng)景教程

一、新建一個(gè)頁(yè)面HomeScene.ui

1、在UI編輯中創(chuàng)建一個(gè)頁(yè)面類型為View的界面

2、創(chuàng)建了一個(gè)主頁(yè)HomeScene場(chǎng)景，并拖動(dòng)了一個(gè)Button組件到場(chǎng)景中，ID和label設(shè)置為“Test"。

二、編輯界面代碼HomeScene.ts

因?yàn)橹肮催x了創(chuàng)建邏輯類，所以項(xiàng)目會(huì)自動(dòng)創(chuàng)建一個(gè)HomeScene.ts

但是這里報(bào)了一個(gè)錯(cuò)，找不到name 'ui'，吐槽下自動(dòng)創(chuàng)建也會(huì)報(bào)錯(cuò)...

教程找了一圈沒(méi)找著，群里問(wèn)了也沒(méi)人回答，社區(qū)也沒(méi)人遇到這個(gè)問(wèn)題。

后來(lái)知道了需要在UI編輯界面，清理并導(dǎo)出，才能自動(dòng)生成一個(gè)文件layaUI.max.all.ts，這個(gè)文件生成了HomeScene的基類。

三、UI和代碼綁定

在ui編輯界面選擇導(dǎo)出后，會(huì)自動(dòng)生成layaUI.max.all.ts，這個(gè)文件實(shí)現(xiàn)了：

1. 創(chuàng)建了HomeScene.ts的基類HomeSceneUI

2. 綁定了HomeScene.ui，uiView:any = "xxxxx"就是HomeScene.ui的源代碼

和Egret的比較：

1.Egret需要手動(dòng)或使用插件來(lái)生成場(chǎng)景對(duì)應(yīng)的類和組件屬性；Laya能集成了導(dǎo)出功能，導(dǎo)出包含組件屬性的基類。

2.Egret的場(chǎng)景皮膚都會(huì)集中放在default.thm.json中；Laya是放在layaUI.max.all.ts中。

四、使用HomeScene

使用HomeScene.ts則必須import導(dǎo)入view.scene

控制臺(tái)報(bào)錯(cuò)，缺少button.png，這張圖被使用在HomeScene.ui的按鈕上。

增加加載圖集的代碼，先加載圖集，在 new HomeScene

Laya.loader.load("res/atlas/comp.atlas", Handler.create(null, this.onLoaded));

然后出了新的警告，論壇搜了下，只是警告，不影響開(kāi)發(fā)。

到此，在laya中創(chuàng)建ui和代碼，并綁定使用就完成了...

怎么制作動(dòng)畫(huà)

準(zhǔn)備動(dòng)畫(huà)素材

首先將所有動(dòng)畫(huà)素材導(dǎo)入到項(xiàng)目中

在這里我準(zhǔn)備圓桌騎士中的 大劍勇士的攻擊和行走的圖片集合

所有圖片我都使用了 角色_動(dòng)作_序號(hào) 的命名方式

導(dǎo)入到工程中

在Laya IDE中 切換視圖模式為 編輯模式  快捷鍵 ALT+W

然后在左下角資源列表中 打開(kāi)所在目錄

拷貝圖片資源文件到文件夾中 回到IDE中 刷新即可 效果如圖

開(kāi)始建立動(dòng)畫(huà)

在編輯視圖中, 右鍵項(xiàng)目新建一個(gè)動(dòng)畫(huà)

將攻擊圖片集合 拖到時(shí)間軸上

修改動(dòng)效名稱為attack 這里很重要 一會(huì)兒要用到

再把move圖片集合拖拽過(guò)來(lái) 動(dòng)效名稱設(shè)置為 move

更新日志

html5編程工具(LayaAir IDE) 2.7.0

3D物理功能增強(qiáng)

在LayaAir 3D物理中，本次的2.7版本，增加了固定關(guān)節(jié)組件Fixed Joint和可配置關(guān)節(jié)組件Configurable Joint的支持。開(kāi)發(fā)者可以直接將Unity中的Fixed Joint以及Configurable Joint這兩個(gè)物理關(guān)節(jié)組件，通過(guò)LayaAir的Unity導(dǎo)出插件，一鍵導(dǎo)出后直接在LayaAir引擎中使用。

Unity的固定關(guān)節(jié)組件Fixed Joint在LayaAir引擎中為FixedConstraint（固定約束），用于約束一個(gè)游戲?qū)ο髮?duì)另一個(gè)游戲?qū)ο蟮倪\(yùn)動(dòng)，將兩個(gè)物體永遠(yuǎn)以相對(duì)的位置固定在一起，即使發(fā)生物理改變，它們之間的相對(duì)位置也將不變。

Unity的可配置關(guān)節(jié)組件Configurable Joint在LayaAir引擎中為ConfigurableConstraint（可配置約束），這是一種自定義的約束類型，開(kāi)發(fā)者可根據(jù)自身需求來(lái)設(shè)置六個(gè)自由度，此約束可以實(shí)現(xiàn)所有的約束類型功能。

我們還提供了斷開(kāi)力breakForce和斷開(kāi)扭矩breakTorque屬性，用來(lái)設(shè)置約束的強(qiáng)度極限，同時(shí)在Script3D類中提供了物理的生命周期方法onJointBreak()，當(dāng)約束力超過(guò)強(qiáng)度極限時(shí)，會(huì)打破約束，并調(diào)用該方法。

在易用性方面，本次版本還為剛體提供了約束查詢的屬性constaintRigidbodyA和constaintRigidbodyB，可方便查詢與自己相關(guān)的兩個(gè)約束的剛體名稱。

LayaAir的Unity導(dǎo)出插件增強(qiáng)

本次的版本對(duì)于LayaAir的Unity導(dǎo)出插件也有所增強(qiáng)。更新如下：

增加導(dǎo)出 Cast Shadow / Receive Shadows 屬性，Cast Shadow支持開(kāi)關(guān)（On/ Off）控制。

light相關(guān)燈光設(shè)置暫不支持導(dǎo)出，需要在引擎內(nèi)單獨(dú)設(shè)置。

增加iOS紋理壓縮的等級(jí)設(shè)置（高質(zhì)量圖片的導(dǎo)出會(huì)非常消耗時(shí)間），大家可根據(jù)需要設(shè)置即可。并且重構(gòu)了紋理壓縮的導(dǎo)出流程，輸出了導(dǎo)出壓縮紋理進(jìn)度。

在物理組件方面，新增導(dǎo)出物理FixedJoint組件和物理ConfigurableJoint組件。

增加導(dǎo)出SkinMeshEnable屬性。

增加Unity導(dǎo)出支持的屬性表，內(nèi)置在插件中，開(kāi)發(fā)者可以在插件中直接找到此版本支持哪些導(dǎo)出屬性。

支持cannon.js物理引擎

LayaAir內(nèi)置的物理引擎是Bullet物理引擎，功能強(qiáng)大豐富。是我們推薦的引擎。考慮到有開(kāi)發(fā)者反饋，某些產(chǎn)品只需要用到物理檢測(cè)，碰撞等很基礎(chǔ)的功能，并且希望引擎庫(kù)的包體盡可能縮小。因此，我們決定在本次的2.7版本中，支持cannon.js物理引擎庫(kù)，包括以下的cannon物理功能：

(1)cannon物理射線檢測(cè)

(2)cannon物理碰撞檢測(cè)

(3)cannon物理box，sphere，compoundCollider的實(shí)現(xiàn)

(4)cannon物理trigger的實(shí)現(xiàn)

(5)cannon物理形狀Scale的實(shí)現(xiàn)

(6)cannon物理碰撞事件，觸發(fā)事件的實(shí)現(xiàn)

(7)cannon物理屬性（彈力，摩擦力等）的實(shí)現(xiàn)

(8)cannonCollider中增加localOffset屬性

自此，開(kāi)發(fā)者如果使用物理功能不多的情況下，可以選擇cannon物理引擎方案。滿足基礎(chǔ)物理引擎功能使用的同時(shí)，相對(duì)于Bullet引擎大幅減少了包體。因?yàn)?，使用cannon物理引擎方案，需要引入的cannon與cannonPhysics這兩個(gè)庫(kù)壓縮后總和也不足200k。