flex 编写分页导航条（demo） 以及 label link事件学习
label对象：id txt，如果想将触发link事件的话：需要将selectable="true"
txt.htmlText = "<a href='event:click'>con</a>“;
txt.addEventListener(TextEvent.LINK,linkhandle);
function linkhandle(textEvt:TextEvent):void{
trace(textEvt.type); //link
trace(textEvt.text); //click
trace(textEvt.target.text) ; //con
}
=============
分页组件：
<?xml version="1.0" encoding="utf-8"?>
<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" width="100%" height="30" xmlns:local="*" creationComplete="init()" contentBackgroundColor="#86BC92" fontWeight="bold"
>
<fx:Metadata>
[Event(name="navPagerEvent",type="list.comp.events.NavPagerEvent")]
</fx:Metadata>
<fx:Declarations>
<!-- 将非可视元素（例如服务、值对象）放在此处 -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import list.comp.events.NavPagerEvent;
import mx.events.FlexEvent;
[Bindable] public var pageIndex:int = 1;//当前页
[Bindable] public var pageSize:int = 10;//每页大小
[Bindable] public var pageCount:int = 0;//总共页数
[Bindable] public var totalCount:int = 0;//总共记录数
[Bindable] public var start:int = 1;//显示开始记录号
[Bindable] public var end:int = 1;//显示结束记录号
[Bindable] public var range:int = 3;//范围
protected function init():void{
onChangeHandler();
rangLabel.addEventListener(TextEvent.LINK,text1_linkHandler);
}
protected function btn_clickHandler(event:MouseEvent,pageIndex:int):void
{
if(pageIndex>0){
this.pageIndex = pageIndex;
var ev:NavPagerEvent = new NavPagerEvent('navPagerEvent',this.pageIndex,this.pageSize);
onChangeHandler();
this.dispatchEvent(ev);
}
}
[Bindable]
protected function isFirstEnabled():Boolean{
if(this.totalCount >0){
return true;
}
return false;
}
[Bindable]
internal function isLastEnabled():Boolean{
if(this.totalCount >0){
return true;
}
return false;
}
[Bindable]
private function isBeforeEnabled():Boolean{
if(this.totalCount >0){
if(this.pageIndex>1){
return true;
}else{
return false;
}
}
return false;
}
[Bindable]
internal function isNextEnabled():Boolean{
if(this.totalCount >0){
if(this.pageIndex* this.pageSize < this.totalCount){
return true;
}else{
return false;
}
}
return false;
}
protected function onChangeHandler():void
{
if(this.pageIndex<1){
this.pageIndex = 1;
}
if(this.totalCount<0){
this.totalCount = 0;
}
if(this.pageSize<1){
this.pageSize = 10;
}
if(this.totalCount >0){
this.pageCount = (this.totalCount +this.pageSize -1)/this.pageSize;
}else{
this.pageCount = 0;
}
this.start = (this.pageIndex -1) * this.pageSize;
this.end = start + this.pageSize -1;
if(this.end >= this.totalCount){
this.end = this.totalCount -1;
}
initRangeInfo();
}
internal function initRangeInfo():void{
var front:int = this.pageIndex - this.range;
var back:int = this.pageIndex + this.range;
var buf:String = "<p>";
// 如果当前页是5,前面一截就是234,后面一截就是678
if (this.pageCount > 1) {
var tempBack:int = this.pageCount;
var tempFront:int = 1;
if (back < this.pageCount){
tempBack = back;
}
if (front > 1){
tempFront = front;
}
if(tempFront > 1){
buf += "... ";
}
for (var i:int = tempFront; i <= tempBack; i++) {
if (this.pageIndex == i) {
buf += "<font color = '#ff0000'>" + i + "</font> ";
} else {
buf +="<a href='event:" + i + "' >" + i +"</a> ";
}
}
if(tempBack < this.pageCount){
buf += "... ";
}
}
buf += "</p>"
rangLabel.htmlText = buf;
}
protected function text1_linkHandler(event:TextEvent):void
{
var text:String = event.text;
var tmp:int = parseInt(text);
btn_clickHandler(null,tmp);
}
]]>
</fx:Script>
<s:layout>
<s:HorizontalLayout />
</s:layout>
<s:Group width="50%" height="30" >
<s:layout>
<s:HorizontalLayout horizontalAlign="left" verticalAlign="middle" />
</s:layout>
<mx:Text text="{' 第'+ pageIndex +'页/'+ pageCount +'页'+' 显示'+ start +'到' + end +'条 共'+ totalCount + '条记录'}" fontSize="12"/>
</s:Group>
<s:Group width="50%" height="30" >
<s:layout>
<s:HorizontalLayout verticalAlign="middle" horizontalAlign="right"/>
</s:layout>
<mx:LinkButton id="lbtnFirst" label="首页" click="btn_clickHandler(event,1)" enabled="{isFirstEnabled()}" fontSize="12"/>
<mx:LinkButton id="lbtnPrevious" label="上一页" click="btn_clickHandler(event,pageIndex - 1)" enabled="{isBeforeEnabled()}" fontSize="12"/>
<mx:Label selectable="true" enabled="true" htmlText="" letterSpacing="3" id="rangLabel" fontSize="12"/>
<mx:LinkButton id="lbtnNext" label="下一页" click="btn_clickHandler(event,pageIndex + 1)" enabled="{isNextEnabled()}" fontSize="12"/>
<mx:LinkButton id="lbtnLast" label="尾页" click="btn_clickHandler(event,pageCount)" enabled="{isLastEnabled()}" fontSize="12"/>
</s:Group>
</s:Group>
