跳到主要内容

LayaAir

安装​

  1. 点击跳转，使用git clone仓库或者切换到对应laya版本的分支下载并解压。 切换分支

解压后master(LayaAir>=3.0.0)版本的目录结构为：

...
└── FairyGUI-layabox
    ├─demo
    └─source
        │  gulpfile.js
        │  package.json
        │  ...
        ├─bin
        │      fairygui.d.ts
        │      fairygui.js
        │      rawinflate.min.js
        │      
        ├─lib
        │      LayaAir.d.ts
        │      rawinflate.d.ts
        ├─src
    ...

将fairygui.js,fairygui.d.ts以及依赖的rawinflate.min.js拷贝到你的laya工程根目录下的assets/fairygui目录（如果你在编辑器发布设置-高级设置面板不勾选压缩描述文件，那么rawinflate.min.js是不需要的）。

...
└── your-laya-project
    └─assets
        ├─fairygui
        │  │  fairygui.js
        |  |  fairygui.d.ts
        │  │  rawinflate.min.js
    ...

使用​

  1. 将fairygui.js设置为插件，如下图：

使用 图示 1

  1. 使用FairyGUI编辑器完成UI编辑，发布后得到如下两个（或以上）文件。

使用 图示 2

  1. 在程序启动时（或者在需要用到这些UI的适当地方）加载这两个文件，并完成初始化。
    onLoaded(): void {
        Laya.stage.addChild(fgui.GRoot.inst.displayObject);
        
        fgui.UIPackage.addPackage("resources/ui/Basic");
        fgui.UIConfig.defaultFont = "宋体";
        fgui.UIConfig.verticalScrollBar = "ui://Basic/ScrollBar_VT";
        fgui.UIConfig.horizontalScrollBar = "ui://Basic/ScrollBar_HZ";
        fgui.UIConfig.popupMenu = "ui://Basic/PopupMenu";
        fgui.UIConfig.buttonSound = "ui://Basic/click";
    }

FAQ​

  1. 因为rawinflate这个库在小游戏平台有问题，所以直接不使用它。请使用最新编辑器，在发布对话框，全局设置里不勾选“压缩描述文件”就可以了。rawinflate这个库就不会再引用到（也不需要打包了）。
  2. 发布包时请保持使用fui扩展名。LayaAirIDE发布时会自动转换为小游戏支持的扩展名，无需开发者处理。
  3. 在发布对话框，全局设置里勾选“使用二进制格式”。
  4. AddPackage有两种方式，一种是传统的传入文件名方式，另一种是直接传入fui整个文件的内容，也就是说不管你内容是从哪里来的。两种方式可以按需选择。
  5. 如果遇到加载失败，请检查laya的加载流程。因为FairyGUI不负责加载，你需要确保资源已经顺利加载了再AddPackage。