List添加子项的逐个显示问题-CSDN博客

通常情况下你会这么使用Flex List

用as声明一个数据源例如:

[Bindable]
private var dataArray:ArrayCollection = new ArrayCollection(...);//...这里指省略的数组内容

然后用mxml声明一个list，类似的代码如下:

<mx:List id="list0" width="165" dataProvider="{dataArray}".../>  //...这里指省略后面的属性

然后一个普通的List就得到了

你可能会注意到，list中的所有项是一起“瞬间”加入的，似乎略显突兀。

那么如何使元素项一次次、按照自己的意愿，慢慢的加入呢？

1.通过改变list组件大小，从视觉上“伪装”

事实上，这并不是根本的解决办法，而且似乎声东击西了。

思路是结合Flex基本效果，动态拉伸list组件大小。这样看起来这个list像是被一点点展开，有点接近我们所需要的效果了。但事实上仍然不是我们所要的，因为这样做的本质其实还是一次性装入数据源的。

2.结合List元素项改变效果，定时添加

查阅Flex API(我这里的版本是3.x), List

itemsChangeEffect
触发事件: itemsChange
当控件的数据提供程序发生更改时播放的数据效果。 默认情况下，List 控件不使用数据效果。对于 List 控件，将使用 DefaultListEffect 类的实例配置数据效果。	List

这里值得一提的是：itemsChangeEffect仅仅在List TileList的API中存在，在dataGrid和HorizontalList中不存在

TileList HorizontalList和List、DataGrid均继承于ListBase(从命名上看其实DataGrid也是一种list,就像你可以把它的每一列看成一个List)

为什么DataGrid中没有提供这个？也许有API开发人员的难处（或许出于性能考虑），也许dataGrid中有其他方式可以更好的实现没必要itemsChangedEffect

话说回来，一个可能的简单效果是这样:

<mx:DefaultListEffect id="myEffect" fadeOutDuration="1000"/>

然后在mxml里的list声明里，用itemsChangeEffect="myEffect"

<mx:List id="list0" width="165" dataProvider="{dataArray}" itemsChangeEffect="{myDLE} .../>//...这里指省略后面的属性

有了效果，我们就需要"效果触发器了"(也就是如何引发这个效果产生)

这里我们可以利用Timer定时器定时的给list数据源dataArray添加数据

Timer类的用法其实和Java里比较相似，你必须手动调用start方法

var myTimer:Timer = new Timer(500,5);//间隔500ms, 重复5次.API中的构造函数:Timer(delay:Number, repeatCount:int = 0), 默认repeatCount=0即一直循环
myTimer.addEventListener(TimerEvent.TIMER,addItem);
myTimer.start();

这里的addItem方法(其实目的就是改变dataArray)

 private var i:int = 0;
 private function addItem(evt:TimerEvent):void {
      dataArray.addItem("item" + (i++));
 }

基本就这么多了，然后运行测试。

list数据项是一个一个添加的，并且添加的过程中会有淡入的效果。

同样，你也可以设置删除时的效果。这里我就不赘述了

转载于:https://www.cnblogs.com/tech-romance/articles/1939928.html