白鹭引擎之使用自定义皮肤
发表于2018-11-13
白鹭引擎中可以定义一个exml文件来布局UI样式，然后在创建的代码中使用它。
官方链接：http://developer.egret.com/cn/github/egret-docs/extension/EUI/skin/part/index.html
这篇文章就给大家一些关于自定义皮肤容易犯错的地方，不注意代码就会出bug。
一、在构造函数中使用皮肤里定义的组件是，容易找不到组件。
class ExmlTestView extends eui.Component｛
constructor() ｛
super();
this.skinName = "resource/skins/ExmlTestViewSkin.exml";
this.initUI();
｝
public label: eui.Label;
private initUI() ｛
this.label.text = "hello world!";
this.label.textColor = 0xff0000;
｝
｝
如上代码，很容易在this.label.text = "hello world!";报错，找不到text，断点结果是label未定义，这是因为皮肤ExmlTestViewSkin.exml并未加载完成就是用里面组件导致，（如果未报错，也是可能，根据设备加载资源顺序有关）
将构造函数改成一下代码即可：
constructor() ｛
super();
this.addEventListener(eui.UIEvent.COMPLETE, this.initUI, this);
this.skinName = "resource/skins/ExmlTestViewSkin.exml";
｝
二、使用约束后，又在动画中更改坐标。
这个比较好理解，最后结果肯定是无效的，动画不是自己想要的，因此，在代码或者动画中动态改变位置或者是大小的，就不要使用约束了。