Flex 显示数据库二进制流图片

在很多应用中，显示数据库中的二进制图片是很必要的，在Flex中同样能实现这个功能。

首先自定义ByteArrayImage类 --用来加载二进制数据的图片类

package BaseUI
{
	import flash.display.Loader;
	import flash.events.Event;
	import flash.events.IOErrorEvent;
	import flash.system.LoaderContext;
	import flash.utils.ByteArray;
	
	import mx.controls.Alert;
	import mx.controls.Image;
	
	public class ByteArrayImage extends mx.controls.Image
	{
		private var _loader:Loader = new Loader();
		private var _bFillUp:Boolean = false;  //是/否平铺
		public function Image():void {}
		override protected function createChildren():void
		{
			addChild(_loader);
		}
		
		public function get bFillUp():Boolean{
			return _bFillUp;
		}
		
		public function set bFillUp(value:Boolean):void{
			this._bFillUp = value;
		}
		
		public function loadBytes(bytes:ByteArray,context:LoaderContext=null):void
		{
			try
			{
				_loader.loadBytes(bytes);
				_loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onBytesLoaded);
				_loader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR,onError);
			}catch(e:Error)
			{
				Alert.show("该类型的文件不支持预览！");
			}

		}
		
		
		private function onError(event:IOErrorEvent):void
		{
			Alert.show("该类型的文件不支持预览！");
		}
		
		private function onBytesLoaded(e:Event):void
		{
			if(_bFillUp)
			{
				_loader.width = this.width;
				_loader.height = this.height; 
			}		
		}
		
		public function SetWidth(newWidth:Number):void{
			this.width = newWidth;
			this._loader.width = this.width;         
		}        
		
	}
	
}

在.net中，二进制数据读出来之后就是byte[]类型，而Flex的二进制类型是ByteArray，所以需要先通过AMF3协议将byte[] 转换成ByteArray

(AMF是Adobe独家开发出来的通信协议，它采用二进制压缩，序列化、反序列化、传输数据，从而为Flash 播放器与Flash Remoting网关通信提供了一种轻量级的、高效能的通信方式)

这里我使用了FluorineFx框架，所以直接转换就可以了。 

 

         DataSet ds;
            Torrents.BLL.EN_Wlgdsc_b wlgBIL = new Torrents.BLL.EN_Wlgdsc_b();
            ds =wlgBIL.GetWaterloggAtt(wlgid);   //图片数据已经存放在dataset中
            DataColumn dc = null;
            dc = ds.Tables[0].Columns.Add("img",typeof(ByteArray));//给ds的table新增一列 用来存放ByteArray类型的图片
            

            foreach (DataRow dr in ds.Tables[0].Rows)
            {
                byte[] bytes = (byte[])dr["docmsg"];//这里即是byte[]的图片
                ByteArray byteArr = new ByteArray();//转换过程
                byteArr.WriteBytes(bytes, 0, bytes.Length);
                dr["img"] = byteArr;
                dr["docmsg"] = null;//清空用不着的byte[]
            }

            return ds.Tables[0];

 

最后在Flex客户端需要显示图片的地方加载ByteArray即可

我这里是在双击DataGrid的时候显示该行数据包含的图片

 

private function onDGClick(event:Event):void
{
        var index:Object=dg.selectedItem
        var byteData:ByteArray=index["img"] as ByteArray;

            byteImage.loadBytes(byteData);               
}

最后需要注意的是Flex 、Flash不支持bmp图片，不过可以以二进制的形式，把图片从后台加载到前台，然后通过bmp本身的格式进行解析，解析成为Flash认识的格式（BitMapData） 网上有这方面的资料，这里就不再说了。

效果图