여러 열에 따라 플렉스 데이터 그리드를 정렬하는 방법은 무엇입니까?
-
01-07-2019 - |
문제
아래와 같이 채워진 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", false, desc) );
if( evt.dataField != "B" )
fields.push( new SortField("B", false, desc) );
if( evt.dataField != "C" )
fields.push( new SortField("C", false, desc) );
srt.fields = fields;
var ar:ArrayCollection = this.theGrid.dataProvider as ArrayCollection;
ar.sort = srt;
ar.refresh();
}
그러나 이 접근 방식에는 잘 알려진 문제가 있습니다. 즉, 열 머리글에 정렬 방향을 표시하는 작은 화살표가 더 이상 표시되지 않는다는 것입니다.이것은 evt.preventDefault () 호출의 부작용이지만 해당 호출을해야합니다. 그렇지 않으면 사용자 정의가 적용되지 않습니다.
제휴하지 않습니다 StackOverflow