提到分頁大家應該都很熟悉了,幾乎所有的應用中都會用到。因而完成一個分頁組件在不同的應用中進行復用是必須的,剛寫完了一個flex分頁的組件,拿來分享一下。如果有什麼建議、問題歡迎大家提出。希望可以為flex的開發者們提供一個可靠的分頁組件。
package utils.page
{
import Flash.events.MouseEvent;
import mx.controls.Button;
import mx.controls.Label;
//分頁組件類
//作者:孫鏡濤
//日期:2010-01-12
//描述:本類主要負責對分頁相關的按鈕以及信息顯示的標簽進行管理;對數據顯示內容進行控制
public class PageComponent
{
//首頁按鈕
PRivate var firstButton:Button;
//下一頁按鈕
private var nextButton:Button;
//前一頁按鈕
private var previousButton:Button;
//最後頁按鈕
private var lastButton:Button;
//當前頁信息顯示
private var curPageInfoLbl:Label;
//所有頁信息顯示
private var totalPageInfoLbl:Label;
//當前頁改變時數據處理方法
private var handleDataFun:Function;
//分頁數據的處理類
private var page:PageUtils;
//first,next,previous,last:第一頁,下一頁,上一頁,最後頁的button
//curPageInfoLbl,totalPageInfoLbl:當前頁,所有頁信息顯示的label
//handleDataFun:分頁的頁碼改變後數據的處理函數,該函數符合的簽名為:(data:Array):void
//exeFun:查詢數據的sql,該函數的簽名為:(sql:String):Array
//pageNum:每頁顯示數據條數
public function PageComponent(first:Button,next:Button,previous:Button,last:Button,curPageInfoLbl:Label,
totalPageInfoLbl:Label,handleDataFun:Function,exeFun:Function,pageNum:int)
{
//分頁按鈕初始化
this.firstButton=first;
this.nextButton=next;
this.previousButton=previous;
this.lastButton=last;
//分頁信息顯示控件初始化
this.curPageInfoLbl=curPageInfoLbl;
this.totalPageInfoLbl=totalPageInfoLbl;
//頁面改變後數據處理函數
this.handleDataFun=handleDataFun;
//分頁數據類初始化
this.page=new PageUtils(exeFun,pageNum);
//為分頁按鈕增加相應的事件處理函數
this.firstButton.addEventListener(MouseEvent.CLICK,firstButtonClicked);
this.nextButton.addEventListener(MouseEvent.CLICK,nextButtonClicked);
this.previousButton.addEventListener(MouseEvent.CLICK,previousButtonClicked);
this.lastButton.addEventListener(MouseEvent.CLICK,lastButtonClicked);
}
//需要分頁查詢的的sql
public function initSql(sql:String):void
{
this.page.initSqlAndInitDataIfNecessary(sql);
setButtonStatus();
setLabelInfo();
this.handleDataFun(page.getPageData());
}
//分頁按鈕被點擊時的處理邏輯為:
//1.設置當前數據的頁數
//2.設置分頁控件按鈕的狀態
//3.設置分頁控件信息顯示label的內容
//4.查詢該頁數據並執行數據處理函數
//點擊第一頁時觸發的事件
public function firstButtonClicked(event:MouseEvent):void
{
page.setCurrentPage(1);
setButtonStatus();
setLabelInfo();
this.handleDataFun(page.getPageData());
}
//點擊下一頁時觸發的事件
public function nextButtonClicked(event:MouseEvent):void
{
if(page.getCurrentPage()<page.getPageCount())
{
page.setCurrentPage(page.getCurrentPage()+1);
}
setButtonStatus();
setLabelInfo();
this.handleDataFun(page.getPageData());
}
//點擊上一頁時觸發的事件
public function previousButtonClicked(event:MouseEvent):void
{
if(page.getCurrentPage()>1)
{
page.setCurrentPage(page.getCurrentPage()-1);
}
setButtonStatus();
setLabelInfo();
this.handleDataFun(page.getPageData());
}
//點擊最後頁時觸發的事件
public function lastButtonClicked(event:MouseEvent):void
{
page.setCurrentPage(page.getPageCount());
setButtonStatus();
setLabelInfo();
this.handleDataFun(page.getPageData());
}
//設置所有分頁按鈕的狀態為不可用
private function setAllButtonStatusDisabled():void
{
this.firstButton.enabled=false;
this.previousButton.enabled=false;
this.nextButton.enabled=false;
this.lastButton.enabled=false;
}
//設置分頁按鈕的狀態
//步驟為:
// 1.首先設置所有分頁按鈕的狀態為不可用
// 2.判斷是否需要啟用某些分頁按鈕(僅當查詢有數據並且數據頁數大於一的時候才有必要)
// 2.1如果需要啟用某些按鈕分為三種情況:
// 2.1.1位於第一頁那麼下一頁和最後頁的按鈕可用
// 2.1.2位於中間頁那麼所有按鈕可用
// 2.1.3位於最後也那麼上一頁和第一頁的按鈕可用
private function setButtonStatus():void
{
setAllButtonStatusDisabled();
if(page.getTotalCount()>0&&page.getPageCount()>1)
{
if(page.getCurrentPage()==1)
{
this.nextButton.enabled=true;
this.lastButton.enabled=true;
}
else if(page.getCurrentPage()<page.getPageCount()&&page.getCurrentPage()>1)
{
this.nextButton.enabled=true;
this.firstButton.enabled=true;
this.previousButton.enabled=true;
this.lastButton.enabled=true;
}
else if(page.getCurrentPage()==page.getPageCount())
{
this.firstButton.enabled=true;
this.previousButton.enabled=true;
}
}
}
//設置查詢結果分頁信息的label內容
private function setLabelInfo():void
{
this.totalPageInfoLbl.text="共"+page.getPageCount()+"頁";
this.curPageInfoLbl.text="當前第"+page.getCurrentPage()+"頁";
}
}
}
package utils.page
{
import entity.ConsumptionRecord;
//分頁數據組件類
//作者:孫鏡濤
//日期:2010-01-12
//描述:本類主要負責對分頁數據的狀態進行控制,以及進行查詢數據
public class PageUtils
{
//查詢數據的函數
private var exeFun:Function;
//分頁查詢的sql
private var sql:String;
//每頁顯示的記錄條數
private var pageNumber:int=0;
//當前查詢的記錄總數
private var totalCount:int=0;
//當前所處的頁數
private var currentPage:int=0;
//當前查詢的記錄總頁數
private var totalPage:int=0;
public function getPageCount():int
{
return this.totalPage;
}
public function getTotalCount():int
{
return this.totalCount;
}
public function getCurrentPage():int
{
return this.currentPage;
}
public function setCurrentPage(pageNum:int):void
{
this.currentPage=pageNum;
}
//構造函數, exeFun為查詢數據的函數,簽名需要符合:(sql:String):Array
// pageNum為每頁顯示記錄數,默認為10
public function PageUtils(exeFun:Function,pageNum:int=10)
{
this.exeFun=exeFun;
this.pageNumber=pageNum;
}
//初始化查詢sql,如果必要那麼進行分頁數據的初始化
//具體步驟為:
// 1.如果本次查詢和上次查詢的sql不一樣,那麼進行分頁數據初始化
// 2.構造查詢記錄總數的sql
// 3.根據查詢記錄總數的結果初始化本類的相關變量,如果沒有返回結果那麼使用默認值:0
public function initSqlAndInitDataIfNecessary(sql:String):void
{
if(this.sql!=sql)
{
this.sql=sql;
var countSql:String="SELECT COUNT(*) COUNT_NUMBER "+sql.substring(sql.indexOf("FROM"));
var data:Array=exeFun(countSql);
if(data!=null)
{
//設置總條數
this.totalCount=data[0].COUNT_NUMBER;
//設置總頁數
this.totalPage=this.totalCount%this.pageNumber==0?this.totalCount/this.pageNumber:this.totalCount/this.pageNumber+1;
//設置當前頁
this.currentPage=1;
}
}
}
//獲取分頁數據的方法
public function getPageData():Array
{
var tempSql:String=this.sql+getLimitOffsetSuffix(this.pageNumber,(this.currentPage-1)*this.pageNumber);
return exeFun(tempSql);
}
//為查詢sql增加分頁條件
private function getLimitOffsetSuffix(limit:int,offset:int):String
{
return " LIMIT "+limit+" OFFSET "+offset;
}
}
}
使用該代碼你需要做什麼:
//處理分頁數據的方法
private function bindDataToGrid(data:Array):void
{
//將數據綁定到DataGrid上
dataGrid.dataProvider=data;
}
//執行數據查詢的方法
public static function execute(sql:String):Array
{
sqlStatement.text=sql;
sqlStatement.execute();
return sqlStatement.getResult().data;
}
//查詢條件改變時執行的方法
private function searchConditionChanged():void
{
//初始化分頁組件
var pageComponent:PageComponent=new
PageComponent(firstBtn,nextBtn,previousBtn,lastBtn,lblCurrentPage,lblTotalPage,bindDataToGrid,execute,20);
var sql:String=”select name id from users”;
//初始化查詢sql
pageComponent.initSql(sql);
}