Flex 翻頁組件

組件內容：

<?xml version="1.0" encoding="utf-8"?> 
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" initialize="initData(dataProvider);"> 

<mx:Script> 
<![CDATA[ 
import mx.collections.ArrayCollection; 
// 當前需要顯示的記錄 
[Bindable] 
private var mypagedata:ArrayCollection = new ArrayCollection(); 
[Bindable] 
public var columns:Array; // 數據集合 
public var dataProvider:ArrayCollection; // 所有數據 
public var pageCount:int = 6;// 每頁包含的記錄數，默認6條 
public var curPage:int; // 當前頁碼 
public var totalPage:int; // 總頁數 
public var totalCount:int; // 總記錄條數 
public function initData(value:ArrayCollection):void 
{ 
// 將所有的數據都賦值給 dataProvider 變量 
dataProvider = value; 
// 移除當前頁面中所有數據記錄 
mypagedata.removeAll(); 
if(null != dataProvider && dataProvider.length > 0) 
{ 
totalCount = dataProvider.length; 
totalPage = (totalCount + pageCount -1)/pageCount; 
setPager(0); 
inputpage.minimum=1; 
inputpage.maximum= totalPage; 
} 
else 
{ 
totalCount = 0; 
totalPage = 0; 
curPage = 0; 
inputpage.minimum=0; 
inputpage.maximum= 0; 
pagedetail.text = "第 0 頁/共 0 頁 共 0 條記錄"; 
} 
} 
public function setPager(value:int):void 
{ 
if(value <0 || (value+1)>totalPage) 
{ 
return; 
} 
curPage = value; 
// 計算跳轉到頁面中的第一條記錄所在記錄中是第幾條記錄 
var curNum : int = value*pageCount; 
// 清空當前顯示的數據記錄 
mypagedata.removeAll(); 
for(var i:int = 0; curNum<dataProvider.length&&i<pageCount; i++,curNum++) 
{ 
mypagedata.addItem(dataProvider.getItemAt(curNum)); 
} 
var temp:int=curPage+1; 
pagedetail.text = "第 "+temp+" 頁/共 "+totalPage+" 頁 共 "+totalCount+" 條記錄"; 
cudg.dataProvider = mypagedata; 
} 
]]> 
</mx:Script> 
<mx:DataGrid id="cudg" columns="{columns}" width="100%" height="100%" /> 
<mx:HBox verticalAlign="middle" horizontalAlign="center"> 
<mx:Label text="第 0 頁/共 0 頁" id="pagedetail" /> 
<mx:LinkButton label="首頁" click="setPager(0);" /> 
<mx:LinkButton label="上一頁" click="setPager(curPage - 1);" /> 
<mx:LinkButton label="下一頁" click="setPager(curPage + 1);" /> 
<mx:LinkButton label="末頁" click="setPager(totalPage - 1);" /> 
<mx:NumericStepper id="inputpage" stepSize="1" minimum="0" maximum="0" /> 
<mx:LinkButton label="跳轉" click="setPager(inputpage.value - 1);" /> 
</mx:HBox> 
</mx:VBox> 

引用：

<?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" xmlns:ns1="*" creationComplete="application1_creationCompleteHandler(event)"> 
<fx:Declarations> 
<!-- 將非可視元素（例如服務、值對象）放在此處 --> 
</fx:Declarations> 

<fx:Script> 
<![CDATA[ 
import mx.collections.ArrayCollection; 
import mx.controls.dataGridClasses.DataGridColumn; 
import mx.events.FlexEvent; 
protected function application1_creationCompleteHandler(event:FlexEvent):void 
{ 
var aaa:ArrayCollection=new ArrayCollection([ 
{"label":"1","data":"456"}, 
{"label":"2","data":"456"}, 
{"label":"3","data":"456"}, 
{"label":"4","data":"456"}, 
{"label":"5","data":"456"}, 
{"label":"6","data":"456"}, 
{"label":"7","data":"456"}, 
{"label":"8","data":"456"} 
]); 

var col1:DataGridColumn=new DataGridColumn(); 
col1.dataField="label"; 
col1.headerText="A"; 

var col2:DataGridColumn=new DataGridColumn(); 
col2.dataField="data"; 
col2.headerText="B"; 

var cols:Array =new Array(); 
cols.push(col1); 
cols.push(col2); 

myddd.columns=cols; 
myddd.initData(aaa); 
} 
]]> 
</fx:Script> 
<ns1:maygrid x="197" y="294" id="myddd"> 
</ns1:maygrid> 

</s:Application>