可循环滚动的导航栏

前些天公司要弄个，鼠标放在左右按钮上，可循环滑动的导航栏，从网上找了些资料，做了一个

注意事项：

为了不使滚动条产生，应该使画布的 horizontalScrollPolicy="off"

使图片产生移动效果，用标签 <mx:Move id="moveR" xBy="110" duration="500"/> xBy 为移动的相对距离。

效果图：

 下面是源代码，欢迎大牛们指教：

<?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" 
			   creationComplete="init()"
			   backgroundColor="#7F95A0"
			   minWidth="955" minHeight="600">
	
	<fx:Script>
		<![CDATA[
			import mx.controls.Alert;
			import mx.controls.Image;
			import mx.events.EffectEvent;
			import mx.validators.ValidationResult;
			
			private var itemList:Array=new Array;
			private var curIndex:int;
			private var lFlag:Boolean;
			private var rFlag:Boolean;
			private var i:int;
			
			private function init():void{
				lFlag = true;
				rFlag = true;
				i = 1;
				
				var img1:Image = new Image();
				img1.width = 100;
				img1.height = 100;
				img1.source = "asset/1.jpg";
				
				var img2:Image = new Image();
				img2.width = 100;
				img2.height = 100;
				img2.source = "asset/2.jpg";
				
				var img3:Image = new Image();
				img3.width = 100;
				img3.height = 100;
				img3.source = "asset/3.jpg";
				img3.addEventListener(MouseEvent.CLICK,function():void{
					Alert.show("chenggong");
				});
				
				var img4:Image = new Image();
				img4.width = 100;
				img4.height = 100;
				img4.source = "asset/4.jpg";
				
				var img5:Image = new Image();
				img5.width = 100;
				img5.height = 100;
				img5.source = "asset/5.jpg";
				
				var img6:Image = new Image();
				img6.width = 100;
				img6.height = 100;
				img6.source = "asset/6.jpg";
				

				itemList.push(img1);
				itemList.push(img2);
				itemList.push(img3);
				itemList.push(img4);
				itemList.push(img5);
				itemList.push(img6);
				initView();
			}
			
			private function initView():void{
				for(var i:int=0;i<(itemList.length-1);i++){
					itemList[i].x=110*i;
					item_cav.addChild(itemList[i]);
				}

				itemList[itemList.length-1].x=-110;
				item_cav.addChild(itemList[itemList.length-1]);
				
				//对向左滑动动作的结束做监听
				moveL.addEventListener(EffectEvent.EFFECT_END,function():void{
					i++;
					if(i==7){
						i = 1;
						
						if(!lFlag){
							moveL.end();
							lFlag = true;
						}else{
							moveL.end();
							rollL();
						}
					}
					
				});
				
				//对向右滑动动作的结束做监听
				moveR.addEventListener(EffectEvent.EFFECT_END,function():void{
					i++;
					if(i==7){
						i = 1;
						
						if(!rFlag){
							moveR.end();
							rFlag = true;
						}else{
							moveR.end();
							rollR();
						}
					}
					
				});
			}
			
			//向左的动作
			private function rollL():void{
				if(moveR.isPlaying==false){
					if(moveL.isPlaying==false){
						if(curIndex==0)
							itemList[itemList.length-1].x+=(itemList.length)*110;
						else
							itemList[curIndex-1].x+=(itemList.length)*110;
						if(curIndex==itemList.length-1)
							curIndex=0;
						else 
							curIndex+=1;
						
						moveL.play(itemList);
					}
				}
				
			}
			//停止向左滑动
			private function stopRollL():void{
				
				lFlag = false;
			}
			
			//向右的动作
			private function rollR():void{
				if(moveL.isPlaying==false){
					if(moveR.isPlaying==false){
						if(curIndex==0)
							curIndex=itemList.length-1;
						else
							curIndex-=1;
						if(curIndex==0)
							itemList[itemList.length-1].x-=(itemList.length)*110;
						else
							itemList[curIndex-1].x-=(itemList.length)*110;
						
						moveR.play(itemList);
					}
				}
				
			}
			//停止向右滑动
			private function stopRollR():void{
				
				rFlag = false;
			}
			
			
		]]>
	</fx:Script>
	
	<fx:Declarations>
		<mx:Move id="moveR" xBy="110" duration="1000" />
		<mx:Move id="moveL" xBy="-110" duration="1000" />
	</fx:Declarations>
	
	<mx:HBox horizontalCenter="0" verticalCenter="0">
		<mx:Button label="<" height="75" width="30" mouseMove="rollL()" mouseOut="stopRollL();"/>
		<mx:Canvas id="item_cav" width="320" height="100" horizontalScrollPolicy="off">
		</mx:Canvas>
		<mx:Button label=">" height="75" width="30" mouseMove="rollR()" mouseOut="stopRollR();"/> 
	</mx:HBox>
	
</s:Application>