flex组件学习——repeater组件

现在学习下flex中最强大的组件之一——Repeater组件

1.Repeater的作用功能

2.Repeater的常用属性及事件简介

3.Repeater小例子

1.Repeater的作用及功能

    Repeater这个组件会与数据源联系起来，并对每个数据实例重复其内的构造。运行时动态重复mxml的内容

        如：有一个网站购物系统，每件商品上都有一个按钮“添加到购物车”，则可以用Repeater这个组件来实现，Repeater可以一边绑定数据源，一边只写一个“添加到购物车”按钮在Repeater中就可以了。

    

2.Repeater的常用属性及事件简介

    常用属性

    dataProvider：Object 此Repeater创建子项的重复实例时使用的数据源

    startingIndex：int dataProvider中的索引，此Repeater从此索引位置开始创建子项

    count：int 此Repeater应执行的次数

    currentIndex：int Repeater执行时，当前正在处理的dataProvider中项目的索引（currentIndex返回currentItem在ArrayCollection中的位置。在想给某事物编号时，会很有用滴）

    currentItem：Object 此Repeater执行时，当前正在处理的dataProvider中的项目（Repeater组件每次创建一个新的重复后，引起此重复的数据就会成为一个名为currentItem的属性。）

    recycleChildren：Boolean 布尔值标志，指示此Repeater是重新使用以前创建的子项还是创建新子项。

    常用事件

    repeat 每次处理项目或更新currentIndex和currentItem属性时调度

    repeatEnd 创建Repeater的所有组件后调度

    repeatStat 当flex开始处理dataProvider属性并开始创建指定的子组件时调度

3.Repeater小例子

代码：

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="" layout="vertical">

    <mx:Script>
        <![CDATA[
            private function getBookData(repeaterData:String):void{
                nameLabel.text = repeaterData;
            }
        ]]>
    </mx:Script>

    <mx:Model id="bookData">
        <books>
            <bookName>xml for flash</bookName>
            <bookName>ActionScript for Animation</bookName>
            <bookName>Foundation flash 8 Video</bookName>
        </books>
    </mx:Model>

    <mx:ArrayCollection id="bookArray" source="{bookData.bookName}"/>
    <mx:Repeater id="bookRepeater" dataProvider="{bookArray}">
        <mx:Label text="{bookRepeater.currentIndex+1}{bookRepeater.currentItem}"/>
        <mx:Button label="Add to Cart" click="getBookData(event.target.getRepeaterItem())"/>
    </mx:Repeater>
    <mx:Label id="nameLabel"/>
</mx:Application>

效果：