前段时间flex项目用到了图片交互的,整理一下,以备忘记把!
FLEX3
FLEX3
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="created();">
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
[Bindable]
var images : ArrayCollection = new ArrayCollection();
var tickInterval : int;
private function created() : void
{
images.addItem("http://www.blogcdn.com/green.autoblog.com/media/2010/06/tesla-future-products.jpg");
images.addItem("http://www.blogcdn.com/www.autoblog.com/media/2010/06/lotuselisescrgbspecialedition-630.jpg");
images.addItem("http://www.blogcdn.com/www.autoblog.com/media/2010/06/mercedes-benz-sls-amg-e-cell-prototype-doors-open-2.jpg");
images.addItem("http://www.blogcdn.com/cn.autoblog.com/media/2010/06/coolshow.jpg");
images.addItem("http://www.blogcdn.com/www.autoblog.com/media/2010/06/dbs16-copy.jpg");
tickInterval = setInterval(changeImage, 5000);
viewstack1.selectedIndex = 0;
}
private function changeImage() : void
{
if (viewstack1.selectedIndex < viewstack1.getChildren().length - 1)
{
viewstack1.selectedIndex ++;
}
else
{
viewstack1.selectedIndex = 0;
}
}
]]>
</mx:Script>
<mx:Canvas>
<mx:ViewStack x="0" y="0" id="viewstack1" width="439" height="259">
<mx:Repeater id="stackRepeater" dataProvider="{images}">
<mx:Canvas label="{stackRepeater.currentIndex + 1}" width="100%" height="100%" showEffect="Fade" hideEffect="Fade">
<mx:Image source="{stackRepeater.currentItem}" width="439" height="259" horizontalAlign="center" verticalAlign="middle" />
</mx:Canvas>
</mx:Repeater>
</mx:ViewStack>
<mx:ToggleButtonBar bottom="0" dataProvider="viewstack1" right="0" styleName="rotator">
</mx:ToggleButtonBar>
</mx:Canvas>
</mx:Application>