场景创建：
1.创建EUI项目
2.用Egret UI Editor打开项目
3.创建场景（新建皮肤）
- 将场景创建在
resource/eui_skins/目录下 - 创建场景
resource/eui_skins/myskins/StartSceneSkin.exml - 配置场景显示内容（
场景、控件、约束、尺寸位置）
4.命令运行项目egret run -a
发现项目无法显示场景,需要在代码中引用场景
5.引用场景（皮肤）
方法一
- 创建引用场景类
-
eui-demo/src/StartScene.ts
- 具体代码
class StartScene extends eui.Component implements eui.UIComponent {
constructor() {
super();
// 绑定场景
this.skinName = 'resource/eui_skins/myskins/StartSceneSkin.exml'
}
protected partAdded(partName: string, instance: any): void {
super.partAdded(partName, instance);
}
protected childrenCreated(): void {
super.childrenCreated();
}
}- 这个时候你可能急着去运行项目了，发现没什么luan用，不报错也不展示
- 因为你没在
main.ts引用使用这个场景 -
this.addChild(new StartScene());
方法二
- 创建引用场景类
-
eui-demo/src/StartScene.ts
- 具体代码
class StartScene extends eui.Component implements eui.UIComponent {
constructor() {
super();
}
protected partAdded(partName: string, instance: any): void {
super.partAdded(partName, instance);
}
protected childrenCreated(): void {
super.childrenCreated();
}
}- 这个时候你可能急着去运行项目了，发现没什么luan用，不报错也不展示
- 因为你没在
main.ts引用使用这个场景 -
this.addChild(new StartScene());
- 然后运行还是不显示，因为没有绑定场景
- 绑定方法为修改
resource/default.thm.json 配置文件
{
"skins": {
"StartScene": "resource/eui_skins/myskins/StartSceneSkin.exml"
},
"exmls": [
"resource/eui_skins/myskins/StartSceneSkin.exml"
]
}6.运行项目
- 命令：
egret run -a - 来吧，展示（
可以用 Egret Inspector 工具进行调试）：
可能问题：
当创建场景时没有创建在resource/eui_skins/这个目录下，而是创建在了resource/这个目录下，创建为resource/my_skins/MySceneSkin.exml，这个时候我们在Egret UI Editor软件中无法看到我们创建的场景。
- 解决方法（
配置 egretProperties.json 文件）：
{
"eui": {
"exmlRoot": [
"resource/eui_skins",
"resource/my_skins"
],
"themes": [
"resource/default.thm.json"
],
"exmlPublishPolicy": "commonjs"
}
}- 这个时候我们就能看见场景了
- 后边的步骤就都一样了
