
임베디드 FLEX
글 수 19
2008.10.15 10:39:25 (*.105.125.81)
84375
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>
예제 실행