Flex图片幻灯片效果

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
creationComplete="InitApp()">
<mx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.events.FlexEvent;
import mx.effects.*;
import mx.collections.ArrayCollection;

//效果集合,用来绑定Image
[Bindable]
private var effects:ArrayCollection = new ArrayCollection();
//应用效果的索引
[Bindable]
private var effectIndex:int = 0;
//图片集合
private var pictures:ArrayCollection = new ArrayCollection();
//时间控件
private var timer:Timer;
//这个变量用来配合时间控件
private var tempInt:int = 0;

/**
* 初始化
*/
private function InitApp():void
{
//初始化效果集合
this.effects.addItem(new WipeDown());
this.effects.addItem(new WipeLeft());
this.effects.addItem(new WipeRight());
this.effects.addItem(new WipeUp());
//this.Effects.addItem(new Blur()); //这个一般，效果不明显
this.effects.addItem(new Dissolve());
this.effects.addItem(new Fade());
//this.Effects.addItem(new Glow()); //只默认的情况下，没有较果
this.effects.addItem(new Iris());
//this.Effects.addItem(new Move()); //只默认的情况下，没有较果
//this.Effects.addItem(new Resize()); //只默认的情况下，没有较果
//this.Effects.addItem(new Rotate()); //旋转的，效果不是很好
this.effects.addItem(new Zoom());

//初始化图片集合
this.pictures.addItem("../images/1.jpg");
this.pictures.addItem("../images/2.jpg");
this.pictures.addItem("../images/3.jpg");
this.pictures.addItem("../images/4.jpg");
this.pictures.addItem("../images/5.jpg");
this.pictures.addItem("../images/6.jpg");
this.pictures.addItem("../images/7.jpg");
this.pictures.addItem("../images/8.jpg");

//初始化时间控件
this.timer = new Timer(2 * 1000 , 0.0);
//添加时间控件的计时事件
this.timer.addEventListener(TimerEvent.TIMER, OnTimerTick);
//启动时间控件
this.timer.start();

//this.imageUp.addEventListener(Event.COMPLETE
}

/**
* 时间控件事件方法
*/
private function OnTimerTick(event:TimerEvent):void
{
if(this.tempInt == 0)
{
//当TempInt为0时随机生成一个图片索引, 更新上层的图片
var ramdomNumber:Number=GetRandNumber(0, this.pictures.length - 1);
this.imageUp.source = this.pictures.getItemAt(ramdomNumber);
}
else
{
//计算下一张图应用的效果, 同时更新下层的图片与上层的图片相同
//这里为什么用两个Image原因是: 当用一个Image时,更新图片的过程中, 会出现闪烁
//两个Image,其中一个用来更新显示,另一个用来缓存上一次加载的图片
this.effectIndex = GetRandNumber(0, this.effects.length - 1);
this.imageDown.source = this.imageUp.source;
}
//计算下次时间控件循环时,tempInt的值, tempInt值为 0 或 1
this.tempInt = (this.tempInt + 1) % 2;
}

/**
* 获取指定范围内的随机数（包括最大值最小值）
*
* @param min 最小值
* @param max 最大值
*/
private function GetRandNumber(min:Number, max:Number):Number
{
var randNumber:Number = Math.floor(Math.random() * (max - min + 1)) + min;
return randNumber;
}
]]>
</mx:Script>
<mx:Image id="imageDown" width="640" height="480" source="../images/1.jpg"/>
<mx:Image id="imageUp" width="640" height="480" source="../images/1.jpg"
completeEffect="{this.effects.getItemAt(effectIndex)}"/>
</mx:Application>
版权：htpp://xingfustar.cnblogs.com
这里使用了两个Image， 其中ImageUp用来显示带效果的图片， IamgeDown作用是用来缓存上一张图片， 目的是防止用单一Image时图片更换时闪烁一下