Flex 3: 构建高级用户界面 使用数据提供程序6

修改数据提供器的数据，并监听这个事件
在Flex中，Collection类实现了IList接口，这个接口提供一些方法(adding,removing,updating)来修改集合中的元素。可以使用IList接口的方法和属性在ArrayCollection类, XMLList类,和标准Flex控件的dataProvider 属性上。可以使用IList的addItem(), removeItem(), 和setItemAt() 方法分别增加，删除和更新元素数据。addItemAt() and removeItemAt() methods, 和the setItemAt()方法提供第二个参数，下标位置，来指定要在集合中影响的位置。IList接口的length属性返回集合中元素的数量。

Flex的集合机制也包括描述数据改变的事件。实现了IList 或者 ICollectionView 接口的类，无论何时数据发生改变，都分发CollectionEvent类事件所有集合时间都包含类型属性值CollectionEvent.COLLECTION_CHANGE。

注意：你也可以使用ICollectionView接口来保存和过滤数据。更多的信息请查看Flex3开发手册的Using ICollectionView interface methods and properties章节

CollectionEvent对象有kind属性标志着集合被改变的方式。通过kind属性与CollectionEventKind的常量的对比，你可以测试集合所发生的改变。主要的常量包括ADD,REMOVE和 UPDATE。

CollectionEvent对象包含一个items属性这个属性是一个对象的数组，这个数组的类型依赖于对象分发的事件的类型。对于ADD和REMOVE时间，这个数组包含added和removed数组。对于UPDATE事件，这个items属性包含PropertyChangeEvent事件对象数组。这些对象的属性显示出改变的类型和属性改变之前和之后的值。例如，PropertyChangeEvent类的kind属性显示出属性被改变的方式；你可以测试改变的类型通过把kind属性与PropertyChangeEventKind的常量UPDATE或DELETE.

下边的例子监听DataGrid的改变事件，来创建一个概览——详细关系。在这个关系中，选择一个DataGrid中的一行后，数据会显示在几个form控件中，然后你就可以编辑数据了。（使用概览——详细关系可以使DataGrid控件具有可编辑功能）。通过IList接口的addItem(), removeItem(), and setItemAt()方法，可以对DataGrid中的数据增加，删除，修改。这个例子也监听ArrayCollection上的collectionChange时间保持对数据增删改的日志记录。

例子

    xmlns:mx=" http://www.adobe.com/2006/mxml"
     viewSourceURL="src/DataProviderModifyingAndEvents/index.html"
    width="525" height="530"

>
   
                    import mx.events.*;
            import mx.collections.*;
            // Add event information to a log (displayed in the TextArea).

            public function collectionEventHandler(event:CollectionEvent):void
            {
                switch(event.kind)
                {

                    case CollectionEventKind.ADD:
                        addLog("Item "+ event.location + " added");
                        break;
                    case CollectionEventKind.REMOVE:

                        addLog("Item "+ event.location + " removed");
                        break;
                    case CollectionEventKind.REPLACE:

                        addLog("Item "+ event.location + " Replaced");
                        break;
                    case CollectionEventKind.UPDATE:

                        addLog("Item updated");
                        break;
                }
            }
            // Helper function for adding information to the log.
            public function addLog(str:String):void
            {

                log.text += str + "/n";
            }
            // Add a person to the ArrayCollection.
            public function addPerson():void
            {

                ac.addItem({first:firstInput.text, last:lastInput.text,
                        email:emailInput.text});
                clearInputs();
            }
            // Remove a person from the ArrayCollection.

            public function removePerson():void
            {
                // Make sure an item is selected.
                if (dg.selectedIndex >= 0)
                {

                    ac.removeItemAt(dg.selectedIndex);
                }
            }
            // Update an existing person in the ArrayCollection.
            public function updatePerson():void
            {

                // Make sure an item is selected.
                if (dg.selectedItem !== null)
                {
                    ac.setItemAt({first:firstInput.text, last:lastInput.text,
                        email:emailInput.text}, dg.selectedIndex);
                }

            }
            // The change event listener for the DataGrid.
            // Clears the text input controls and updates them with the contents
            // of the selected item.
            public function dgChangeHandler():void
            {

                clearInputs();
                firstInput.text = dg.selectedItem.first;
                lastInput.text = dg.selectedItem.last;
                emailInput.text = dg.selectedItem.email;
            }
            // Clear the text from the input controls.

            public function clearInputs():void
            {
                firstInput.text = "";
                lastInput.text = "";
                emailInput.text = "";
            }

        ]]>
   
   
   

            collectionChange="collectionEventHandler(event)">
       
           

                       

       
   

   
       

                change="dgChangeHandler()">