<?xml version="1.0" encoding="utf-8"?>
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" width="400" height="300" xmlns:mydg="*">
<mx:Script>
<![CDATA[
/*
自定义datagrid控件元素
总共的页数
当前页面的页码
所有的记录数
当前也的记录
没有翻页的记录
*/
import mx.collections.ArrayCollection;
[Bindable]
private var mypagedata:ArrayCollection = new ArrayCollection();//当前也没种该显示的记录
[Bindable]
public var mygridcolumns:Array;
public var mydata:ArrayCollection;//所有的数据
public var pagecount:int=20;//表示每页记录的条数,默认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;
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:LinkButton label="全选"/>
<mx:LinkButton label="全不选"/>-->
<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"/>
<mx:LinkButton label="跳转" click="setPager(inputpage.value-1)"/>
</mx:HBox>
</mx:VBox>
******************************************************************************
<nsl:customgrid x="10" y="34" fontSize="12" id="mydatagrid1" height="536" width="30%" color="#0B333C">
<nsl:mygridcolumns>
<mx:DataGridColumn headerText="名次" dataField="rank" backgroundColor="haloSilver"/>
<mx:DataGridColumn headerText="用户id" dataField="userid" backgroundColor="white"/>
<mx:DataGridColumn headerText="姓名" dataField="name" backgroundColor="white"/>
<mx:DataGridColumn headerText="经验总数" dataField="allexperience" backgroundColor="haloSilver"/>
</nsl:mygridcolumns>
</nsl:customgrid >
使用方法
<PageSelector id="pageSelector"
numPagesToDisplay="5" <!--当前界面一次显示几页-->
pageSelected="kmfspx(kmfstaxis)" <!---->
borderStyle="none"
showZero="0" <!--是否显示0 及如果有100页 第一页显示为 001 -->
MaxRows="1212" <!--拥有的记录数-->
SimplePageRows="20" <!--多少条记录是一页-->
/>
查询时要用到的变量有
as 文件中 pageSelector.Startrow 当前选择页对应的数据库开始记录
pageSelector.Endrow 当前选择页对应的数据库结束记录
PageSelector.mxml 文件内容
<?xml version="1.0" encoding="utf-8"?>
<!--
-->
<mx:HBox xmlns:mx="http://www.macromedia.com/2003/mxml" visible="{totalPages > 0}" horizontalGap="-1" >
<mx:Script>
<![CDATA[
private var __currentPage : Number = 1;
private var __totalPages : Number = 0;
private var repeaterStartIndex : Number = 0;
private var pageStringLength : Number;
private var currentButton : mx.controls.Link;
public var __showZero:Number=0;
private var __MaxRows: Number =0;//得到的总行数
private var __SimplePageRows: Number;//单页要有的行数
//通过页数计算开始记录数
function get Startrow():Number
{
return (((currentPage-1)*SimplePageRows)+1);
}
//返回当前页的结束记录数
function get Endrow():Number
{
var re:Number=0;
if (currentPage != totalPages)
{
re = currentPage*SimplePageRows;
}
else if (currentPage == totalPages)
{
re =MaxRows;
}
return re;
}
[ChangeEvent("MaxRowsChanged")]
function get showZero() : Number
{
return __showZero;
}
function set showZero(tp : Number) : Void
{
__showZero=tp;
mathcountpage();
}
[ChangeEvent("MaxRowsChanged")]
function get MaxRows() : Number
{
return __MaxRows;
}
function set MaxRows(tp : Number) : Void
{
__MaxRows=tp;
mathcountpage();
}
[ChangeEvent("SimplePageRowsChanged")]
function get SimplePageRows() : Number
{
return __SimplePageRows;
}
function set SimplePageRows(tp : Number) : Void
{
__SimplePageRows=tp;
mathcountpage();
}
function mathcountpage()
{
var a:Number = __MaxRows ;
var b:Number = __SimplePageRows;
totalPages =(a -(a%b))/b +(((a%b)>0)?1:0);
}
[ChangeEvent("pageArrayChanged")]
private var pageArray : Array;
public var numPagesToDisplay : Number;
[ChangeEvent("pageSelected")]
function get currentPage() : Number
{
return __currentPage;
}
function set currentPage(cp : Number) : Void
{
__currentPage = cp;
dispatchEvent({type: 'pageSelected'});
}
[ChangeEvent("totalPagesChanged")]
function get totalPages() : Number
{
return __totalPages;
}
function set totalPages(tp : Number) : Void
{
__totalPages = tp;
if (pageArray == null) pageArray = new Array();
if (tp > pageArray.length)
{
for (var i = pageArray.length+1; i <= tp; ++i)
{
pageArray.push(i);
}
}
else if (tp < pageArray.length)
{
pageArray.splice(tp);
}
pageStringLength = String(tp).length;
dispatchEvent({type: 'totalPagesChanged'});
dispatchEvent({type: 'pageArrayChanged'});
}
private function moveToBeginning()
{
repeaterStartIndex = 0;
updateCurrentButton(undefined);
}
private function moveToEnd()
{
var mod = totalPages % numPagesToDisplay;
if (mod == 0) mod = numPagesToDisplay;
repeaterStartIndex = totalPages - mod;
updateCurrentButton(undefined);
}
private function previousPageGroup()
{
if (repeaterStartIndex - numPagesToDisplay >= 0)
{
updateCurrentButton(undefined);
repeaterStartIndex -= numPagesToDisplay;
}
}
private function nextPageGroup()
{
if (repeaterStartIndex + numPagesToDisplay < totalPages)
{
updateCurrentButton(undefined);
repeaterStartIndex += numPagesToDisplay;
}
}
private function selectPage(page) : Void
{
currentPage = page.getRepeaterItem();
updateCurrentButton(page);
}
function updateCurrentPage(newCurrentPage : Number) : Void
{
var butIndex = newCurrentPage % numPagesToDisplay;
repeaterStartIndex = newCurrentPage - butIndex;
selectPage(pageButton[butIndex]);
}
private function updateCurrentButton(cb : mx.controls.Link) : Void
{
if (currentButton != undefined)
{
currentButton.setStyle("color", undefined);
}
if (cb != undefined)
{
cb.setStyle("color", 0xAA0000);
}
currentButton = cb;
}
private function formatPageNumber(num : Number) : String
{
var str : String = String(num);
var diff : Number = pageStringLength - str.length;
if (showZero==1)
switch(diff)
{
case 0 : return str;
case 1 : return "0" + str;
case 2 : return "00" + str;
case 3 : return "000" + str;
case 4 : return "0000" + str;
case 5 : return "00000" + str;
default : return str; //don't worry about it
}
else
{
return str;
}
}
]]>
</mx:Script>
<mx:Metadata>
[Event("pageSelected")]
</mx:Metadata>
<mx:Link id="beginningButton" icon="@Embed('left2.jpg')" height="22" click="moveToBeginning()" enabled="{repeaterStartIndex > 0}"/>
<mx:Link id="prevPageButton" icon="@Embed('left.jpg')" height="22" click="previousPageGroup()" enabled="{repeaterStartIndex > 0}"/>
<mx:Repeater id="pageRepeater" dataProvider="{pageArray}" recycleChildren="true"
startingIndex="{repeaterStartIndex}" count="{numPagesToDisplay}">
<mx:Link id="pageButton" label="{formatPageNumber(pageRepeater.currentItem)}" click="selectPage(event.target)" />
</mx:Repeater>
<mx:Link id="nextPageButton" icon="@Embed('right.jpg')" height="22" click="nextPageGroup()" enabled="{repeaterStartIndex + numPagesToDisplay < totalPages}"/>
<mx:Link id="endButton" icon="@Embed('right2.jpg')" height="22" click="moveToEnd()" enabled="{repeaterStartIndex + numPagesToDisplay < totalPages}"/>
</mx:HBox>
---------------------
发一个flex分页控件的源码
参照airia.cn上面的代码，自己重写了这个分页控件，代码呈上，不足之处请指正。
1）、定义一个“页面改变事件”
package
{
import flash.events.Event;
public class PageChangeEvent extends Event
{
private var _pageIndex:int;
private var _pageSize:int;
public static const CHANGED:String="PageChange";
public function PageChangeEvent(type:String,pageIndex:int,pageSize:int)
{
super(type);
_pageIndex=pageIndex;
_pageSize=pageSize;
}
public function fitler(rs:Array):Array
{
//这个方法依据构造此“事件类”时的参数过滤出当前页面要显示的记录，返回一个数组
var newRs:Array=new Array();
var start:int=_pageIndex*_pageSize;
var end:int=start+_pageSize;
for(var i:int=start;i<end;i++)
{
if(i<rs.length)
{
newRs.push(rs[i]);
}
else
{
break;
}
}
return newRs;
}
}
}
2）、定义一个分页的组件
<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="506" height="46">
<mx:Metadata>
[Event(name="PageChange",type="PageChangeEvent",bubbles="true",cancelable="true" )]
</mx:Metadata>
<mx:HBox width="100%" height="100%" x="0" y="0" horizontalAlign="center" verticalAlign="middle" fontSize="15">
<mx:Button click="firstPage()" id="firstBtn" label="首页"/>
<mx:Button click="prevPage()" id="prevBtn" label="上一页"/>
<mx:ComboBox id="cb" change="cbChange()" width="68"/>
<mx:Button click="nextPage()" id="nextBtn" label="下一页"/>
<mx:Button click="lastPage()" id="lastBtn" label="末页"/>
<mx:Label id="pageInfo" width="123"/>
</mx:HBox>
<mx:Script>
<![CDATA[
//总记录数
private var mRecordCount:int=0;
//每页要显示的记录数，默认为20
private var mPageSize:int =20;
//起始页的索引
private var mPageIndex:int =0;
//总页数
private var mPageCount:int = 0;
public function prevPage():void
{
mPageIndex-=1;
setState();
}
public function firstPage():void
{
mPageIndex =0;
setState();
}
public function nextPage():void
{
mPageIndex+=1;
setState();
}
public function lastPage():void
{
mPageIndex=mPageCount-1;
setState();
}
//以上几个方法一样，就不说了
public function cbChange():void
{
//依据下拉列表来获得当前的页索引值
mPageIndex = cb.selectedItem.data;
setState();
}
//设置记录总数
public function set RecordCount(value:int):void
{
//设置记录的总数
if(value<0)
{
value=0;
}
mRecordCount= value;
setState();
}
public function set pageSize(value:int):void
{
if(value>mRecordCount)
{
value=mRecordCount;
}
if(value<1)
{
value=1;
}
mPageSize=value;
setState()
}
private function setState():void
{
if(mRecordCount%mPageSize > 0)
{
//“求模”算出一共有多少页
mPageCount = mRecordCount/mPageSize+1;
}
else
{
mPageCount = mRecordCount/mPageSize;
}
//建一个数组做为combobox的数据源，用来跳转页
var pages:Array = new Array();
for(var i:int=1;i<=mPageCount;i++)
{
pages.push({label:i.toString(),data:i-1});
}
cb.dataProvider= pages;
cb.selectedIndex= mPageIndex;
if(mPageCount>1)
{
firstBtn.enabled=true;
nextBtn.enabled=true;
prevBtn.enabled=true;
lastBtn.enabled=true;
if(mPageIndex==0)
{
prevBtn.enabled=false;
firstBtn.enabled=false;
}
if(mPageIndex == mPageCount-1)
{
nextBtn.enabled=false;
lastBtn.enabled=false;
}
}
else
{
firstBtn.enabled=false;
nextBtn.enabled=false;
prevBtn.enabled=false;
lastBtn.enabled=false;
}
pageInfo.text=mRecordCount+"记录/" + mPageCount+"页";
OnPageChange();
}
//打开分页控件
public function Open():void{
mPageIndex =0;
OnPageChange();
}
private function OnPageChange():void
{
//依据当前页面索引和每页记录数来构造一个“页面改变事件”
var e:PageChangeEvent = new PageChangeEvent(PageChangeEvent.CHANGED,mPageIndex,mPageSize);
dispatchEvent(e);
}
]]>
</mx:Script>
</mx:Canvas>
3）、测试用的主类
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" initialize="oninit()" layout="absolute" xmlns:ns1="myCompments.*" fontSize="16">
<mx:Script>
<![CDATA[
import flash.events.Event;
private var newsList:Array;
private function oninit():void
{
newsList=new Array();
for(var i:int=0;i<1111;i++)
{
newsList.push({userName:"myName"+i,userData:i});
}
//设定要分页的总记录数
myPageBar.RecordCount=newsList.length;
//设定每页要显示的记录数
myPageBar.pageSize=50;
//启用分页控件
myPageBar.Open();
}
private function pageChanged(e:PageChangeEvent):void
{
dataList.dataProvider=e.fitler(newsList);
}
]]>
</mx:Script>
<mx:DataGrid x="54" y="44" width="543" height="227" id="dataList">
<mx:columns>
<mx:DataGridColumn headerText="用户名" dataField="userName"/>
<mx:DataGridColumn headerText="数据" dataField="userData"/>
</mx:columns>
</mx:DataGrid>
<ns1:PageBar x="54" y="279" width="543" id="myPageBar" PageChange="pageChanged(event)">
</ns1:PageBar>
</mx:Application>
--------------------------------------------------------------------
62
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
