임베디드 FLEX
글 수 19
2008.10.15 10:39:25 (*.105.125.81)
84390
TileList 컴포넌트를 mx 스크립트를 이용하여 ArrayCollection 데이터를 프로그램 시작초기에 생성하고 이후 타이머를 이용하여 20m 초 마다 랜덤함수를 이용하여 이미지를 재 설정한다.
소스 및 폼
<?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.controls.Image;
import mx.collections.ArrayCollection;
private const TIMER_INTERVAL:int = 20; // m sec 단위
[Bindable] private var tiledata : ArrayCollection;
private var tmTimer : Timer;
[Bindable] [Embed(source='image/black.png')] private var imgBlack:Class;
[Bindable] [Embed(source='image/red.png')] private var imgRed:Class;
[Bindable] [Embed(source='image/blue.png')] private var imgBlue:Class;
[Bindable] [Embed(source='image/green.png')] private var imgGreen:Class;
[Bindable] [Embed(source='image/white.png')] private var imgWhite:Class;
private function init():void {
tiledata = new ArrayCollection();
tiledata.addItem({image:imgBlack});
tiledata.addItem({image:imgRed} );
tiledata.addItem({image:imgBlue} );
tiledata.addItem({image:imgGreen});
tiledata.addItem({image:imgWhite});
tiledata.addItem({image:imgBlack});
tiledata.addItem({image:imgRed} );
tiledata.addItem({image:imgBlue} );
tiledata.addItem({image:imgGreen});
tlList.dataProvider=tiledata;
tmTimer = new Timer( TIMER_INTERVAL );
tmTimer.addEventListener(TimerEvent.TIMER, updateTimer);
tmTimer.start();
}
private function updateTimer(evt:TimerEvent):void {
var randomIndex : int;
var randomImage : int;
var obj:Object;
randomIndex = Math.round(Math.random() * (tiledata.length-1) );
randomImage = Math.round(Math.random() * 4 );
switch(randomImage)
{
case 0 : obj = {image:imgBlack}; break;
case 1 : obj = {image:imgRed}; break;
case 2 : obj = {image:imgBlue}; break;
case 3 : obj = {image:imgGreen}; break;
case 4 : obj = {image:imgWhite}; break;
}
tiledata.setItemAt( obj , randomIndex );
}
]]>
</mx:Script>
<mx:TileList id="tlList"
x="81" y="43" width="192" height="{192+2}"
maxColumns="3"
columnWidth="64" rowHeight="64"
paddingBottom="0" paddingLeft="0"
paddingRight="0" paddingTop="0"
>
<mx:itemRenderer>
<mx:Component>
<mx:Image source="{data.image}" />
</mx:Component>
</mx:itemRenderer>
</mx:TileList>
</mx:Application>
예제 실행



