Flex中使用datagrid的分頁技術

轉自：http://hi.baidu.com/nirvana140107/blog/item/8d8222008e17c80f1d958322.html

關于分頁技術可以說最常用的技術：

在java的經典的分頁技術中必須的參數有四個無論哪個分頁技術都是必須的：

目前頁數：pageNow

頁面記錄的數：pageSize

頁面總記錄數：totalResults

分頁資料資訊：Collection （目前頁面顯示的集合資料是總資料的一部分）

各種關系：

有四舍五入的數學算法可以知道任何一個浮點數加上0.5 取其整數部分可以得到他的四舍五入的資料：

同理如下

總的頁面數量： pageTotal=（totalResults+pageSize-1）/pageSize;

目前的頁面開始記錄： startResult=（pageNow-1）*pageSize；

目前的頁面結束記錄： endResult=pageNow*pageSize；

開始記錄和結束記錄查詢分頁顯示目前資料，頁面總數資料庫查詢

Y(^o^)Y，開始分析C/S分頁技術

大前提必須記住哦，O(∩_∩)O哈哈哈~

資料量不是很大的時候采用，但資料量相當大的時候最好采用Java經典分頁技術，提高客戶的相應效率。

由以上參數可以計算的資訊如下：

在CS開發中常用分頁中使用分頁技術：

目前頁數：pageNow

頁面記錄的數：pageSize

總的資料資訊：Collection （總資料）

總的記錄數：totalResults 從總資料量中得到即可

總的頁面數量： pageTotal=（totalResults+pageSize-1）/pageSize;

目前的頁面開始記錄： startResult=（pageNow-1）*pageSize；

目前的頁面結束記錄： endResult=pageNow*pageSize；

已知目前頁面開始記錄和結束記錄數擷取目前頁面的顯示的資料：（忽略）

Flex的分頁代碼如下：

<?xml version="1.0" encoding="utf-8"?>
<mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal" verticalAlign="middle" horizontalAlign="center"   creationComplete="initApp()">
<mx:Script>
   <![CDATA[
     import mx.controls.Alert;
      //每頁的記錄數
    public var pageSize:uint=8;
    //總的頁數
    public var totalPages:uint=0;
    //總的記錄數量
    public var totalRows:uint=0;
    //目前頁的記錄數
    public var pageNow:uint=1;
    //開始記錄的行
    public var pageStartRow:uint=1;
    //結束記錄的行
    public var pageEndRow:uint=1;
   
      //用于初始化的方法
    public function initApp():void
    {
     txt.text="Page "+pageNow;
     //計算總的記錄數
     totalRows=initDG.length;
     
     if(initDG.length>pageSize)
     {
         //從總的記錄中擷取部分記錄的方法同時并切換資料的

        dg.dataProvider=initDG.slice(0,pageSize);


        pPage.enabled=false;
     }
     //記錄總的記錄數量
     totalPages=Math.floor((totalRows+pageSize-1)/pageSize);
     
     if(totalRows<=pageSize)
     {
        this.pageStartRow=1;
        this.pageEndRow=totalRows;
     }else{
        this.pageStartRow=1;
        this.pageEndRow=pageSize;
     }
     
     if(totalPages==1)
     {
       pPage.enabled=false;
       nPage.enabled=false;
     }
    }
   
     //點選上一頁的處理
    public function showPreviousPage():void
    {
      pageNow=pageNow-1;
      txt.text="page "+pageNow;
      if(pageNow != 1)
      {
      pageStartRow=(pageNow-1)*pageSize+1;
        pageEndRow=pageNow*pageSize;
      }else{
      pageEndRow=pageSize;
                 pageStartRow=1;      
        pPage.enabled=false;
      }
      dg.dataProvider=initDG.slice(pageStartRow-1,pageEndRow);
    }
   
     public function showNextPage():void{
         pageNow = pageNow + 1;
         txt.text = "Page " + pageNow;
         if(pageNow == totalPages){
             pageEndRow = totalRows;
             pageStartRow =totalRows-pageSize;
             nPage.enabled = false;
             pPage.enabled = false;
         }else{
         pageStartRow = (pageNow - 1) * pageSize + 1;
             pageEndRow = pageNow * pageSize;
             nPage.enabled = true;
             pPage.enabled = true;
         }
         dg.dataProvider = initDG.slice((pageNow - 1) * pageSize,pageEndRow);
     }
     //首頁調用的方法
     public function showFirstPage():void{
         dg.dataProvider = initDG.slice(0,pageSize);
         pPage.enabled = false;
         nPage.enabled = true;
         txt.text = "Page " + 1;
          pageNow = 1;
     }
         //最後一頁調用的方法
      public function showLastPage():void{
           dg.dataProvider = initDG.slice((totalPages - 1) * pageSize,totalRows);
           pPage.enabled = true;
           nPage.enabled = false;
           txt.text = "Page " + totalPages;
           pageNow = totalPages;
      }
   ]]>
