---
# System prepended metadata

title: FairyGUI with Egret Framework
tags: [Egret]

---

# FairyGUI with Egret Framework

## 讀取流程

場景(繼承core.Scene)使用的FGUI開發完成，發佈會產生fui檔和atlas圖檔，將它們拉進ResDepot，需要跟著修改名稱(把_fui和_png的部分移除掉，不然atlas會讀不到)，group設定為對應該場景的group

![](https://i.imgur.com/DhZXevl.png)

官方說明:
![](https://i.imgur.com/AhcWSue.png)

FGUI設定:
![](https://i.imgur.com/3vBBfrJ.png)

場景在轉場時(透過Application.changeScene)
會依照場景設定的Package名稱和Component名稱讀取FGUI的資源，
如果有相依的Package也會一起讀取進來，場景設定如下圖:

![](https://i.imgur.com/PKruSWH.png)

---

## 物件綁定

FGUI的資源讀取完成後，會將Component掛到Egret的根節點下，然後會仿照Egret的方式將Component(sceneName設定的)Hierarchy上的物件綁定到場景<font color=#FF0000>**同樣名稱**</font>的變數，如下圖

![](https://i.imgur.com/HBgXsZI.png)

![](https://i.imgur.com/id1YHOY.png)

備註:
1. FGUI上名稱設定前綴有**底線**的就會略過綁定。 (ex: _button)
2. 不會遞迴尋找Component綁定，只會綁定Hierarchy最上層的物件(內部Component可自行使用**core.Application.parseFairyComponent**來綁定)

## 龍骨動畫

1. 由於使用FGUI的免費版，龍骨無法自動播放，需設定動畫名稱
```
this.lobby_palmtree_bd.animationName = "animtion0";
```
2. 由於FGUI在**removePackage**時<font color=#FF0000>**不會跟著釋放龍骨資源**</font>，所以場景有設定在onDestroy時手動釋放，<font color=#FF0000>**需要把龍骨FGUI物件(GLoader3D)的名稱設定為龍骨資源名稱**</font>才能正常釋放，如下圖:
(ex: lobby_palmtree_bd_ske , GLoader3D名稱就設定為lobby_palmtree_bd)

![](https://i.imgur.com/d2e3W5Z.png)

## 多國語言

轉場時(透過Application.changeScene)會將FGUI根據目前語言切到對應的branch，讀取對應的atlas，branch設定如下:
PS. branch不存在時，會讀取trunk
![](https://i.imgur.com/21DNEWs.png)

:::warning
目前龍骨資源切換branch不會變更對應版本，故多國語言機制走之前的方式
依照language資料夾切分。
範例:
resource\assets\language\en_us\common\effect\common_game_effect_continue_ske.json

resource\assets\language\id_id\common\effect\common_game_effect_continue_ske.json

res.json內隨意放入其中一種語言版本即可
:::


###### tags: `Egret`