imagelist.mxml

实现的一个小的相册用到了flex技术

<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%" creationComplete="init()" horizontalScrollPolicy="off" verticalScrollPolicy="off">
	<mx:Script>
		<![CDATA[
		import mx.collections.ArrayCollection;
		import album.vo.imageVO;
		import album.models.modelLocator;
		import album.events.albumEvent;
		import album.events.imageThumbEvent;
		import mx.managers.PopUpManager;
		
		private var _images:ArrayCollection;
		private var imageThumbs:Array;
		private var instance:modelLocator=modelLocator.getInstance();
		
		    [Bindable]
		    public function set images(arr:ArrayCollection):void
		    {
		    	_images=arr;
		    	createMap();
		    }
		    public function get images():ArrayCollection
		    {
		    	return _images;
		    }
			internal function init():void
			{
				imageHolder.tileHeight=100;
				imageHolder.tileWidth=100;
			}
			internal function createMap():void
			{
				removeMap();
				var totalNum:int= _images.length;
				imageThumbs=new Array(totalNum);
				for (var i:int=0;i<totalNum;i++)
				{
					var thumb:imageThumb=new imageThumb();
					thumb.image=_images.getItemAt(i) as imageVO;
					thumb.addEventListener(imageThumbEvent.DETAILS,showDetails);
					imageHolder.addChild(thumb);
					imageThumbs[i]=thumb;
				}
			}
			internal function removeMap():void
			{
				if (imageThumbs !=null)
				{
					for (var i:int;i<imageThumbs.length;i++)
					{
						var thumb:imageThumb=imageThumbs[i] as imageThumb;
						thumb.removeEventListener(imageThumbEvent.DETAILS,showDetails);
						imageHolder.removeChild(thumb);
					}
				}
			}
			internal function showDetails(event:imageThumbEvent):void
			{
				var newShow:imageShow=new imageShow();
				instance.selectedImage=event.image;
				PopUpManager.addPopUp(newShow,this,false);
				//newShow.image=instance.selectedImage;
			}
		]]>
	</mx:Script>
	<mx:Tile id="imageHolder" paddingLeft="10" paddingTop="10" paddingBottom="10" direction="horizontal" width="100%" height="100%" horizontalScrollPolicy="off" horizontalGap="8" verticalGap="8" right="0"/>
	
</mx:Canvas>