Flex实现图片展播+渐出特效

<? xml version="1.0" encoding="utf-8" ?>
< mx:Application xmlns:mx ="http://www.adobe.com/2006/mxml" layout ="absolute" creationComplete ="init()" >
???? < mx:Script >
???????? <![CDATA[
???????????? import mx.collections.ArrayCollection;
???????????? import mx.core.UIComponent;
???????????? [Bindable]
???????????? private var picArray:ArrayCollection;
???????????? [Bindable]
???????????? private var index:Number = 0;
????????????
???????????? private function init():void
???????????? {
???????????????? var loader:URLLoader = new URLLoader();
???????????????? loader.addEventListener(Event.COMPLETE,onComplete);
???????????????? loader.load(new URLRequest("data/pic.xml"));
???????????? }
????????????
???????????? private function onComplete(event:Event):void
???????????? {
???????????????? var xml:XML = new XML(event.target.data);
????????????????
???????????????? picArray = new ArrayCollection();
???????????????? for(var i:Number = 0;i <xml.children().length();i++)
???????????????? {
???????????????????? var o:Object = new Object();
???????????????????? o.ImageUrl = xml.pic[i].imageUrl;
???????????????????? picArray.addItem(o);
???????????????? }
???????????? }
????????????
???????????? private function onClickHandler(id:String):void
???????????? {
???????????????? switch(id)
???????????????? {
???????????????????? case "btn1":
???????????????????????? this.index = 0;
???????????????????????? break;
???????????????????? case "btn2":
???????????????????????? if(this.index != 0)
???????????????????????? {
???????????????????????????? this.index -= 1;
???????????????????????? }
???????????????????????? break;
???????????????????? case "btn3":
???????????????????????? if(this.index != picArray.length-1)
???????????????????????? {
???????????????????????????? this.index += 1;
???????????????????????? }
???????????????????????? break;
???????????????????? case "btn4":
???????????????????????? this.index = picArray.length - 1;
???????????????????????? break;
???????????????? }
???????????? }
????????????
???????????? private function onImageClick(event:MouseEvent):void
???????????? {
???????????????? if(this.index == picArray.length -1)
???????????????? {
???????????????????? this.index = 0;
???????????????? }
???????????????? else
???????????????? {
???????????????????? this.index++;
???????????????? }
???????????? }
???????? ]]>
???? </ mx:Script >
???? < mx:Panel x ="73" y ="78" width ="701" height ="536" layout ="absolute" fontSize ="12" >
???????? < mx:Image x ="0" y ="0" width ="680" height ="455" id ="imageShow" completeEffect ="{fadeIn}"
???????????? source ="{picArray.getItemAt(index).ImageUrl}" click ="onImageClick(event)" />
???????? < mx:Button x ="154" y ="463" label ="第一张" id ="btn1" click ="onClickHandler(btn1.id)" />
???????? < mx:Button x ="227" y ="462" label ="上一张" id ="btn2" click ="onClickHandler(btn2.id)" />
???????? < mx:Button x ="300" y ="462" label ="下一张" id ="btn3" click ="onClickHandler(btn3.id)" />
???????? < mx:Button x ="373" y ="462" label ="最后一张" id ="btn4" click ="onClickHandler(btn4.id)" />
???????? < mx:Label x ="607" y ="466" width ="73" id ="indexCount" color ="#FF0030" fontWeight ="bold"
???????????? text ="{(index+1) + '/' + picArray.length}" />
???? </ mx:Panel >
???? < mx:Fade id ="fadeIn" duration ="2000" alphaFrom ="0.18" alphaTo ="1.0" />
</ mx:Application >