paperpanel.mxml

用Flex实现的一个关于减肥系统的web界面,内部没有实际的业务逻辑,只是一个原形.

<?xml version="1.0" encoding="utf-8"?>
<mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml"
	width="432" height="100%" 
	horizontalScrollPolicy="off" verticalScrollPolicy="off"
	creationComplete="init()"
	horizontalAlign="center">
	<mx:Script>
		<![CDATA[

			public var blurringArray:Array = new Array();
			[Bindable]
			public var currentPageIndex:int = 0;
			[Bindable]
			public var canvasWidth:Number = 432;
			
			public function init():void
			{
				blurringArray.push(new BlurFilter(64,2));
			}
			
			public function onPreHandler():void
			{
				if(currentPageIndex > 0)
					currentPageIndex--;
			}
			public function onNextHandler():void
			{
				if(currentPageIndex < this.boxForms.numChildren-1)
					currentPageIndex++;
			}
			
			public function onMoveStartHandler():void
			{
				this.boxForms.filters = blurringArray;
			}
			public function onMoveEndHandler():void
			{
				this.boxForms.filters = null;
			}
		]]>
	</mx:Script>
	
	<mx:HBox id="boxForms" moveEffect="{effSlide}" 
		x="{-currentPageIndex * canvasWidth}">
		<mx:Panel title="Panel 1" width="432" height="100%">
			<mx:Text text="hello"/>
			<mx:Label text="hello"/>
		</mx:Panel>
		<mx:Panel title="Panel 1" width="432" height="100%">
			<mx:Text text="hello"/>
			<mx:Label text="hello"/>
		</mx:Panel>
	</mx:HBox>
	<mx:Move id="effSlide" 
		effectStart="onMoveStartHandler()"
		effectEnd="onMoveEndHandler()"/>
	<mx:ControlBar>
		<mx:Spacer width="100%"/>
		<mx:Button label="Previous" click="onPreHandler()" x="218" y="490"/>
		<mx:Button label="Next" click="onNextHandler()" x="302" y="490"/>
	</mx:ControlBar>
	
</mx:Panel>