Flex List 分页

转:http://blog.csdn.net/flexrhythm/article/details/5696128

 

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
			   xmlns:s="library://ns.adobe.com/flex/spark"
			   xmlns:mx="library://ns.adobe.com/flex/mx"
			   xmlns:local="*"
			   width="100%" height="100%" creationComplete="init()">
	<fx:Script>
		<![CDATA[
			import mx.controls.Alert;
			[Bindable] public var totalPages:Number;
			[Bindable] public var currentPage:Number = 1;
			[Embed(source='assets/01.gif')] 
			[Bindable]
			public var backpackCls:Class;
			[Embed(source='assets/02.gif')]
			[Bindable]
			public var bootsCls:Class;
			[Embed(source='assets/bg.jpg')]
			[Bindable]
			public var compassCls:Class;
			[Embed(source='assets/bg.jpg')]
			[Bindable]
			public var gogglesCls:Class;
			[Embed(source='assets/bg.jpg')]
			[Bindable]
			public var helmetCls:Class;
			public function prevPageHandler():void {
				if(currentPage == 1) return ;
				currentPage--;
				//上一页
				
				list.scroller.verticalScrollBar.changeValueByPage(false);
				
			}
			
			
			
			public function nextPageHandler():void {
				
				if(currentPage == totalPages) return;
				
				currentPage++;
				
				//下一页
				
				list.scroller.verticalScrollBar.changeValueByPage(true);
				
			}
			
			
			
			//设置list控件的滚动控件的样式
			
			public function init():void {
				
				//关掉滚动控件的垂直和水平滚动条
				
				list.scroller.setStyle('horizontalScrollPolicy', 'off');
				
				list.scroller.setStyle('verticalScrollPolicy', 'off');
				
				//设置滚动控件的垂直滚动条的滚动样式
				
				list.scroller.verticalScrollBar.setStyle('smoothScrolling', true);//设置为平滑滚动
				
				list.scroller.verticalScrollBar.setStyle('repeatInterval', 500);//设置滚动到指定点的经过的时间
				
				totalPages = Math.ceil(list.scroller.viewport.contentHeight/list.scroller.verticalScrollBar.pageSize);
				
			}
			
			
			
		]]>
		
	</fx:Script>
	
	<s:VGroup x="10" y="5" width="100%" height="100%">
		
		<s:Label text="Page {currentPage} of {totalPages}"/>
		
		<s:HGroup>
			
			<s:VGroup>
				
				<s:Button id="prev" label="Prev" click="prevPageHandler()"/>
				
				<s:Button id="next" label="Next" click="nextPageHandler()"/>
				
			</s:VGroup>
			
			<s:List id="list" width="400" height="362">
				
				<s:dataProvider>
					
					<s:ArrayCollection>
						
						<fx:Object name="Backpack" photo="{backpackCls}"/>
						
						<fx:Object name="Boots" photo="{bootsCls}"/>
						
						<fx:Object name="Compass" photo="{compassCls}"/>
						
						<fx:Object name="Goggles" photo="{gogglesCls}"/>
						
						<fx:Object name="Helmet" photo="{helmetCls}"/>
						
						<fx:Object name="Backpack" photo="{backpackCls}"/>
						
						<fx:Object name="Boots" photo="{bootsCls}"/>
						
						<fx:Object name="Compass" photo="{compassCls}"/>
						
						<fx:Object name="Goggles" photo="{gogglesCls}"/>
						
						<fx:Object name="Backpack" photo="{backpackCls}"/>
						
						<fx:Object name="Boots" photo="{bootsCls}"/>
						
						<fx:Object name="Compass" photo="{compassCls}"/>
						
						<fx:Object name="Goggles" photo="{gogglesCls}"/>
						
						<fx:Object name="Helmet" photo="{helmetCls}"/>
						
						<fx:Object name="Backpack" photo="{backpackCls}"/>
						
						<fx:Object name="Boots" photo="{bootsCls}"/>
						
						<fx:Object name="Compass" photo="{compassCls}"/>
						
						<fx:Object name="Goggles" photo="{gogglesCls}"/>
						
						<fx:Object name="Helmet" photo="{helmetCls}"/>
						
						<fx:Object name="Compass" photo="{compassCls}"/>
						
						<fx:Object name="Goggles" photo="{gogglesCls}"/>
						
						<fx:Object name="Helmet" photo="{helmetCls}"/>
						
						<fx:Object name="Compass" photo="{compassCls}"/>
						
						<fx:Object name="Goggles" photo="{gogglesCls}"/>
						
						<fx:Object name="Helmet" photo="{helmetCls}"/>
						
						<fx:Object name="Compass" photo="{compassCls}"/>
						
						<fx:Object name="Goggles" photo="{gogglesCls}"/>
						
						<fx:Object name="Backpack" photo="{backpackCls}"/>
						
						<fx:Object name="Boots" photo="{bootsCls}"/>
						
						<fx:Object name="Compass" photo="{compassCls}"/>
						
					</s:ArrayCollection>
					
				</s:dataProvider>
				
				<s:layout>
					
					<s:TileLayout columnWidth="120" horizontalGap="0" requestedColumnCount="3"
								  rowHeight="120" verticalGap="0"/>
					
				</s:layout>
				
			</s:List>
			
		</s:HGroup>
		
		
		
	</s:VGroup>
	
</s:Application>


 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值