Flex实例【Shangle.net】解析【七】

        前面的两个填坑基本上已经交代了如何使用外部的文件作为FLEX的数据源，至于如何来使用MSSQL之类的数据库那我想基本原理一样，请各位自己脑补并付诸实践，学习新的代码就是这么一个渐进过程。希望大家都能有成就感。以下我们继续来进行关于这个评论的功能完善，我想这个上面时间花的已经挺多的了，就来完善最后一个功能吧。最后一个功能就是评论分页。

        在原FLEX中，作者加了一些评论分页的元素，但具体的实现并没有，不管有多少条评论都是现实在一页上，下面的“1/1篇评论”和第几页的确定按钮都是面子工程，我们要说实话办实事。

        首先看下评论分页相关的几个全局变量：

[Bindable]
private var commentPageSize : int = 2; //分页显示的评论数
[Bindable]
private var maxDiary : int = 0; //总共的文章数
[Bindable]
private var currentDiary : int = 0; //当前是第几篇文章
[Bindable]
private var maxComment : int = 0; //总共评论页数
[Bindable]
private var currentComment : int = 0; //当前是第几页评论
[Bindable]
private var totalComment : int = 0; //总共的评论数
[Bindable]
private var maxCatalog : int = 0; //总共目录页数
[Bindable]
private var currentCatalog : int = 0; //当前是第几页目录
[Bindable]
private var totalCatalog : int = 0; //总共目录数
[Bindable]
private var catalogPageSize : int = 12; //分页显示的目录数

        在这里真正和评论相关的变量是这么几个：commentPageSize、maxComment、currentComment和totalComment。然后我们额外添加几个分页中间过程中需要用到的变量：

private var currentIndex:int=0; //当前页的当前评论索引
private var startIndex:int=0;   //当前页的起始评论索引
private var endIndex:int=0;     //当前页的终止评论索引
private var currentDataSource:XMLListCollection=null;   //当前页所使用到的子数据源，原来的全部数据源是dataSource

        首先我们来用文字描述下整个过程：

        1、我们设定每页现实的评论数；

        2、获取到全部的数据源中的评论条数；

        3、根据前面的两个数据得知总共的页数以及每页中显示的评论的开始和结束索引

        4、将全部的数据源中位于开始和结束索引之间的评论记录存放到子数据源中

        5、将该子数据源作为List控件的DataProvider

        6、收工

        其中第一步在全局中设置一次即可。第二到第五步需要出现在三个地方：初始化时、评论添加成功后、下面的跳转确定按钮点击后

        代码描述：

        1、private var commentPageSize : int = 2;     //为了调试方便，我们将每页显示的评论数减少点

        2-5、在xmlReadCompleteHandler事件中添加以下代码（这个xmlReadCopleteHandler事件别忘记是在哪里的，忘了自己找）：

totalComment=dataSource.list.length;                                       //获取总得评论数据量
maxComment=Math.ceil(totalComment/commentPageSize);                        //根据总量及每页数得到总的页数，这里用了个ceil函数来得到不小于结果的整数，自查
currentDataSource=new XMLListCollection();                                 //实例化一个新的XMLListCollection对象，用来存放子集
startIndex=(currentComment-1)*commentPageSize;                             //根据当前页码和每页评论数，得到该页起始索引
endIndex=currentComment*commentPageSize;                                   //同上，得到终止索引
for(currentIndex=startIndex;currentIndex<endIndex;currentIndex++)          //For循环，全部数据源中位于开始和结束索引之间的评论项添加到那个新的子集中
{
    if(currentIndex<totalComment)                                          //因为涉及到最后一页剩余的评论数可能小于每页的评论数，所以加上这个IF防止越界
    currentDataSource.addItem(dataSource.list.getItemAt(currentIndex));    //取出来，放进去
}
commentList.dataProvider=currentDataSource.list;                           //设定List控件的数据源为这个子集

        出了在xmlReadCompleteHandler这个事件中需要这些代码外，还需要在msgSendCompliteHandler事件中添加，因为这个事件是评论添加成功后重新设置数据源的过程，所以也需要更新下信息。

        最后还差一个事件，但是这个事件原本是没有的，需要我们先手动添加这个事件，添加过程很简单，在界面中找到右下角的页码选择框边的确定按钮，然后给它一个ID，我这里设定为lbtnGOTO，然后右击选择“生成CLICK事件”（当然不设ID也行，但是默认命名容易搞混掉，所以要养成先起名的好习惯）。然后就可以在生成的CLICK事件中加入上述代码了，其中略微有些改变，因为这里涉及到页码的改变，上代码：

protected function lbtnGOTO_clickHandler(event:MouseEvent):void
{
    currentComment=int(commentNumStp.textDisplay.text);   //改变的就这个地方，首先要获取到新的页码。
    startIndex=(currentComment-1)*commentPageSize;
    endIndex=currentComment*commentPageSize;
    currentDataSource=new XMLListCollection();
    for(currentIndex=startIndex;currentIndex<endIndex;currentIndex++)
    {
        if(currentIndex<totalComment)
            currentDataSource.addItem(dataSource.list.getItemAt(currentIndex));
    }
    commentList.dataProvider=currentDataSource.list;
}

        这样我们就完整实现了评论分页的过程。

        【待续】