效果图:
主应用程序代码:
<?xml version="1.0" encoding="utf-8"?>
<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" minWidth="955" minHeight="600" creationComplete="application1_creationCompleteHandler(event)">
<s:layout>
<s:BasicLayout/>
</s:layout>
<fx:Declarations>
<!-- 将非可视元素(例如服务、值对象)放在此处 -->
<s:HTTPService id="phoneList" url="resource/xml/phonelist.xml" result="phoneList_resultHandler(event)"/>
</fx:Declarations>
<fx:Script>
<![CDATA[
import com.spring.renderer.phoneItemRenderer;
import mx.collections.ArrayCollection;
import mx.controls.Alert;
import mx.events.FlexEvent;
import mx.rpc.events.ResultEvent;
import spark.components.supportClasses.ItemRenderer;
import spark.events.IndexChangeEvent;
import spark.skins.spark.DefaultComplexItemRenderer;
[Bindable]private var phoneData:ArrayCollection;
protected function phoneList_resultHandler(event:ResultEvent):void
{
phoneData=event.result.phoneList.phone;
}
protected function application1_creationCompleteHandler(event:FlexEvent):void
{
phoneList.send();
}
protected function dropdownlist1_changeHandler(event:IndexChangeEvent):void
{
switch(category.selectedIndex){
case 0: showPhone.dataProvider=phoneData[0].object;break;
case 1: showPhone.dataProvider=phoneData[1].object;break;
case 2: showPhone.dataProvider=phoneData[2].object;break;
}
}
]]>
</fx:Script>
<s:Panel x="115" y="105" width="726" height="382" title="产品库存管理模块">
<mx:DataGrid id="showPhone" width="100%" height="100%" textAlign="center" rowHeight="90">
<mx:columns>
<mx:DataGridColumn headerText="产品名称" itemRenderer="com.spring.renderer.nameItemRenderer"/>
<mx:DataGridColumn headerText="产品外观" itemRenderer="com.spring.renderer.phoneItemRenderer" />
<mx:DataGridColumn headerText="产品数量" itemRenderer="com.spring.renderer.priceItemRenderer"/>
<mx:DataGridColumn headerText="是否进货" itemRenderer="com.spring.renderer.checkBoxRenderer"/>
<mx:DataGridColumn headerText="提交" itemRenderer="com.spring.renderer.buttonRenderer"/>
</mx:columns>
</mx:DataGrid>
<s:controlBarContent>
<s:HGroup verticalAlign="middle" width="100%" height="24" y="48">
<s:Label text="请选择商品" height="15"/>
<s:DropDownList id="category" dataProvider="{phoneData}" labelField="name" change="dropdownlist1_changeHandler(event)">
</s:DropDownList>
</s:HGroup>
</s:controlBarContent>
</s:Panel>
</s:Application>
项呈示器代码:
(1)com.spring.renderer.nameItemRenderer
<?xml version="1.0" encoding="utf-8"?>
<s:MXDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
focusEnabled="true">
<s:layout>
<s:HorizontalLayout horizontalAlign="center" verticalAlign="middle"/>
</s:layout>
<s:Label id="lblData" top="0" left="0" right="0" bottom="0" text="{data.name}" />
</s:MXDataGridItemRenderer>
(2)com.spring.renderer.phoneItemRenderer
<?xml version="1.0" encoding="utf-8"?>
<s:MXDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
focusEnabled="true">
<s:layout>
<s:HorizontalLayout horizontalAlign="center" verticalAlign="middle"/>
</s:layout>
<mx:Image id="p_w_picpath" top="0" left="0" right="0" bottom="0" source="resource/{data.path}.png">
</mx:Image>
</s:MXDataGridItemRenderer>
(3)com.spring.renderer.priceItemRenderer
<?xml version="1.0" encoding="utf-8"?>
<s:MXDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
focusEnabled="true">
<s:layout>
<s:HorizontalLayout horizontalAlign="center" verticalAlign="middle"/>
</s:layout>
<s:Label id="lblData" top="0" left="0" right="0" bottom="0" text="{data.value}" />
</s:MXDataGridItemRenderer>
(4)com.spring.renderer.checkBoxRenderer
<?xml version="1.0" encoding="utf-8"?>
<s:MXDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
focusEnabled="true">
<s:layout>
<s:HorizontalLayout horizontalAlign="center" verticalAlign="middle"/>
</s:layout>
<s:CheckBox>
</s:CheckBox>
</s:MXDataGridItemRenderer>
(5)com.spring.renderer.buttonRenderer
<?xml version="1.0" encoding="utf-8"?>
<s:MXDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
focusEnabled="true">
<s:layout>
<s:HorizontalLayout horizontalAlign="center" verticalAlign="middle"/>
</s:layout>
<!--<s:Label id="lblData" top="0" left="0" right="0" bottom="0" text="{dataGridListData.label}" />-->
<s:Button top="0" left="0" right="0" bottom="0" label="提交">
</s:Button>
</s:MXDataGridItemRenderer>
转载于:https://blog.51cto.com/4428602/904886