EUI库 - 概述

Posted 2020-10-01 阿里P7之路

 

新特性	36k
	访问EUI组件宽高时，也会跟原生显示对象的表现一致，立即能得到包含子项的宽高值
	统一的显示列表  普通对象和eui对象都可用addChild来添加
	一个逻辑组件只管代码控制，一个皮肤组件只负责外观
内部类	<e:Button label="按钮">          <e:Skin states="up,over,down,disable">              <e:Image source="image/button_up.png" includeIn="up" width="100%" height="100%" />              <e:Image source="image/button_down.png" includeIn="down" width="100%" height="100%" />              <e:Label id="LabelDisplay" left="20" right="20" top="10" text="{data.label}" />          </e:Skin>      </e:Button>   即这个皮肤只应用于这个button       <e:List id="list" cacheAsBitmap="false">          <e:itemRendererSkinName>              <e:Skin states="up,down">                  <e:Image source="image/button_up.png" includeIn="up" width="100%" height="100%" />                  <e:Image source="image/button_down.png" includeIn="down" width="100%" height="100%" />                 <e:Label id="LabelDisplay" left="20" right="20" top="10" text="{data.label}" />             </e:Skin>          </e:itemRendererSkinName>      </e:List>
	。当你需要复用这个按钮皮肤时，再一键将内部皮肤转换为独立EXML文件，变成可复用的。
	运行时解析EXML
	在EXML根节点上设置class属性，class属性的值会被解析并注册为全局类名。若不声明，这个EXML文件解析的类定义会被解析器作为一个临时变量返回。
exml描述非皮肤对象	原来EXML的根节点被限制为Skin皮肤节点 EXML的根节点不再必须是Skin，可以为任意组件。这个特性全面提升了EXML的适用范围，能够简化普通容器的显示列表创建过程。解析后的对象是一个继承自根节点的自定义类。定义了ID的节点，会在自定义类上以ID名声明一个成员变量持有该节点的引用。
动态数据绑定	之前我们通常要写一个ItemRenderer的逻辑类，覆盖dataChanged()方法，访问data属性，然后重新赋值刷新所有相关的视图组件。现在只需要简单地定义一个数据绑定标签，无需任何繁琐的过程