这是整个EUI组件的关系。
一般数据容器使用Group，在EUI开发界面后便不需要改变布局，除非自己想改变布局。将子元素添加进来需要指定宽高，不然新添加进来的子元素默认的宽高都是20.
List:
列表组件 List ，继承自 DataGroup，它和 DataGroup 的区别在于：
- 在 List 中选中一项，会触发
eui.ItemTapEvent.ITEM_TAP事件。 - List有选中项的概念，可以设置 List 中的默认选中项。
1.DataGroup 数据容器
2.ItemRenderer 单条数据模板
步骤：
1.先创建普通数组
2.用ArrayCollection包装这个数组 数据增删改变可以侦听到
3.dataGroup数据源 dataGroup.dataProvider = ArrayCollection
4.创建ItemRenderer 这是一个类。 可以设置皮肤 dataChaged方法是复写的
5.dataGroup.itemRenderer = 创建的ItemRenderer类。
如果 ItemRenderer 类中只是显示皮肤，没有自定义的逻辑方法。完全可以不创建自定义的 ItemRenderer 类，而通过 dataGroup.itemRendererSkinName() 方法直接使用 exml 描述文件来实现皮肤显示和数据绑定。显示效果完全相同，但可以少写一个类文件。
数据优化：
DataGroup 中有一个属性 useVirtualLayout，默认为 true，这个属性决定了列表创建内部对象的策略：
策略1
useVirtualLayout = false;
有多少条数据就创建多少个 ItemRenderer 的实例
策略2
useVirtualLayout = true;
3.一般配合 Scroller 使用。 EUI中，Scroller包含的List默认赋值给Scroller.这时设置List的宽高是无效的。如果所有的数据显示宽高之和没有Scroller的宽高大，则不会拖动，超过了才会有拖动的效果。数据的显示宽高在ItemRenderer皮肤或者类中指定。
DataGroup 会根据组件的尺寸，计算同时最多能显示多少个组件，根据这个数字创建一组 ItemRenderer 并循环使用。当您滚动切换数据的时候，只是这一组 ItemRenderer 循环切换自己的位置和显示，这个过程是顺畅的无缝衔接的。
list:
var list = new eui.List();
list.dataProvider = new eui.ArrayCollection(["item1","item2","item3"]);
list.itemRendererSkinName = exml;
this.addChild(list);
this.list = list;
list.selectedIndex = 1;//设置默认选中项
list.addEventListener(eui.ItemTapEvent.ITEM_TAP,this.onChange,this);
}
private onChange(e:eui.PropertyEvent):void{
//获取点击消息
console.log(this.list.selectedItem,this.list.selectedIndex)
}
设置默认选中项
list.selectedIndex = 1;
获取当前选中项的信息
list.selectedItemlist.selectedIndex
List 还可以开启多选状态
list.allowMultipleSelection = true;
多选状态下，List 中所有的条目都可以被选中，再次点击选中的条目则会取消选中，恢复原状。
此时监听 eui.ItemTapEvent.ITEM_TAP 事件，可以通过下面两个属性获得一个数组，里面包含了当前处于选中状态的项目：
list.selectedIndiceslist.selectedItems
最终效果：
