`
kktxah
  • 浏览: 10837 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
文章分类
社区版块
存档分类
最新评论

flex 分页组件的实现

阅读更多
<?xml version="1.0" encoding="utf-8"?>
<s:BorderContainer xmlns:fx="http://ns.adobe.com/mxml/2009"
   xmlns:s="library://ns.adobe.com/flex/spark"
   xmlns:mx="library://ns.adobe.com/flex/mx" height="30">
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<fx:Metadata>
</fx:Metadata>
<fx:Script>
<![CDATA[
import mx.controls.Alert;
[Bindable]
public var totalRecord:int;
[Bindable]
public var pageSize:int=15;
private var offset:int;
[Bindable]
private var pageNo:int;
[Bindable]
private var currentPage:int=1;
private function getPageNo():int {
var mod:int = totalRecord%pageSize;
if(mod == 0) {
return totalRecord/pageSize;
}
return totalRecord/pageSize+1;
}

private function firstButtonHandler(event:MouseEvent):void {
if(currentPage == 1) {
Alert.show("当前已经是首页");
return;
}
this.currentPage = 1;
offset = 0;
dispatchEvent(new DataPagesEvent(DataPagesEvent.DATA_PAGES_EVENT,offset,pageSize,true));
}

private function preButtonHandler(event:MouseEvent):void {
if(currentPage>1) {
currentPage--;
offset = (currentPage-1)*pageSize;

dispatchEvent(new DataPagesEvent(DataPagesEvent.DATA_PAGES_EVENT,offset,pageSize,true));
} else {
Alert.show("当前已经是第一页");
return;
}
}

private function nextButtonHandler(event:MouseEvent):void {
if(currentPage<getPageNo()) {
offset = (currentPage)*pageSize;
currentPage++;
dispatchEvent(new DataPagesEvent(DataPagesEvent.DATA_PAGES_EVENT,offset,pageSize,true));
} else {
Alert.show("当前已经是尾页");
return;
}
}

private function lastButtonHandler(event:MouseEvent):void {
if(currentPage < getPageNo()) {
currentPage = getPageNo();
offset = (currentPage-1)*pageSize;
dispatchEvent(new DataPagesEvent(DataPagesEvent.DATA_PAGES_EVENT,offset,pageSize,true));
} else {
Alert.show("当前已经是尾页");
return;
}
}


]]>
</fx:Script>
<s:layout>
<s:HorizontalLayout horizontalAlign="right" verticalAlign="middle" gap="2"/>
</s:layout>
<mx:LinkButton label="首页"  id="firstButton" click="firstButtonHandler(event)"/>
<mx:LinkButton label="上一页" id="preButton" click="preButtonHandler(event)"/>
<mx:LinkButton label="下一页" id="nextButton" click="nextButtonHandler(event)"/>
<mx:LinkButton label="尾页"   id="lastButton" click="lastButtonHandler(event)"/>
<s:Label id="allRecord" paddingTop="5" text="共{totalRecord}条记录   "/>
<s:Label id="currentPageNo" paddingTop="5" text=" 当前第{currentPage}页" paddingRight="6"/>
</s:BorderContainer>
分享到:
评论

相关推荐

    Flex 分页组件,flex自定义组件

    Flex分页组件是一种在Flex应用程序中用于展示大量数据并分批加载的重要工具。它通过将大量数据分成小块,每次只加载一部分,提高了用户界面的响应速度和用户体验。本组件适用于那些需要显示大量数据,如表格、列表...

    Flex 分页控件组件

    在实际使用中,Flex分页组件通常会与数据提供者(如ArrayCollection或DataService)结合,根据当前页面索引来获取并显示相应的数据块。分页控件会监听用户的交互事件,如点击页码按钮,然后更新数据提供者的状态,...

    SimPager Flex分页组件

    重写的Flex分页组件,改进了一些BUG,原版的源码丢了,又重写了一个,所以没有版本之分 recordCount//记录总数,程序对该属性赋值生成分页 currentPageIndex//当前页 pageSize//每页记录数 buttonConut//显示的...

    flex分页 很好很强大

    在实际应用中,开发者可以利用各种前端框架和库来实现Flex分页,例如React、Vue或Angular都有相应的组件库,如React Paginate、Vue Paginate或ngx-pagination。这些库通常提供丰富的配置选项,使得定制和集成更加...

    flex分页组件

    标题"flex分页组件"表明我们要讨论的是Flex编程环境中关于分页功能的实现。Flex是Adobe开发的一种开源框架,主要用于构建富互联网应用程序(RIA),尤其适用于创建具有复杂交互和动态数据展示的Web应用。 描述中的...

    flex 分页组件

    综上所述,这个Flex分页组件提供了一套完整的分页解决方案,包括前后翻页、直接跳转到指定页等功能,同时通过`Comp_Page_Controller.mxml`实现了背后的逻辑处理。通过深入理解这些知识点和组件的内部工作原理,...

    flex 分页

    "Flex分页"指的是使用Adobe Flex框架实现数据的分页显示。Flex是一个开源的、基于ActionScript的开发框架,用于构建富互联网应用(RIA)。在这个场景下,我们将深入探讨Flex中的分页实现以及相关知识点。 首先,...

    Flex4分页组件源码

    这个“Flex4分页组件源码”提供了在Flex4环境中实现分页功能的源代码,这对于开发大型数据集的用户界面至关重要。分页允许用户逐步浏览大量数据,而无需一次性加载所有内容,提高了应用程序的性能和用户体验。 在...

    Flex4 分页组件

    在Flex4中,分页组件是实现大量数据展示时非常重要的一个功能,它允许用户以较小的数据块浏览内容,提高应用性能和用户体验。 分页组件在Flex4中的实现主要依赖于`mx.controls.Pagination`类。这个类提供了分页控制...

    flex分页代码

    "Flex分页代码"指的是使用Adobe Flex这一编程框架实现的分页功能。Flex是一款基于ActionScript 3.0的开源框架,它允许开发者构建富互联网应用(RIA)。在这里,我们主要探讨如何在Flex中实现分页功能。 Flex提供了...

    flex分页工具条组件

    Flex分页工具条组件是一种在Flex应用程序中实现数据分页显示的重要组件。它允许用户在大量数据中分块浏览,提高用户体验,降低一次性加载过多数据对系统资源的需求。Flex是Adobe开发的一种基于ActionScript和MXML的...

    Flex分页显示实例

    本实例将聚焦于“Flex分页显示”,这是一种使用Adobe Flex框架实现的数据分页方法。Flex是基于ActionScript 3.0的开源框架,用于构建富互联网应用程序(RIA)。它提供了丰富的组件库和强大的数据绑定机制,使得开发...

    flex分页组件,需要的下吧

    flex的分页组件,希望对大家有帮助。 把下载的文件,拷贝到flexBuilder中,编译,直接运行,即可。 sdk需要4.5以上。如果不是,就把TestPage.mxml中DataGrid那一段删除或者修改为你们支持的DataGrid。

    flex分页控件的使用

    在Flex开发中,分页控件是用于展示大量数据时必不可少的一个组件,它允许用户以较小的数据块(每页)浏览整个数据集,从而提高用户体验并减轻服务器负载。本篇文章将详细讲解如何在Flex中创建和使用分页控件。 首先...

    flex 分页控件

    综上所述,创建一个自定义的Flex分页控件涉及到组件设计、事件处理、数据绑定、皮肤化等多个方面。通过深入理解和实践这些知识点,开发者可以构建出功能强大、易于使用的分页工具,提升应用的用户体验。提供的文件...

    flex分页组建

    实现Flex分页组件的关键步骤包括: 1. 创建数据提供者:将要分页的数据放入ArrayCollection或XMLListCollection,并设置其size属性为总条目数。 2. 配置分页组件:设置每页显示的条目数(pageSize),并根据数据...

    flex 分页控件,我自己写的flex分页控件

    这是我自己写的一个flex组件,使用简单,在使用的时候,只需要在页面载入里,新建组件对象就OK,另外还有一个方法监听控件返回的的页数,可以实现分面。flex会生成linkButton,并且可以按需要控件显示的数量。如有不...

    Flex +BlazeDS+java后台分页的实现

    Flex + BlazeDS + Java 后台分页的实现是一个关键的技术环节,特别是在开发大型Web应用程序时,为了提高用户体验和系统性能,数据通常需要通过分页的方式进行加载。本方案主要探讨了如何在Flex前端和BlazeDS中间件与...

    Flex分页技术

    在Flex中,我们可以使用DataGrid组件来实现这些功能,提高用户体验并优化性能。 1. **Flex DataGrid 分页技术**: Flex DataGrid 提供了分页功能,以处理大量数据。分页允许用户按页面浏览数据,而不是一次性加载...

    flex 分页学习例子

    通过深入研究这些文件,你可以了解Flex分页的具体实现,包括数据源的管理、分页组件的自定义、事件处理和数据绑定的细节。这对于提升Flex编程技能,尤其是处理大型数据集的场景,是非常有价值的实践。

Global site tag (gtag.js) - Google Analytics