Question

如何解决和回避Egret开发中遇到的坑

Answer 1

导入fairygui库（坑点）

将bin目录下文件保存到 项目根目录/libs/fairygui/目录下

将libs目录下文件保存到 项目根目录/libs/rawinflate/目录下 

注意如果rawinflate 目录下扮败没有rawinflate.js，则复制rawinflate.min.js保存为rawinflate.js

（egret在本地调试调用的是.js文件，如果不存在则会报错，未找到Zlib库）

在egretProperties.json文件中添加（重点）

{
"name": "rawinflate",
"path": "./libs/rawinflate"
},
{
"name": "fairygui",
"path": "./libs/fairygui"
}

测试UI案例

将导出的资源添加到resource/fairygui/目录下

修改default.res.json文件,导出的图片文件注意TankGame@atlas0命名规范

{
"groups": [
{
"keys": "TankGame,TankGame@atlas0",
"name": "preload"
}
],
"resources": [
{
"name": "TankGame",
"type": "bin",
"url": "fairygui/TankGame.fui"脊缺巧
},
{
"name": "TankGame@atlas0",
"type": "image",
"url": "樱键fairygui/TankGame@atlas0.png"
}
]
}

修改Main.ts文件

protected startCreateScene(): void {
fairygui.UIPackage.addPackage("TankGame")
this.addChild(fairygui.GRoot.inst.displayObject)
let uiPanel = new UIPanel()
}

class UIPanel {
private root: fairygui.GComponent;

public constructor() {
this.root = fairygui.UIPackage.createObject("TankGame","Main").asCom;
this.root.setSize(fairygui.GRoot.inst.width,fairygui.GRoot.inst.height)
fairygui.GRoot.inst.addChild(this.root)
}
}

演示效果