导出Flex组件为jpg图片
2011年03月10日
前几天看了lwz7512的 《基于servlet导出Flex/Flash界面为图形文件的简单方法》,今天有时间就实践了一下。
[b]1[/b].使用BitmapData将flex的某个UIComponent转换为ByteArray
[b]2[/b].使用JPGEncoder转换ByteArray。JPGEncoder是corelib(http://code.google.com/p/as3corelib/) 的组件。我直接导入corelib.swc却报错,幸好有源代码可以直接使用。
[b]3[/b].使用URLRequest发送ByteArray到服务端的java servlet
[b]4[/b].在servlet中使用ImageIO保存图片或者输出到response
下面是具体代码
actionscript 代码
[CDATA[ import mx.controls.Alert; import mx.core.UIComponent; import mx.collections.ArrayCollection; import com.adobe.images.JPGEncoder; [Bindable] public var expenses:ArrayCollection = new ArrayCollection( [ {Month:"Jan", Profit:2000, Expenses:1500}, {Month:"Feb", Profit:1000, Expenses:200}, {Month:"Mar", Profit:1500, Expenses:500} ] ); public function getJPGByteArray(target:UIComponent):ByteArray { var bitmapData : BitmapData = new BitmapData(target.width, target.height); bitmapData.draw(target); var jpg : JPGEncoder = new JPGEncoder(); var jpgByteArray : ByteArray = jpg.encode(bitmapData); return jpgByteArray; } public function sendImageByte(target:UIComponent):void { var request:URLRequest = new URLRequest("myImage"); request.contentType = 'applicatoin/octet-stream'; request.data = getJPGByteArray(target); request.method = URLRequestMethod.POST; navigateToURL(request, "_blank"); } ]]
这里使用了一个Bar Chart图表进行实验,URLRequest的myImage是我的java servlet
java 代码
[b]import[/b] java.awt.image.BufferedImage; [b]import[/b] javax.imageio.ImageIO; [b]import[/b] org.apache.commons.io.IOUtils; [b]public[/b] [b]class[/b] ImageServlet [b]extends[/b] HttpServlet { @Override [b]protected[/b] [b]void[/b] doGet(HttpServletRequest arg0, HttpServletResponse arg1) [b]throws[/b] ServletException, IOException { doService(arg0, arg1); } @Override [b]protected[/b] [b]void[/b] doPost(HttpServletRequest arg0, HttpServletResponse arg1) [b]throws[/b] ServletException, IOException { doService(arg0, arg1); } [b]private[/b] [b]void[/b] doService(HttpServletRequest request, HttpServletResponse response) [b]throws[/b] IOException { //saveImage(request, response); printImage(request, response); } [b]private[/b] [b]void[/b] saveImage(HttpServletRequest request, HttpServletResponse response) [b]throws[/b] IOException { String fileName = "D://" + System.currentTimeMillis() + ".jpg"; BufferedImage bufferedImage = ImageIO.read(request.getInputStream()); [b]if[/b] (bufferedImage != [b]null[/b]) { ImageIO.write(bufferedImage, "jpeg", [b]new[/b] File(fileName)); } } [b]private[/b] [b]void[/b] printImage(HttpServletRequest request, HttpServletResponse response) [b]throws[/b] IOException { response.setContentType("image/jpeg"); response.setHeader("Content-Length:", String.valueOf(request.getInputStream().available())); ServletOutputStream sos = response.getOutputStream(); IOUtils.copy(request.getInputStream(), sos); sos.flush(); sos.close(); } }
printImage将图形输出到response,将会在web浏览器中看到图片。或者你可以使用saveImage保存图片到服务器。
2011年03月10日
前几天看了lwz7512的 《基于servlet导出Flex/Flash界面为图形文件的简单方法》,今天有时间就实践了一下。
[b]1[/b].使用BitmapData将flex的某个UIComponent转换为ByteArray
[b]2[/b].使用JPGEncoder转换ByteArray。JPGEncoder是corelib(http://code.google.com/p/as3corelib/) 的组件。我直接导入corelib.swc却报错,幸好有源代码可以直接使用。
[b]3[/b].使用URLRequest发送ByteArray到服务端的java servlet
[b]4[/b].在servlet中使用ImageIO保存图片或者输出到response
下面是具体代码
actionscript 代码
[CDATA[ import mx.controls.Alert; import mx.core.UIComponent; import mx.collections.ArrayCollection; import com.adobe.images.JPGEncoder; [Bindable] public var expenses:ArrayCollection = new ArrayCollection( [ {Month:"Jan", Profit:2000, Expenses:1500}, {Month:"Feb", Profit:1000, Expenses:200}, {Month:"Mar", Profit:1500, Expenses:500} ] ); public function getJPGByteArray(target:UIComponent):ByteArray { var bitmapData : BitmapData = new BitmapData(target.width, target.height); bitmapData.draw(target); var jpg : JPGEncoder = new JPGEncoder(); var jpgByteArray : ByteArray = jpg.encode(bitmapData); return jpgByteArray; } public function sendImageByte(target:UIComponent):void { var request:URLRequest = new URLRequest("myImage"); request.contentType = 'applicatoin/octet-stream'; request.data = getJPGByteArray(target); request.method = URLRequestMethod.POST; navigateToURL(request, "_blank"); } ]]
这里使用了一个Bar Chart图表进行实验,URLRequest的myImage是我的java servlet
java 代码
[b]import[/b] java.awt.image.BufferedImage; [b]import[/b] javax.imageio.ImageIO; [b]import[/b] org.apache.commons.io.IOUtils; [b]public[/b] [b]class[/b] ImageServlet [b]extends[/b] HttpServlet { @Override [b]protected[/b] [b]void[/b] doGet(HttpServletRequest arg0, HttpServletResponse arg1) [b]throws[/b] ServletException, IOException { doService(arg0, arg1); } @Override [b]protected[/b] [b]void[/b] doPost(HttpServletRequest arg0, HttpServletResponse arg1) [b]throws[/b] ServletException, IOException { doService(arg0, arg1); } [b]private[/b] [b]void[/b] doService(HttpServletRequest request, HttpServletResponse response) [b]throws[/b] IOException { //saveImage(request, response); printImage(request, response); } [b]private[/b] [b]void[/b] saveImage(HttpServletRequest request, HttpServletResponse response) [b]throws[/b] IOException { String fileName = "D://" + System.currentTimeMillis() + ".jpg"; BufferedImage bufferedImage = ImageIO.read(request.getInputStream()); [b]if[/b] (bufferedImage != [b]null[/b]) { ImageIO.write(bufferedImage, "jpeg", [b]new[/b] File(fileName)); } } [b]private[/b] [b]void[/b] printImage(HttpServletRequest request, HttpServletResponse response) [b]throws[/b] IOException { response.setContentType("image/jpeg"); response.setHeader("Content-Length:", String.valueOf(request.getInputStream().available())); ServletOutputStream sos = response.getOutputStream(); IOUtils.copy(request.getInputStream(), sos); sos.flush(); sos.close(); } }
printImage将图形输出到response,将会在web浏览器中看到图片。或者你可以使用saveImage保存图片到服务器。