标签:height strong mic horizon 结果 button vertica ext 方式
EXML是可以运行时加载解析的 | |
<e:Skin class="skins.ButtonSkin" states="up,down,disabled" minHeight="50" minWidth="100" xmlns:e="http://ns.egret.com/eui"> <e:Image width="100%" height="100%" scale9Grid="1,3,8,8" alpha.disabled="0.5"source="button_up_png"source.down="button_down_png"/> </e:Skin> |
|
直接引用Exml文件 | 假设 exml的要节点是 Skin这时可以直接这样var button = new eui.Button();button.skinName = "resource/skins/ButtonSkin.exml"this.addChild( button ) ; |
动态加载Exml文件 | 如果 exml的根节点不是 SkinEXML.load( "skins/ButonSkin.exml", this.onLoaded, this ) ;private onLoaded( clazz:any, url:string ):void{ var button = new eui.Button(); button.skinName = clazz ; this.addChild( button ) ;} |
嵌入EXML到代码 | var className = "skins.ButtonSkin";var exmlText = `<e:Skin class="${className}" states="up,over,down,disabled" xmlns:s="http://ns.egret.com/eui"> ...</e:Skin>`;var button = new eui.Button(); button.skinName = exmlText ; this.addChild( button ) ;
|
<e:Group class="app.MyGroup" xmlns:e="http://ns.egret.com/eui"> </e:Group> export class MyGroup extends eui.Group { public constructor(){super();}}} |
|
最基本的图片 | <e:Image source="image/button_up.png" x="10"/><e:Image source="image/button_up.png" x="10"> <e:scale9Grid> <e:Rectangle x="10" y="10" width="45" height="35"/> </e:scale9Grid> |
id属性 |
这个id属性与HTML中的id并不是一回事,它的结果相当于给解析后的类声明了一个公开变量
<e:Image id="iconDisplay" />
</e:Group>
等价于:
- export class MyGroup extends eui.Group {
- public iconDisplay:eui.Image;
- public constructor(){- super();- var image = new eui.Image();- this.addChild(image);- this.iconDisplay = image;- }- }- }
|
语法糖 |
<e:Image source="image/button_up.png" x="10" scale9Grid="10,10,45,35" />
节点默认属性我们已经知道了复杂属性节点的声明方式,要先显式声明一个属性名称的节点,内部再跟上要赋值的节点。这里还有一个类似语法糖的写法,eui库内的组件,通常都会有一个默认属性,如果子节点是赋值给父节点的默认属性,那么可以省略属性名节点。我们来看一个例子:
<e:Scrollerclass="app.MyScroller"xmlns:e="http://ns.egret.com/eui">
<e:viewport>
<e:Group/>
</e:viewport>
</e:Scroller>
这个例子中,我们将Group实例赋值给了一个滚动容器Scroller的viewport属性。由于viewport是Scroller的默认属性,因此我们可以直接省略<e:viewport>节点,改成如下写法:
<e:Scrollerclass="app.MyScroller"xmlns:e="http://ns.egret.com/eui">
<e:Group/>
</e:Scroller>
默认属性除了支持省略属性名节点外,若默认属性的类型是一个数组,还可以省略Array节点。其实添加子项也只是省略默认属性的一种特例,因为容器的默认属性是elementsContent,类型正是数组。最开始添加子项的那个例子完整写法如下:
<e:Groupclass="app.MyGroup"xmlns:e="http://ns.egret.com/eui">
<e:elementsContent>
<e:Array>
<e:Image/>
</e:Array>
</e:elementsContent>
</e:Group>
当然,我们直接用最简洁的省略默认属性写法即可。
|
内部类 | 除了皮肤,ItemRenderer也是一个典型的使用率很高且不复用的组件。我们现在也可以直接内嵌ItemRender的皮肤到List节点中: |
视图状态 |
也算是语法糖的一种
在根节点上,我们声明了视图状态名称列表 states="up,over,down,disabled",它表示这个皮肤具有up,over,down,disabled这四种状态,当皮肤的currentState属性被逻辑组件设置为这四个状态之一时
1.添加移除对象, includeIn之外,还有一个excludeFrom
2.设置属性。 textColor.down="0x009aff"
|
标签:height strong mic horizon 结果 button vertica ext 方式
原文地址:http://www.cnblogs.com/jason-beijing/p/7295890.html