在游戲開發中,很多場景都需要使用到配表。常見的配表有excel表、xml文件、json文件等。其中,使用json文件作為配表可以有效地降低數據解析的難度和復雜度。而egret引擎提供了一些功能強大的工具,來幫助我們快速地解析讀取json文件。
首先,在egret項目中創建一個json文件,如下所示:
{
"id": 1,
"name": "John",
"age": 21
}
接下來,我們使用egret的Json解析類來讀取json文件。在egret項目中,有一個自帶的Json解析類egret.JSON。我們可以通過以下代碼來讀取json文件:
let data = RES.getRes("json_file_json");
let obj = egret.JSON.parse(data);
console.log(obj.id, obj.name, obj.age);
其中,RES.getRes用于從資源管理器中獲取json文件的路徑,egret.JSON.parse用于解析json文件內容。解析后的數據可以通過obj.id、obj.name、obj.age等屬性來訪問。
除了使用egret.JSON類解析json文件,我們還可以使用egret提供的DataGroup和eui.DataProvider類來展示配表的數據。具體步驟如下:
首先,在egret項目中創建一個DataGroup控件,如下所示:
<e:DataGroup id="dataList" left="45" right="45" top="120" bottom="120">
<e:itemRenderer>
<e:ItemRenderer class="MyItemRenderer" />
</e:itemRenderer>
</e:DataGroup>
接下來,在egret項目中創建一個實現了eui.ItemRenderer接口的自定義渲染器類MyItemRenderer,并實現其中的data屬性,如下所示:
class MyItemRenderer extends eui.ItemRenderer {
private label: eui.Label;
dataChanged() {
this.label.text = this.data.name + " : " + this.data.age;
}
}
最后,在項目中使用eui.DataProvider類來將json文件中的數據綁定到DataGroup控件上,如下所示:
let data = RES.getRes("json_file_json");
let obj = egret.JSON.parse(data);
let ac = new eui.ArrayCollection([obj]);
this.dataList.dataProvider = ac;
通過以上步驟,我們就可以在egret項目中利用json文件來展示配表的數據了。
上一篇vue dom 更新
下一篇vue dom 監聽