数据分页功能在WEB应用非常广泛，虽然Flex基于Win的显示方式似乎没有必要，但实现应用中还是非常有用的。由于Flex的数据往往由其网络服务提供（如：WebService等），大量的数据传输和表现会影响Flex的性能；这个时候就可能通过数据分页的方法来获取当前显示数据，即能降低网络传的负担同时也能减少Flex的处理工作。

首先分页控件需要的功能有：首页，上一页，下一页，未页和页数跳转等。

控件使用用例图

定义分页控件的事件：PageChange

相关事件参数对象：

定义分页控件的事件：PageChange

相关事件参数对象：

package

{

       import flash.events.Event;

       import mx.events.IndexChangedEvent;

      

       public class PageChangeEvent extends flash.events.Event

       {

              public function PageChangeEvent(pageindex:int,pagesize:int)

              {

                     super("PageChange");

                     PageIndex= pageindex;

                     PageSize =pagesize;

              }

              public var PageIndex:int=0;

              public var PageSize:int=0;

              public function Filter(list:Array):Array

              {

                     var newlist:Array = new Array();

                     var start:int = PageSize*PageIndex;

                     var end:int = start+PageSize;

                     for(var i:int = start;i<end;i++)

                     {

                            if(i< list.length)

                            {

                                   newlist.push(list[i]);

                            }

                            else

                                   break;

                     }

                     return newlist;

              }

       }

}

下面是具体分页控件的代码：

<?xml version="1.0" encoding="utf-8"?>

<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="466" height="40">

<mx:Metadata>

 

    [Event(name="PageChange", type="PageChangeEvent",bubbles="true",cancelable="true")]

 

</mx:Metadata>

 

       <mx:Button click="method_le()"  id="c_le" enabled="false" x="10" y="10" fontFamily="Georgia" width="24" height="24" minWidth="24" minHeight="24">

              <mx:icon>@Embed(LE.gif)</mx:icon>

       </mx:Button>

       <mx:Button click="method_l()" id="c_l" enabled="false" x="42" y="10" fontFamily="Georgia" width="24" height="24" minWidth="24" minHeight="24">

              <mx:icon>@Embed(L.gif)</mx:icon>

       </mx:Button>

       <mx:ComboBox
rowCount="10" change="method_select()" id="c_select" enabled="false"
x="74" y="10" width="54"></mx:ComboBox>

       <mx:Button click="method_r()" id="c_r" enabled="false" x="136" y="10" fontFamily="Georgia" width="24" height="24" minWidth="24" minHeight="24">

              <mx:icon>@Embed(R.gif)</mx:icon>

       </mx:Button>

       <mx:Button click="method_re()" id="c_re" enabled="false" x="168" y="10" fontFamily="Georgia" width="24" height="24" minWidth="24" minHeight="24">

              <mx:icon>@Embed(RE.gif)</mx:icon>

       </mx:Button>

       <mx:Script>

              <![CDATA[

                     import mx.controls.Alert;

                     private var mRecordCount:int=0;

                     private var mPageSize:int =20;

                     private var mPageIndex:int =0;

                     private var mPageCount:int = 0;

                    

                     public function method_l():void

                     {

                            mPageIndex=mPageIndex-1;

                            SetState();

                            OnPageChange();

                     }

                     public function method_le():void

                     {

                            mPageIndex =0;

                            SetState();

                            OnPageChange();

                     }

                     public function method_r():void

                     {

                            mPageIndex=mPageIndex+1;

                            SetState();

                            OnPageChange();

                     }

                     public function method_re():void

                     {

                            mPageIndex=mPageCount-1;

                            SetState();

                            OnPageChange();

                     }

                     public function method_select():void

                     {

                            mPageIndex = c_select.selectedItem.data;

                            SetState();

                            OnPageChange();

                     }

                     public function get PageIndex():int

                     {

                            return mPageIndex;

                     }