把Slider组件放入DataGrid组件的列中.
<mx:itemRenderer>标签学习。
示例:
代码:
示例:
代码:
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/05/09/using-a-slider-control-as-a-datagrid-column-item-renderer-in-flex/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">
<mx:ArrayCollection id="arrColl">
<mx:source>
<mx:Array>
<mx:Object label="Student A" score="85" />
<mx:Object label="Student B" score="48" />
<mx:Object label="Student C" score="71" />
<mx:Object label="Student D" score="88" />
<mx:Object label="Student E" score="24" />
<mx:Object label="Student F" score="64" />
<mx:Object label="Student G" score="76" />
<mx:Object label="Student H" score="76" />
<mx:Object label="Student I" score="93" />
<mx:Object label="Student J" score="88" />
<mx:Object label="Student K" score="48" />
<mx:Object label="Student L" score="76" />
</mx:Array>
</mx:source>
</mx:ArrayCollection>
<mx:DataGrid id="dataGrid"
dataProvider="{arrColl}"
selectable="false"
rowCount="6"
width="500">
<mx:columns>
<mx:DataGridColumn dataField="label" />
<mx:DataGridColumn dataField="score" />
<mx:DataGridColumn dataField="score">
<mx:itemRenderer>
<mx:Component>
<mx:HBox horizontalScrollPolicy="off"
verticalScrollPolicy="off">
<mx:Script>
<![CDATA[
import mx.events.SliderEvent;
private function slider_change(evt:SliderEvent):void {
data.score = evt.value;
outerDocument.arrColl.refresh();
}
]]>
</mx:Script>
<mx:HSlider minimum="0"
maximum="100"
value="{data.score}"
liveDragging="true"
snapInterval="1"
width="100%"
change="slider_change(event);" />
</mx:HBox>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
</mx:columns>
</mx:DataGrid>
</mx:Application>
<!-- http://blog.flexexamples.com/2008/05/09/using-a-slider-control-as-a-datagrid-column-item-renderer-in-flex/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">
<mx:ArrayCollection id="arrColl">
<mx:source>
<mx:Array>
<mx:Object label="Student A" score="85" />
<mx:Object label="Student B" score="48" />
<mx:Object label="Student C" score="71" />
<mx:Object label="Student D" score="88" />
<mx:Object label="Student E" score="24" />
<mx:Object label="Student F" score="64" />
<mx:Object label="Student G" score="76" />
<mx:Object label="Student H" score="76" />
<mx:Object label="Student I" score="93" />
<mx:Object label="Student J" score="88" />
<mx:Object label="Student K" score="48" />
<mx:Object label="Student L" score="76" />
</mx:Array>
</mx:source>
</mx:ArrayCollection>
<mx:DataGrid id="dataGrid"
dataProvider="{arrColl}"
selectable="false"
rowCount="6"
width="500">
<mx:columns>
<mx:DataGridColumn dataField="label" />
<mx:DataGridColumn dataField="score" />
<mx:DataGridColumn dataField="score">
<mx:itemRenderer>
<mx:Component>
<mx:HBox horizontalScrollPolicy="off"
verticalScrollPolicy="off">
<mx:Script>
<![CDATA[
import mx.events.SliderEvent;
private function slider_change(evt:SliderEvent):void {
data.score = evt.value;
outerDocument.arrColl.refresh();
}
]]>
</mx:Script>
<mx:HSlider minimum="0"
maximum="100"
value="{data.score}"
liveDragging="true"
snapInterval="1"
width="100%"
change="slider_change(event);" />
</mx:HBox>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
</mx:columns>
</mx:DataGrid>
</mx:Application>