Flex ArrayCollection数据添加删除的例子

来源：互联网发布：西班牙语字典推荐知乎编辑：程序博客网时间：2024/05/19 04:53

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical">

<mx:Script>

<![CDATA[

import mx.controls.Alert;

import mx.collections.ArrayCollection;

[Bindable]

private var dIcon:ArrayCollection = new ArrayCollection([

{name:'aa',price:10,img:'qq.png'},

{name:'bb',price:20,img:'qq2.png'},

{name:'cc',price:30,img:'qq3.png'},

{name:'dd',price:40,img:'qq4.png'}

]);

[Bindable]

private var cbDate:ArrayCollection = new ArrayCollection([

{label:'icon1',data:'qq.png'},

{label:'icon2',data:'qq2.png'},

{label:'icon3',data:'qq3.png'},

{label:'icon4',data:'qq4.png'}

]);

private function addFn():void{

var newOne:Object = new Object();

newOne.name = nameBox.text;

newOne.price = priceBox.value;

newOne.img = imgBox.value;

dIcon.addItem(newOne);

//更新datagrid的所有行;

dg.invalidateList();

Alert.show('ok')

}

private function delecteFn():void{

var index:int = dg.selectedIndex;

dIcon.removeItemAt(index);

dg.invalidateList();

}

]]>

</mx:Script>

<mx:Panel title="数据添加删除例子" paddingTop="10" paddingRight="10" paddingBottom="10" paddingLeft="10">

<mx:DataGrid id="dg" dataProvider="{dIcon}" rowHeight="30">

<mx:columns>

<mx:DataGridColumn dataField="img" sortable="false" itemRenderer="mx.controls.Image" />

<mx:DataGridColumn dataField="name" sortable="false" />

<mx:DataGridColumn dataField="price" sortable="false" />

</mx:columns>

</mx:DataGrid>

<mx:ControlBar>

<mx:Form>

<mx:FormItem label="name:">

<mx:TextInput id="nameBox" text="" />

</mx:FormItem>

<mx:FormItem label="img:">

<mx:ComboBox id="imgBox" dataProvider="{cbDate}" />

</mx:FormItem>

<mx:FormItem label="price:">

<mx:NumericStepper id="priceBox" minimum="10" maximum="200" value="50" />

</mx:FormItem>

<mx:HBox>

<mx:Button label="add" click="addFn()" />

<mx:Button label="remove" click="delecteFn()" />

</mx:HBox>

</mx:Form>

</mx:ControlBar>

</mx:Panel>

</mx:Application>

0 0