保存Flex显示组件到本地图片文件
Flex中的任何显示对象都能保存为图片,下边提供一个图片工具类,包括获取图片流,和直接保存PNG图片到本地的方法。
package { import flash.display.BitmapData; import flash.net.FileReference; import flash.utils.ByteArray; import mx.controls.Alert; import mx.core.UIComponent; import mx.graphics.codec.PNGEncoder; public class ImageUtil { public static var Instance:ImageUtil=new ImageUtil(); public function ImageUtil() { } /** * 取得屏幕显示对象转换的ByteArray数据 * */ public static function getUIComponentByteArray(target:UIComponent):ByteArray { var imgByteArray:BitmapData = getUIComponentBitmapData(target); var encoder:PNGEncoder = new PNGEncoder(); var data:ByteArray = encoder.encode(imgByteArray); return data; } /** * 取得屏幕显示对象的BitmapData * */ public static function getUIComponentBitmapData(target:UIComponent):BitmapData { var bd:BitmapData = new BitmapData(target.width,target.height,true,0xffffff); bd.draw(target); return bd; } /** * 保存屏幕显示对象到图片(png) * */ public static function saveScreen(target:UIComponent, fileName:String):void { var imgByteArray:BitmapData = getUIComponentBitmapData(target); var fr:Object = new FileReference(); if(fr.hasOwnProperty("save")) { var encoder:PNGEncoder = new PNGEncoder(); var data:ByteArray = encoder.encode(imgByteArray); fr.save(data,fileName); } else { Alert.show("当前flash player版本不支持此功能,请安装10.0.0以上版本!","提示"); } } } }
获取BitmapData有两种方式,要连样式一起保存可修改方法中的代码:
不能够读取 style 设置的属性。
var bd:BitmapData = new BitmapData(target.width, target.height);
可以读取 style 设置的属性。
var bd:BitmapData = ImageSnapshot.captureBitmapData(target);
注意:在传入要保存的UIComponent组件时,保存的只是该组件以及其子组件的样式内容!
比如要保存一个窗口内部的一个图表为图片,图表本身是背景透明的,那么保存的图片里的图表背景就是透明的,不能够连窗口的底色一起保存。
如果要保存底色,就需要自己设置要保存的容器的背景色和透明度了。