flex DataGrid分页

<?xml version="1.0" encoding="utf-8"?>
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" width="400" height="300" >
    <mx:Script>
         <![CDATA[
         /**//*
             自定义datagrid控件元素
             总共的页数
             当前页面的页码
             所有的记录数
            当前也的记录
            没有翻页的记录
            
        */
            import mx.collections.ArrayCollection;
            import mx.controls.Alert;
            [Bindable]
            private var mypagedata:ArrayCollection = new ArrayCollection();//当前也没种该显示的记录
            [Bindable]
            public var mygridcolumns:Array;
            public var mydata:ArrayCollection;//所有的数据
            public var pagecount:int=10;//表示每页记录的条数,默认10条,可以由用户自行定义
            public var curpage:int;//当前的页码
            public var totalpage:int;//一共的页数
            public var totalcount:int;//一共的记录条数
            
            public function initdata(value:ArrayCollection):void
            {
                mydata = value;//将所有数据都赋值给mydata变量
                mypagedata.removeAll();//移出当前页面中所有数据记录
                
                if(mydata.length>0 && null!=mydata)
                {
                    totalcount = mydata.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>=totalpage) return;//value不能大于等于totalpage
                Alert.show(value+"页");
                curpage = value;
                var curNum:int = value*pagecount;//计算出要跳转到的页面种的第一条记录在所有的记录种是第几条记录
                mypagedata.removeAll();//移出变量中的数据,以便插入新数据,页面中显示的是这个变量中的数据
                for(var i:int=0;curNum<mydata.length&&i<pagecount;i++,curNum++)
                //循环的次数既要小于所有的记录数,也要小于每个页面能显示的记录数;并且curNum变量中的值也要增加
                {
                    mypagedata.addItem(mydata.getItemAt(curNum));//依次抽取记录
                }
                var temp:int = curpage+1;//页码中第一张页面是0,也就是说实际显示的页码是+1后的值
                pagedetail.text = "第"+temp+"页/共"+totalpage+"页   共条"+totalcount+"记录";
            }
        ]]>
    </mx:Script>
    
    <mx:DataGrid id="cudg" dataProvider="{mypagedata}"  
        columns="{mygridcolumns}" width="100%" height="100%">
    </mx:DataGrid>
    <mx:HBox width="100%" horizontalAlign="left" verticalAlign="middle">
        <mx:Spacer width="100%" height="1"></mx:Spacer>
        <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" cornerRadius="0" change="setPager(inputpage.value-1)" />
        <mx:LinkButton label="跳转" click="setPager(inputpage.value-1)"/>
    </mx:HBox>
</mx:VBox>
测试:TestPage.mxml
<?xml version="1.0" encoding="utf-8"?>
 <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:nsl="*"  creationComplete="init()">//此处声明导入Page组件即Page.mxml文件
     <mx:Script>
         <![CDATA[
             import mx.collections.ArrayCollection;
             public var items:ArrayCollection;
             private function init():void
             {
                items = new  ArrayCollection();
                for(var i:int =1;i<16;i++)
                {
                    var obj:Object = new Object();
                    obj.loginaccount = "andy";
                    obj.name = "Andy";
                    obj.loginaccount += i;
                    obj.name += i;
                   items.addItem(obj);
                }
                
                mydg.initdata(items);
            }
            
        ]]>
    </mx:Script>
        <mx:Panel id="panel1" title="MyDataGrid" x="255" y="52">
        <nsl:Page width="100%" height="100%" id="mydg" pagecount="5">
            <nsl:mygridcolumns>
                <mx:DataGridColumn headerText="登录名" dataField="loginaccount" width="200"/>
                <mx:DataGridColumn headerText="姓名" dataField="name" width="200"/>
            </nsl:mygridcolumns>
        </nsl:Page>
    </mx:Panel>
    
</mx:Application>
 
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值