龙盟编程博客 | 无障碍搜索 | 云盘搜索神器
快速搜索
主页 > web编程 > asp.net编程 >

使用Flex开发DataGrid分页控件应用支持客户端及服务端(附源码)(2)

时间:2009-12-21 11:47来源:未知 作者:admin 点击:
分享到:
代码说明 (1)分页功能条,做一个自定义组件,布局如下: Code [http://www.xueit.com] 1 mx:HBox paddingTop ="8" 2 mx:Button id ="firstNavBtn" icon ="{firstIcon}" width ="10" hei

代码说明

(1)分页功能条,做一个自定义组件,布局如下:

Code [http://www.xueit.com]
 1     <mx:HBox paddingTop="8">
 2         <mx:Button id="firstNavBtn" icon="{firstIcon}" width="10" height="10" click="navigateButtonClick('firstPage');" />
 3         <mx:Button id="preNavBtn" icon="{preIcon}" width="7" height="10" click="navigateButtonClick('prePage');"/>
 4     </mx:HBox>
 5     <mx:LinkBar id="pageNav" itemClick="navigatePage(event)" dataProvider="{nav}"/>
 6     <mx:HBox paddingTop="8">
 7         <mx:Button id="nextNavBtn" icon="{nextIcon}" width="7" height="10" click="navigateButtonClick('nextPage');"/>
 8         <mx:Button id="lastNavBtn" icon="{lastIcon}" width="10" height="10" click="navigateButtonClick('lastPage');"/>
 9     </mx:HBox>
10     <mx:VRule height="25"/>
11     <mx:Label paddingTop="3" id="totalPagesLabel" text=""/>
12     <mx:Label paddingTop="3" id="totalRecordLabel" text=""/>
13     <mx:Label paddingTop="3" text="每页记录:"/>
14     <mx:ComboBox id="pageSizeComobox" cornerRadius="0" paddingLeft="0" fontWeight="normal" width="50" arrowButtonWidth="10" change="pageSizeSelectChange()"/>
15     <mx:Label paddingTop="3" text="页码:"/>
16     <mx:TextInput id="pageNumber" width="40" keyDown="pageIndexInsertChange(event);"/>
17     <mx:LinkButton id="viewAllLinkBtn" label="查看所有" click="viewAll();"/>

(2)页码条绘制方法,传参数为页码中的第一个页码

Code [http://www.xueit.com]
1                   /**
 2                     * 构建页码条
 3                       * pages:总页数
 4                       * pageIndex:当前页(注意,从0开始)
 5                       *
 6                    */
 7                   private function createNavBar(pageIndex:uint = 0):void{
 8                       nav.removeAll();
 9                       //向前图标操作,first,Pre
10                       if( pageIndex > 1 ){
11                             firstPage=0;
12                             firstNavBtn.visible=true;
13                             //
14                             var intLFive:int = pageIndex-navSize; // calculate start of last 5;
15                             //
16                             prePage=intLFive;
17                             preNavBtn.visible=true;
18                       }
19                       else{
20                             firstNavBtn.visible=false;
21                             preNavBtn.visible=false;
22                       }
23                       //页码条        
24                       for( var x:uint = 0; x < navSize; x  ){
25                             var pg:uint = x   pageIndex;
26                             nav.addItem({label: pg   1,data: pg});
27                             //    
28                             var pgg:uint = pg 1;
29                             if(pgg>=totalPages){ //搜索到最后一个页码,停止添加到navbar
30                                 x=navSize; 
31                             }
32                       }
33                       //计算最后一组页码条中第一个页码的页码编号
34                       var lastpage:Number = 0;
35                       for( var y:uint = navSize; y <= totalPages-1;y = y   navSize ){ //lets calculate the lastpage button
36                               if(y 5 > navSize){
37                                   lastpage = y;
38                               }
39                       }                      
40                       //向后图标
41                       if( pg < totalPages - 1 ){
42                             nextPage=pg   1;
43                             nextNavBtn.visible=true;
44                             lastPage=lastpage;
45                               lastNavBtn.visible=true;
46                       }
47                       else{                              
48                               nextNavBtn.visible=false;
49                               lastNavBtn.visible=false;
50                       }
51                   }


精彩图集

赞助商链接