我有一个datagrid,填充如下所示.当用户单击列标题时,我想使用词典排序对行进行排序,其中首先使用所选列,然后以从左到右的顺序使用其余列来打破任何关系.我该如何编码呢?
(我有一个答案,我将在下面发布,但它有一个问题 – 如果有人能提供更好的答案,我会很激动!)
这是布局:
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="onCreationComplete()"> <mx:Script source="GridCode.as" /> <mx:DataGrid id="theGrid" x="61" y="55" width="466" height="317"> <mx:columns> <mx:DataGridColumn dataField="A"/> <mx:DataGridColumn dataField="B"/> <mx:DataGridColumn dataField="C"/> </mx:columns> </mx:DataGrid> </mx:Application>
import mx.collections.ArrayCollection; import mx.collections.Sort; import mx.collections.SortField; import mx.controls.dataGridClasses.DataGridColumn; import mx.events.DataGridEvent; public function onCreationComplete():void { var ar:ArrayCollection = new ArrayCollection(); var ob:Object; for( var i:int=0; i<20; i++ ) { ob = new Object(); ob["A"] = i; ob["B"] = i%3; ob["C"] = i%5; ar.addItem(ob); } this.theGrid.dataProvider = ar; }
解决方法
到目前为止,我发现的最佳答案是在用户点击时捕获headerRelease事件:
<mx:DataGrid id="theGrid" x="61" y="55" width="466" height="317" headerRelease="onHeaderRelease(event)">
然后,事件处理程序可以对数据应用排序顺序:
private var lastIndex:int = -1; private var desc:Boolean = false; public function onHeaderRelease(evt:DataGridEvent):void { evt.preventDefault(); var srt:Sort = new Sort(); var fields:Array = new Array(); if( evt.columnIndex == lastIndex ) { desc = !desc; } else { desc = false; lastIndex = evt.columnIndex; } fields.push( new SortField( evt.dataField,false,desc ) ); if( evt.dataField != "A" ) fields.push( new SortField("A",desc) ); if( evt.dataField != "B" ) fields.push( new SortField("B",desc) ); if( evt.dataField != "C" ) fields.push( new SortField("C",desc) ); srt.fields = fields; var ar:ArrayCollection = this.theGrid.dataProvider as ArrayCollection; ar.sort = srt; ar.refresh(); }
然而,这种方法存在一个众所周知的问题,即列标题不再显示小箭头来显示排序方向.这是呼叫的副作用evt.preventDefault()但是您必须拨打该电话,否则您的自定义排序将不会应用.