0. 为外层容器的creationComplete指定获取数据的方法
?
???????? creationComplete="getInfo (1)"//1是当前页
?
1. 获取数据的方法
<fx:Script>
??? ??? <![CDATA[
?
??????????? import com.adobe.cairngorm.CairngormUtil;
??? ??? ??? import fx.model.ModelConfig;
??? ??? ??? import mx.collections.ArrayCollection;
??? ??? ??? import mx.controls.Alert;
??? ??? ???
??? ??? ??? private var selectedPaperids:ArrayCollection = new ArrayCollection();
??? ??? ??? //ModelConfig存储全局配置信息,getOne()以单例的方式返回一个对象注意ModelConfig要声明[Bindable]
?
??? ??? ??? [Bindable]
??? ??? ??? public var model:ModelConfig=ModelConfig.getOne();
?
?????????? /**
??? ??? ??? ?* 页面初始化函数
??? ??? ??? ?* 设置查询条件值
??? ??? ??? ?* 设置pagingbar
??? ??? ??? ?**/
??? ??? ??? public function getInfo (page:int):void{
??? ??? ??? ??? //参数处理:包括查询约束条件、分页信息
??? ??? ??? ??? var params:Object={paperName:paperName.text
??? ??? ??? ??? ???,source:source.text
??? ??? ??? ??? ???,currentPage:page
??? ??? ??? ??? ???,pageSize:10
??? ??? ??? ??? ???,pageNumShow:10
??? ??? ??? ??? ???,eventName:"TestCD"
??? ??? ??? ??? ???,pagingbar:pagingBar
??? ??? ??? ??? };
??? ??? ??? ??? //调用事件处理类
??? ??? ??? ??? CairngormUtil.event("TestCD",params);
??? ??? ??? }
???? ]]>
??? </fx:Script>
?
2. 数据显示界面调用分页组件
<paging:PagingBar id="pagingBar"></paging:PagingBar>
?
?
3.TestCD.as
-------------------------------------------------------------------
package fx.commands
{
??? import com.adobe.cairngorm.BaseCommand;
??? import com.adobe.cairngorm.CairngormUtil;
??? import com.adobe.cairngorm.control.CairngormEvent;
??? import com.adobe.serialization.json.JSON;
???
??? import flash.events.MouseEvent;
???
??? import fx.model.ModelConfig;
??? import fx.util.PagingBar;
???
??? import mx.collections.ArrayCollection;
??? import mx.controls.Alert;
??? import mx.controls.Button;
??? import mx.formatters.DateFormatter;
???
??? public class TestCD extends BaseCommand
??? {
??? ??? public var model:ModelConfig=ModelConfig.getOne();
??? ??? public var pbar:PagingBar=new PagingBar();
??? ???
??? ??? public function TestCD()
??? ??? {
??? ??? ??? //TODO: implement function
??? ??? ??? super();
??? ??? }
??? ???
??? ??? /**
??? ??? ?* 获取查询约束条件查询已做试卷
??? ??? ?**/
??? ??? override public function execute(event:CairngormEvent):void{
??? ??? ??? //查询界面传来的参数
??? ??? ??? var data:Object=event.data;
??? ??? ??? //设置pbar 对应getInfo(1) 中的pagingbar:pagingBar
??? ??? ??? pbar = data.pagingbar;
??? ??? ??? this.showBusy();
??? ??? ???
??? ??? ??? var url:String = model.urlRemoteWebServer+"/testAction.action";
??? ??? ??? //存储查询条件
??? ??? ??? model.testPageBar.params={paperName:data.paperName,source:data.source,currentPage:data.currentPage,pageSize:data.pageSize,pageNumShow:data.pageNumShow,eventName:data.eventName,pagingbar:data.pagingbar};
??? ??? ??? var params:Object={userid:model.uservo.getUserid(),papername:data.paperName,pageSize:data.pageSize};
??? ??? ??? //发送请求到远程服务器端获取信息
??? ??? ??? CairngormUtil.send(url
??? ??? ??? ???,this
??? ??? ??? ???,params);
??? ??? }
??? ???
??? ??? override public function result(data:Object):void{
??? ??? ??? var json_str:String = data.result as String;
??? ??? ??? //trace(json_str);
??????????? //服务器端的返回结果是json的形式
??? ??? ??? var result_str:Object= JSON.decode(json_str);
??????????? //返回的json串自己设定了一个标识,标识服务器端操作是否成功。根据自己定义的情况定
??? ??? ??? if(result_str.status=="200"){
??? ??? ??? ??? //设置界面上要展示的已做试卷数据
??? ??? ??? ??? getData(result_str.context[0].infos);
??? ??? ??? ??? pbar.pageBar=model.testPageBar;//设置对应分页信息来自testPageBar
??? ??? ??? ??? //获取到返回数据后,设置分页基本信息
??? ??? ??? ??? model.testPageBar.initPageBar(result_str.context[0].totalSize,model.testPageBar.pageSize,result_str.context[0].currentPage,model.testPageBar.params.pageNumShow,model.testPageBar.params.eventName);
??? ??? ??? ??? //view.delayView.addElement( new DelayView() );
??? ??? ??? ???
??? ??? ??? }else{
??? ??? ??? ???
??? ??? ??? }
??? ??? ??? this.closeBusy();
??? ??? }
??? ??? /**
??? ??? ?* 填充数据到ArrayCollection
??? ??? ?**/
??? ??? public function getData(data:Object):void{
??? ??? ??? //清空数据
??? ??? ??? model.testPageBar.clearOrgData();
??? ??? ??? for(var i:int=0;i<data.length;i++){
??? ??? ??? ??? var testData:Object={id:data[i].id,paperId:data[i].paperId,paperName:data[i].paperName,source:data[i].source,userScore:data[i].userScore,finalTime:data[i].finalTimeStr};
??? ???? //设定数据到orgData中 ? ???
model.testPageBar.setOrgData(testData);
??? ??? ??? }
??? ??? }
??? ???
??? ??? override public function fault(info:Object):void{
??? ??? ??? Alert.show(info.toString());
??? ??? }
??? }
}
----------------------------------------------------------------------------------
?
?
分页PagingBar.mxml
-----------------------------------------------------------------------------------
<mx:HBox xmlns:fx="http://ns.adobe.com/mxml/2009"
??? ??? ?xmlns:mx="library://ns.adobe.com/flex/mx"
??? ??? ?paddingLeft="10"
??? ??? ?backgroundColor="white">
??? <fx:Style>
??? ???
??? ??? LinkBar {
??? ??? ??? borderStyle: none;
??? ??? ??? backgroundAlpha: 0.06;
??? ??? ??? separatorColor: #c4cccc;
??? ??? ??? rollOverColor: #009999;
??? ??? ??? selectionColor: #7fcdfe;
??? ??? ??? textSelectedColor: #6600cc;
??? ??? ??? disabledColor: #33ffff;
??? ??? ??? dropShadowEnabled: false;
??? ??? }
??? </fx:Style>
??? <fx:Script>
??? ??? <![CDATA[
??? ??? ??? import com.adobe.cairngorm.CairngormUtil;
??? ??? ???
??? ??? ??? import flash.events.KeyboardEvent;
??? ??? ???
??? ??? ??? import fx.model.ModelConfig;
??? ??? ???
??? ??? ??? import mx.collections.ArrayCollection;
??? ??? ??? import mx.controls.AdvancedDataGrid;
??? ??? ??? import mx.controls.DataGrid;
??? ??? ??? import mx.events.ItemClickEvent;
??? ??? ??? import mx.utils.ObjectProxy;
??? ??? ??? import mx.validators.NumberValidator;
??? ??? ???
??? ??? ??? [Bindable]
??? ??? ??? public var model:ModelConfig=ModelConfig.getOne();//在声明ModelConfig是用到[Bindable],在界面使用时也需要用[Bindable]
??? ??? ??? [Bindable]
??? ??? ??? public var pageBar:PageBar=null;//这才是最关键的,分页的相关信息都从此对象来 获取
??? ??? ???
??? ??? ??? public var advancedDataGrid:AdvancedDataGrid=null;
??? ???
??? ??? ??? //页面初始化函数
??? ??? ??? public function getDatas(page:int):void{
??? ??? ??? ??? //重新设定当前页
??? ??? ??? ??? pageBar.params.currentPage=page;
??? ??? ??? ??? //参数处理
??? ??? ??? ??? var params:Object=pageBar.params;
??? ??? ??? ???
??? ??? ??? ??? //调用事件处理类
??? ??? ??? ??? CairngormUtil.event(pageBar.eventName,params);
??? ??? ??? ???
??? ??? ??? }
??? ??? ??? /**
??? ??? ??? ?* 页码按钮按下,first,pre,next,last
??? ??? ??? ?*/
??? ??? ??? private function navigateButtonClick(pageString:int):void{
??? ??? ??? ??? //1.重新设置首页、上一页、下一页、尾页
??? ??? ??? ??? //3.重新设置每页显示的页码条
??? ??? ??? ??? //2.重新填充页面数据
??? ??? ??? ??? //pageBar.createNavBar(pageString);
??? ??? ??? ???
??? ??? ??? ??? getDatas(pageString);
??? ??? ??? }
??? ??? ??? /**
??? ??? ??? ?* 页码按钮按下(页码条点击)
??? ??? ??? ?*/
??? ??? ??? private function navigatePage(event:ItemClickEvent):void
??? ??? ??? {
??? ??? ??? ??? //重发数据请求
??? ??? ??? ??? getDatas(event.item.data);
??? ??? ??? }
??? ??? ]]>
??? </fx:Script>
??? <mx:Label text="第" width="100%"/>
??? <mx:Label id="curPageLabel" text="{pageBar.currentPage}" width="100%"/>
??? <mx:Label text="页/共" width="100%"/>
??? <mx:Label id="totalPageLabel" text="{pageBar.totalPageSize}" width="100%"/>
??? <mx:Label text="页 共" width="100%"/>
??? <mx:Label id="countRecordSizeLabel" text="{pageBar.totalRecordSize}" width="100%"/>
??? <mx:Label text="条记录" width="100%"/>
??? <mx:Button id="firstNavBtn" label="首页" click="navigateButtonClick(pageBar.firstPage)"/>
??? <mx:Button id="preNavBtn" label="上一页" click="navigateButtonClick(pageBar.prePage)"/>
??? <mx:LinkBar id="pageNav" itemClick="navigatePage(event)" dataProvider="{pageBar.pageNumData}"/>
???
??? <mx:Button id="nextNavBtn" label="下一页" click="navigateButtonClick(pageBar.nextPage)"/>
??? <mx:Button id="lastNavBtn" label="尾页" click="navigateButtonClick(pageBar.lastPage)"/>
???
</mx:HBox>
?
-----------------------------------------------------------------------------------
?
分页数据存储类PageBar.as
------------------------------------------------------------------------------------
package fx.util
{
??? import com.adobe.cairngorm.CairngormUtil;
???
??? import mx.collections.ArrayCollection;
??? import mx.controls.Button;
??? import mx.controls.Label;
??? import mx.controls.LinkBar;
??? import mx.events.ItemClickEvent;
???
??? //必须声明成Bindable才能在其他mxml中Bindable
??? [Bindable]
??? public class PageBar
??? {
??? ??? /**
??? ??? ?* 查询数据的事件名称
??? ??? ?**/
??? ??? public var eventName:String="";
??? ??? /**
??? ??? ?* 总记录数
??? ??? ?**/
??? ??? public var totalRecordSize:int=0;
??? ??? /**
??? ??? ?* 每页显示行数
??? ??? ?**/
??? ??? public var pageSize:int=10;??? ???
??? ??? /**
??? ??? ?* 当前页数
??? ??? ?**/
??? ??? public var currentPage:int=1;??? ???
??? ??? /**
??? ??? ?* 总页数
??? ??? ?**/
??? ??? public var totalPageSize:int=1;???
??? ??? /**
??? ??? ?* 首页
??? ??? ?**/
??? ??? public var firstPage:int=1;
??? ??? /**
??? ??? ?* 上一页
??? ??? ?**/
??? ??? public var prePage:int=1;
??? ??? /**
??? ??? ?* 下一页
??? ??? ?**/
??? ??? public var nextPage:int=1;
??? ??? /**
??? ??? ?* 尾页
??? ??? ?**/
??? ??? public var lastPage:int=1;
??? ??? /**
??? ??? ?* 所有的数据
??? ??? ?**/
??? ??? public var orgData:ArrayCollection=new ArrayCollection();
??? ??? /**
??? ??? ?* 每页显示页码数
??? ??? ?**/
??? ??? public var pageNumShow:int=10;
??? ??? /**
??? ??? ?* 每页显示页码
??? ??? ?**/
??? ??? public var pageNumData:ArrayCollection=new ArrayCollection();
??? ??? /**
??? ??? ?* 存储查询参数
??? ??? ?* */
??? ??? public var params:Object={};
??? ??? /**
??? ??? ?* 当前页
??? ??? ?**/
??? ??? public var curPageLabel:Label=new Label();
??? ??? /**
??? ??? ?* 共多少页
??? ??? ?**/
??? ??? public var totalPageLabel:Label=new Label();
??? ??? /**
??? ??? ?* 共多少条记录
??? ??? ?**/
??? ??? public var countRecordSizeLabel:Label=new Label();
??? ??? /**
??? ??? ?* 首页
??? ??? ?**/
??? ??? public var firstNavBtn:Button=new Button();
??? ??? /**
??? ??? ?* 上一页
??? ??? ?**/
??? ??? public var preNavBtn:Button=new Button();
??? ??? /**
??? ??? ?* 分页块
??? ??? ?**/
??? ??? public var pageNav:LinkBar=new LinkBar();
??? ??? /**
??? ??? ?* 下一页
??? ??? ?**/
??? ??? public var nextNavBtn:Button=new Button();
??? ??? /**
??? ??? ?* 尾页
??? ??? ?**/
??? ??? public var lastNavBtn:Button=new Button();
??? ???
??? ??? public function PageBar()
??? ??? {
??? ??? }
??? ???
??? ??? /**
??? ??? ?* 计算总页数
??? ??? ?**/
??? ??? public function countTotalPageSize():void{
??? ??? ??? //1.总记录数小于每页显示记录数时
??? ??? ??? if(this.totalRecordSize<=this.pageSize && this.totalRecordSize>=0){
??? ??? ??? ??? this.totalPageSize=1
??? ??? ??? }
??? ??? ??? //2.总记录数大于每页显示记录数时??
??? ??? ??? if(this.totalRecordSize>this.pageSize && this.pageSize>=0){
??? ??? ??? ??? //trace("this.totalRecordSize/this.pageSize="+this.totalRecordSize/this.pageSize);
??? ??? ??? ??? //2.1 总记录数正好是每页显示记录数的倍数时,总页数=总记录数/每页显示记录数
??? ??? ??? ??? this.totalPageSize=this.totalRecordSize/this.pageSize;
??? ??? ??? ??? //trace("this.totalRecordSize%this.pageSize="+this.totalRecordSize%this.pageSize);
??? ??? ??? ??? //2.2 总记录数不是每页显示记录数的倍数时,总页数=总记录数/每页显示记录数+1
??? ??? ??? ??? if(this.totalRecordSize%this.pageSize>0){
??? ??? ??? ??? ??? this.totalPageSize+=1;
??? ??? ??? ??? }
??? ??? ??? }
??? ??? }
??? ??? /**
??? ??? ?* 设置首页和尾页
??? ??? ?**/
??? ??? public function setFirstPageAndLastPage():void{
??? ??? ??? //1.总体分页数第一页和最后一页
??? ??? ??? this.firstPage=1;
??? ??? ??? this.lastPage=this.totalPageSize;
??? ??? ??? //2.还有一中设置是根据this.pageNumData来设置
??? ??? ??? var size:int=this.pageNumData.length;
??? ??? ??? //this.firstPage=this.pageNumData.getItemAt(0).label
??? ??? ??? //this.lastPage=this.pageNumData.getItemAt(size-1).label
??? ??? }
??? ??? /**
??? ??? ?* 初始化分页,设置总记录数、每页显示记录数、当前页、计算总页数、设置首页、设置尾页
??? ??? ?* @param totalRecordSize 总记录数
??? ??? ?* @param pageSize 每页显示记录数
??? ??? ?* @param currentPage 当前页页码
??? ??? ?*
??? ??? ?**/
??? ??? public function initPageBar(totalRecordSize:int,pageSize:int,currentPage:int,pageNumShow:int,eventName:String):void{
??? ??? ??? this.pageSize=pageSize;
??? ??? ??? this.totalRecordSize=totalRecordSize;
??? ??? ??? this.pageNumShow=pageNumShow;
??? ??? ??? this.eventName=eventName;
??? ??? ??? countTotalPageSize();
??? ??? ??? this.currentPage=currentPage;
??? ??? ??? createNavBar(this.currentPage);
??? ??? ??? setNavInfo();
??? ??? ???
??? ??? }
??? ??? /**
??? ??? ?* 创建各分页
??? ??? ?**/
??? ??? public function createNavBar(currentPage:int):void{
??? ??? ??? //得知总页数、当前页数、每页显示页码数后就可以设置上一页和下一页
??? ??? ??? //上一页
??? ??? ??? this.prePage=this.currentPage-1>0?this.currentPage-1:1;
??? ??? ??? //下一页
??? ??? ??? this.nextPage=this.currentPage+1<=this.totalPageSize?this.currentPage+1:this.totalPageSize;
??? ??? ??? this.pageNumData.removeAll();
??? ??? ??? if(this.totalPageSize<=this.pageNumShow){//1.总页数小于设定的页码数pageNumShow时,显示所有页码
??? ??? ??? ??? for(var i:int=0;i<this.totalPageSize;i++){
??? ??? ??? ??? ??? //确保小于总页数,否则退出循环
??? ??? ??? ??? ??? this.pageNumData.addItem({label: 1+i,data: 1+i});
??? ??? ??? ??? }
??? ??? ??? }else{
??? ??? ??? ??? if(this.totalPageSize-this.currentPage+1<=this.pageNumShow){//2.剩余页码数(this.totalPageSize-this.currentPage+1)小于设定页码数pageNumShow,补全页码
??? ??? ??? ??? ??? for(var i:int=this.totalPageSize-this.pageNumShow+1;i<=this.totalPageSize;i++){
??? ??? ??? ??? ??? ??? //确保小于总页数,否则退出循环
??? ??? ??? ??? ??? ??? this.pageNumData.addItem({label: i,data: i});
??? ??? ??? ??? ??? }
??? ??? ??? ??? }else{
??? ??? ??? ??? ??? for(var i:int=0;i<this.pageNumShow;i++){//3.当前页码+设定页码数小于totalPageSize时,正常滚动
??? ??? ??? ??? ??? ??? //确保小于总页数,否则退出循环
??? ??? ??? ??? ??? ??? if(this.currentPage+i<=this.totalPageSize){
??? ??? ??? ??? ??? ??? ??? this.pageNumData.addItem({label: this.currentPage+i,data: this.currentPage+i});
??? ??? ??? ??? ??? ??? }
??? ??? ??? ??? ??? }
??? ??? ??? ??? }
??? ??? ??? }
??? ??? ??? setFirstPageAndLastPage();
??? ??? }
??? ??? /**
??? ??? ?*??? 设置分页条上的分页统计信息
??? ??? ?**/
??? ??? public function setNavInfo():void{
??? ??? ??? //设置界面上的分页统计数据
??? ??? ??? this.curPageLabel.text=this.currentPage.toString();
??? ??? ??? this.totalPageLabel.text=this.totalPageSize.toString();
??? ??? ??? this.countRecordSizeLabel.text=this.totalRecordSize.toString();
??? ??? ??? this.pageNav.dataProvider=this.pageNumData;
??? ??? }
??? ??? /**
??? ??? ?* 清空orgData中的数据,此数据用于在界面展示
??? ??? ?**/
??? ??? public function clearOrgData():void{
??? ??? ??? this.orgData.removeAll();
??? ??? }
??? ??? /**
??? ??? ?*??? 绑定数据到orgData中
??? ??? ?**/
??? ??? public function setOrgData(data:Object):void{
??? ??? ??? this.orgData.addItem(data);
??? ??? }
??? ??? /**
??? ??? ?* 清空分页条
??? ??? ?**/
??? ??? public function clearPageNumData():void{
??? ??? ??? this.pageNumData.removeAll();
??? ??? }
??? ??? /**
??? ??? ?*??? 设定分页条
??? ??? ?**/
??? ??? public function setPageNumData(data:Object):void{
??? ??? ??? this.pageNumData.addItem(data);
??? ??? }
??? }
}
?
--------------------------------------------------------------------
ModelConfig.as
------------------------------------------------------------
package fx.model
{
??? import com.adobe.cairngorm.model.IModelLocator;
???
??? import fx.util.PageBar;
??? import fx.util.Pages;
???
??? import mx.collections.ArrayCollection;
???
??? import spark.components.TitleWindow;
??? import spark.components.WindowedApplication;
???
???
??? [Bindable]
??? /**
??? ?*配置所有需要的model类
??? ?* @author Administrator
??? ?*
??? ?*/
??? public class ModelConfig implements IModelLocator
??? {
??? ??
??? ??? //远端服务器地址
??? ??? public var urlRemoteWebServer:String="http://www.test.com";
??? ??? //存储我已做试卷分页信息
??? ??? public var testPageBar:PageBar=new PageBar();
??????? public var uservo:UserVO=null;//存放用户登录的信息
??? ??? //公用
??? ??? public var rootWin:WindowedApplication;
??? ??? public var loginViewWin:TitleWindow;
??? ??? public var mainViewWin:TitleWindow;
??? ??? public var doEvaluateVO:DoEvaluateVO;
??? ??
??? ?? ??? /////////////////////////////////////////////////////////////////?????????
????????? private static var one:ModelConfig=null;
???????? public static function getOne():ModelConfig
????????? {
?????????????? if (one == null)one = new ModelConfig();
?????????????? return one;
????????? }
????????? public function ModelConfig()
????????? {
?????????????
????????? }
?????????
??? }
}
----------------------------------------------------------
注册事件CommandConfig.as
?
package fx.commands
{
??? import com.adobe.cairngorm.control.FrontController;
???
???
??? /**
??? ?* 注册所有的控制器
??? ?* @author Administrator
??? ?*
??? ?*/
??? public class CommandConfig extends FrontController
??? {
??? ??? ?
??? ???
??? ??? public function CommandConfig(){
??? ??? ?? //事件处理类不注册是不能使用的
????????? add(TestCD ); ??? ??? } ??? ??? ??? } }