2、 Flex中Image控件相关之（FileReference.save()）保存图像到硬盘

Flex中Image控件相关之（FileReference.save()）保存图像到硬盘

相关类：文件的保存FileReference.save()，组件的截屏BitmapData 类

上代码

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
			   xmlns:s="library://ns.adobe.com/flex/spark" 
			   xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
	<fx:Declarations>
	</fx:Declarations>
	
	<fx:Script>
		<![CDATA[
			import comp.util.ImageProcessUtil;
			
			import mx.controls.Alert;
			import mx.core.UIComponent;
			import mx.graphics.codec.JPEGEncoder;
			import mx.utils.UIDUtil;
			private var fileRefer:FileReference = new FileReference();
			private var byteArr:ByteArray ;
			private function saveComp(mycomp:UIComponent):void{
				byteArr = ImageProcessUtil.BitmapDataToByteArray(mycomp);
				var width:Number = mycomp.width;
				var height:Number = mycomp.height;
				byteArr =new JPEGEncoder().encodeByteArray(byteArr,width,height);
				fileRefer.save(byteArr,UIDUtil.createUID()+".png");
				fileRefer.addEventListener(Event.COMPLETE,completeHandler);
			}
			
			private function completeHandler(event:Event):void{
				Alert.show("打印成功");
			}
		]]>
	</fx:Script>
	
	<mx:Image id="myImage" x="10" y="10" width="336" height="294" source="assets/images/map.jpg" maintainAspectRatio="false" scaleContent="true"
			  />
	<mx:AdvancedDataGrid id="myGrid" x="368" y="10" width="313" height="294" designViewDataType="tree">
		<mx:columns>
			<mx:AdvancedDataGridColumn dataField="col1" headerText="列 1"/>
			<mx:AdvancedDataGridColumn dataField="col2" headerText="列 2"/>
			<mx:AdvancedDataGridColumn dataField="col3" headerText="列 3"/>
		</mx:columns>
	</mx:AdvancedDataGrid>
	<s:Button id="btn_grid" x="368" y="327" label="将AdvancedDataGrid截图保存" click="saveComp(myGrid)"/>
	<s:Button id="btn_up" x="10" y="327" label="将上图截图保存" click="saveComp(myImage)"/>
</s:Application>

 

package comp.util
{
	import flash.display.Bitmap;
	import flash.display.BitmapData;
	import flash.geom.Rectangle;
	import flash.utils.ByteArray;
	
	import mx.core.UIComponent;

	public class ImageProcessUtil
	{
		public function ImageProcessUtil()
		{
		}
		
		//将可视的UIComponent组件转换为ByteArray
		public static function BitmapDataToByteArray(target : UIComponent):ByteArray{
			var width :int = target.width;
			var height :int = target.height;
			var bitmapData:BitmapData = UIComponentToBitmapData(target);
			var byteArr:ByteArray = bitmapData.getPixels(new Rectangle(0,0,width,height));
			byteArr.writeShort(width);
			byteArr.writeShort(height);
			return byteArr;
		}
		
		//将可视的UIComponent组件转换为图片
		public static function UIComponentToBitmapData(target : UIComponent):BitmapData{
			var width :int = target.width;
			var height :int = target.height;
			var bitmapData:BitmapData =new BitmapData(width,height);
			bitmapData.draw(target);
			return bitmapData;
		}
		
		//将ByteArray转为bitMap
		public static function ByteArrayToBitmap(byteArr:ByteArray):Bitmap{ 
			byteArr.position = byteArr.length -2;
			var height:int = byteArr.readShort();
			byteArr.position = byteArr.length -4;
			var width:int = byteArr.readShort();
			var bitmapData:BitmapData = new BitmapData(width,height);
			byteArr.position = 0;
			for(var i:int = 0;i<height;i++){
				for(var j:int = 0;j<width;j++){
					bitmapData.setPixel(j,i,byteArr.readUnsignedInt());
				}
			}
			
			var bitMap:Bitmap = new Bitmap(bitmapData);
			return bitMap;
		}
	}
}