</mx:Script>

<mx:Panel title="DataGrid分頁應用" height="287" width="500">
   <mx:DataGrid id="dg" height="100%" width="100%">
    <mx:dataProvider >
     <mx:Array id="initDG">
                        <mx:Object PLAYER="Rafer Alston" POS="G" FROM="Fresno State"/>
                        <mx:Object PLAYER="Luther Head" POS="G" FROM="lllinois"/>
                        <mx:Object PLAYER="Tracy McGrady" POS="F-G" FROM="Mount Zion Christian Acad. HS (NC)"/>
                        <mx:Object PLAYER="Dikembe Mutombo" POS="C" FROM="Georgetown"/>
                        <mx:Object PLAYER="Stromile Swift" POS="F" FROM="Louisiana State"/>
                        <mx:Object PLAYER="David Wesley" POS="G" FROM="Baylor"/>
                        <mx:Object PLAYER="Yao Ming" POS="C" FROM="China"/>
                        <mx:Object PLAYER="Kobe Bryant" POS="G" FROM="Lower Merion HS (PA)"/>
                        <mx:Object PLAYER="Kwame Brown" POS="F-C" FROM="Glynn Academy HS (GA)"/>
                        <mx:Object PLAYER="Lamar Odom" POS="F" FROM="Rhode Island"/>
                        <mx:Object PLAYER="Andrew Bynum" POS="C" FROM="St. Joseph HS (NJ)"/>
                        <mx:Object PLAYER="Brian Cook" POS="F" FROM="Illinois"/>
                        <mx:Object PLAYER="Devean George" POS="F" FROM="Augsburg"/>
                        <mx:Object PLAYER="Devin Green" POS="G" FROM="Hampton"/>
                        <mx:Object PLAYER="Aaron McKie" POS="F" FROM="Temple"/>
                        <mx:Object PLAYER="Chris Mihm" POS="C" FROM="Texas"/>
                        <mx:Object PLAYER="Smush Parker" POS="G" FROM="Fordham"/>
                        <mx:Object PLAYER="Ronny Turiaf" POS="F" FROM="Gonzaga"/>
                        <mx:Object PLAYER="Sasha Vujacic" POS="F" FROM="Slovenia"/>
                        <mx:Object PLAYER="Von Wafer" POS="F" FROM="Florida State"/>
                        <mx:Object PLAYER="Luke Walton" POS="F" FROM="Arizona"/>
                        <mx:Object PLAYER="Lamar Odom" POS="F" FROM="Rhode Island"/>
                        <mx:Object PLAYER="Jim Jackson" POS="F-G" FROM="Ohio State"/>
                    </mx:Array>
   
    </mx:dataProvider>
      <mx:columns>
      <mx:DataGridColumn headerText="歌 手" dataField="PLAYER" textAlign="center"/>
      <mx:DataGridColumn headerText="方 式" dataField="POS" textAlign="center"/>
      <mx:DataGridColumn headerText="國 家" dataField="FROM" textAlign="center"/>
      </mx:columns>
   </mx:DataGrid>
  
   <mx:Spacer />
   <mx:HBox width="391">
    <mx:Spacer/>
    <mx:LinkBar borderStyle="solid" color="#000000" backgroundColor="#CCFFFF" id="fPage" label="firstPage" itemClick="showFirstPage()">
    <mx:dataProvider>
              <mx:Array>
                  <mx:String>firstPage</mx:String>
              </mx:Array>
          </mx:dataProvider>
   </mx:LinkBar>
   <mx:LinkBar borderStyle="solid" color="#000000" backgroundColor="#CCFFFF" id="pPage" label="prevPage" itemClick="showPreviousPage()">
    <mx:dataProvider>
              <mx:Array>
                  <mx:String>prePage</mx:String>
              </mx:Array>
          </mx:dataProvider>
   </mx:LinkBar>
   <mx:Text id="txt" width="52"/>
   <mx:LinkBar borderStyle="solid" color="#000000" backgroundColor="#CCFFFF" id="nPage" label="nextPage" itemClick="showNextPage()">
    <mx:dataProvider>
              <mx:Array>
                  <mx:String>nextPage</mx:String>
              </mx:Array>
          </mx:dataProvider>
   </mx:LinkBar>
   <mx:LinkBar borderStyle="solid" color="#000000" backgroundColor="#CCFFFF" id="lPage" label="lastPage" itemClick="showLastPage()">
            <mx:dataProvider>
              <mx:Array>
                  <mx:String>lastPage</mx:String>
              </mx:Array>
          </mx:dataProvider>
   </mx:LinkBar>
</mx:HBox>
<mx:Spacer />
</mx:Panel>
</mx:Panel>