1、 DataGrid中的行数据交换位置
2、 ArrayCollection排序
3、 将图片作为背景(非嵌入式)
NoBedImage
4、 Datagrid根据条件改变行背景色
DataGridDrawRowBackground
MyDataGrid
^_^ ^_^
附个人Cairngorm工程
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:window="com.diaztorres.window.*" xmlns:log="com.log.*">
<mx:Script>
<![CDATA[
import mx.collections.IList;
import mx.collections.ArrayCollection
import mx.controls.Alert;
public function moveUp(event : MouseEvent) : void
{
var i : int = peopleList.selectedIndex;
if (i >= 1&&peopleList.selectedItem)
{
IList(peopleList.dataProvider).addItemAt(peopleList.selectedItem,i-1);
//Alert.show(peopleList.selectedIndex.toString());
IList(peopleList.dataProvider).removeItemAt(i+1);
peopleList.selectedIndex = i;
//Alert.show(i.toString());
}
}
public function moveDown(event : MouseEvent) : void
{
var i : int = peopleList.selectedIndex;
if (i < (ArrayCollection(peopleList.dataProvider).length - 1) && peopleList.selectedItem)
{
IList(peopleList.dataProvider).addItemAt(peopleList.selectedItem,i + 2);
IList(peopleList.dataProvider).removeItemAt(i);
peopleList.selectedIndex = i; }
}
]]>
</mx:Script>
<mx:Array id="arrDP">
<mx:Object c="1" c1="One" />
<mx:Object c="2" c1="One" />
<mx:Object c="3" c1="One" />
</mx:Array>
<mx:VBox horizontalAlign="center" x="618" y="176" height="264">
<mx:DataGrid id="peopleList" dataProvider="{arrDP}" x="198" y="66" width="302">
</mx:DataGrid>
<mx:ControlBar width="298" horizontalAlign="right" height="26">
<mx:Button label="上移" click="moveUp(event)"/>
<mx:Button label="下移" click="moveDown(event)"/>
</mx:ControlBar>
</mx:VBox>
</mx:Application>
2、 ArrayCollection排序
<?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"
>
<s:layout>
<s:BasicLayout/>
</s:layout>
<fx:Script>
<![CDATA[
import flashx.textLayout.factory.TruncationOptions;
import mx.collections.ArrayCollection;
import mx.collections.Sort;
import mx.collections.SortField;
[Bindable]
private var ac:ArrayCollection = new ArrayCollection([{ID:0,userName:"AAA"},
{ID:1,userName:"CCC"},
{ID:2,userName:"BBB"}]);
public function init():void{
// ac.addItem(
// [{ID:0,userName:"AAA"},
// {ID:1,userName:"CCC"},
// {ID:2,userName:"BBB"}]
//// );
// ac = (
// [{ID:0,userName:"AAA"},
// {ID:1,userName:"CCC"},
// {ID:2,userName:"BBB"}]
// );
}
protected function button1_clickHandler(event:MouseEvent):void
{
var sort:Sort = new Sort();//定义sort对象
//选择排序的字段(默认是按升序排序的)
sort.fields = [new SortField("userName")];
//把Sort对象赋给ac
ac.sort = sort;
//如果按照降序排序,需要修改一下
//sort.fields = [new SortField("userName",true,true)];
//如果先降序(ID)后升序(userName),就这样写,以此类推
//sort.fields = [new SortField("userID",true,true),new SortField("userName")];
ac.refresh();
}
protected function button2_clickHandler(event:MouseEvent):void
{
var sort:Sort = new Sort();//定义sort对象
//选择排序的字段(默认是按升序排序的)
sort.fields = [new SortField("userName",true,true)];
//把Sort对象赋给ac
ac.sort = sort;
ac.refresh();
}
]]>
</fx:Script>
<fx:Declarations>
<!-- 将非可视元素(例如服务、值对象)放在此处 -->
</fx:Declarations>
<s:Button label="升序排序" click="button1_clickHandler(event)" fontSize="20" x="10" y="61"/>
<s:Button label="降序排序" click="button2_clickHandler(event)" fontSize="20" x="10" y="190"/>
<s:List x="288" y="99" dataProvider="{ac}" labelField="userName" >
</s:List>
</s:Application>
3、 将图片作为背景(非嵌入式)
NoBedImage
<?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:local="*"
width="90%" height="90%" viewSourceURL="srcview/index.html">
<s:Group width="100" height="100" horizontalCenter="0" y="10"><!--{widthSlider.value}-->
<local:TiledImage source="assets/appPlatform.png" width="100%" height="100%" />
<s:Label text="Tiled Background" fontSize="16" horizontalCenter="0" verticalCenter="0" fontWeight="bold" />
</s:Group>
<!--<s:HSlider id="widthSlider" value="200" minimum="150" maximum="300" horizontalCenter="0" y="125" />-->
</s:Application>
<?xml version="1.0" encoding="utf-8"?>
<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx">
<fx:Script>
<![CDATA[
import mx.controls.SWFLoader;
import flash.display.BitmapData;
import flash.display.Bitmap;
public function set source(value:Object):void {
loader.source = value;
}
private function updateSource():void {
// use a SWFLoader to download the bitmap data then push that into the BitmapImage
bitmapImage.source = loader.content;
}
]]>
</fx:Script>
<mx:SWFLoader id="loader" complete="updateSource()" width="0" height="0" />
<s:BitmapImage id="bitmapImage" width="100%" height="100%" fillMode="repeat" />
</s:Group>
4、 Datagrid根据条件改变行背景色
DataGridDrawRowBackground
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" fontSize="12" xmlns:local="*" width="400" height="300">
<mx:Script>
<![CDATA[
[Bindable]
private var _record:XML =
<list>
<user name="小明" result="60"> </user>
<user name="小红" result="59"> </user>
<user name="小白" result="75"> </user>
<user name="小黑" result="38"> </user>
<user name="小青" result="80"> </user>
<user name="小文" result="100"> </user>
<user name="小鬼" result="99"> </user>
<user name="小东" result="40"> </user>
</list>
]]>
</mx:Script>
<local:MyDataGrid dataProvider="{_record.user}" right="5" left="5" top="5" bottom="5">
<local:columns>
<mx:DataGridColumn headerText="姓名" dataField="@name"/>
<mx:DataGridColumn headerText="成绩" dataField="@result"/>
</local:columns>
</local:MyDataGrid>
</mx:Application>
MyDataGrid
<?xml version="1.0" encoding="utf-8"?>
<mx:DataGrid xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
override protected function drawRowBackground(s:Sprite, rowIndex:int, y:Number, height:Number, color:uint, dataIndex:int):void
{
var list:XMLList = new XMLList(dataProvider)
if(dataIndex < list.length() && list[dataIndex].@result <60)color = 0xFF6600
super.drawRowBackground(s,rowIndex,y,height,color,dataIndex);
}
]]>
</mx:Script>
</mx:DataGrid>
^_^ ^_^
import flash.display.Sprite;
import flashx.textLayout.events.ModelChange;
import mx.collections.ArrayCollection;
import mx.controls.DataGrid;
public class DatacenterDataGridRowColor extends DataGrid
{
public function DatacenterDataGridRowColor(){//this.setStyle("backgroundColor", 0xFF0000);
//this.setStyle("backgroundAlpha", 0.27);
}
override protected function drawRowBackground(s:Sprite, rowIndex:int, y:Number, height:Number, color:uint, dataIndex:int):void
{
if(dataProvider!=null && dataIndex<dataProvider.length){
var item:Object = dataProvider.getItemAt(rowIndex);
if( item.status == "禁用") color = 0xffeabc;
}
super.drawRowBackground(s, rowIndex, y, height, color, rowIndex);
}
}
附个人Cairngorm工程