XMLListCollection objects

http://help.adobe.com/en_US/flex/using/WS2db454920e96a9e51e63e3d11c0bf69084-7b69.html#WS2db454920e96a9e51e63e3d11c0bf69084-7b5b


XMLListCollection objects provide collection functionality to an XMLList object and make available some of the XML manipulation methods of the native XMLList class, such as the attributes(), children(), and elements() methods. For details of the supported methods, see XMLListCollectionin the ActionScript 3.0 Reference for the Adobe Flash Platform.

The following simple example uses an XMLListCollection object as the data provider for a List control. It uses XMLListCollection methods to dynamically add items to and remove them from the data provider and its representation in the List control. The example uses a Tree control to represent a selection of shopping items and a List collection to represent a shopping list.

Users add items to the List control by selecting an item in a Tree control (which uses a static XML object as its data provider) and clicking a button. When the user clicks the button, the event listener uses the XMListCollection addItem() method to add the selected XML node to the XMLListCollection. Because the data provider is a collection, the List control is updated to show the new data.

Users remove items in a similar manner, by selecting an item in the list and clicking the Remove button. The event listener uses the XMListCollection removeItemAt() method to remove the item from the data provider and its representation in the List control.

<?xml version="1.0"?>
<!-- dpcontrols\XMLListCollectionWithList.mxml -->
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
width="550">

<fx:Script>
<![CDATA[
import mx.collections.XMLListCollection;
import mx.collections.ArrayCollection;

/* An XML object with categorized produce. */
[Bindable]
public var myData:XML=
<catalog>
<category name="Meat">
<product name="Buffalo"/>
<product name="T Bone Steak"/>
<product name="Whole Chicken"/>
</category>
<category name="Vegetables">
<product name="Broccoli"/>
<product name="Vine Ripened Tomatoes"/>
<product name="Yellow Peppers"/>
</category>
<category name="Fruit">
<product name="Bananas"/>
<product name="Grapes"/>
<product name="Strawberries"/>
</category>
</catalog>;

/* An XMLListCollection representing the data
for the shopping List. */
[Bindable]
public var listDP:XMLListCollection = new XMLListCollection(new XMLList());

/* Add the item selected in the Tree to the List XMLList data provider. */
private function doTreeSelect():void {
if (prodTree.selectedItem)
listDP.addItem(prodTree.selectedItem.copy());
}

/* Remove the selected in the List from the XMLList data provider. */
private function doListRemove():void {
if (prodList.selectedItem)
listDP.removeItemAt(prodList.selectedIndex);
}
]]>
</fx:Script>

<s:HGroup>
<mx:Tree id="prodTree" dataProvider="{myData}" width="200"
showRoot="false" labelField="@name"/>
<s:VGroup>
<s:Button id="treeSelect" label="Add to List"
click="doTreeSelect()"/>
<s:Button id="listRemove" label="Remove from List"
click="doListRemove()"/>
</s:VGroup>
<s:List id="prodList" dataProvider="{listDP}" width="200"
labelField="@name"/>
</s:HGroup>
</s:Application>

The executing SWF file for the previous example is shown below:


Comments