实现的原理是通过XML配置图片数据，Flex读取XML文件获取到图片数据，然后将当前显示的图片设置为XML中配置的第一条数据的图片，通过四个按扭 来控制图片播放的索引，同时为图片也加了事件处理函数，点击图片就切换到下一张图片。下面是最终效果图。
废话少说，直接上代码。
CODE:
<?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>
