前幾天看了lwz7512的 《
基于servlet導出Flex/Flash界面為圖形文件的簡單方法
》，今天有時間就實踐了一下。
1 .使用BitmapData將flex的某個UIComponent轉換為ByteArray
2 .使用JPGEncoder轉換ByteArray。JPGEncoder是corelib( http://code.google.com/p/as3corelib/ ) 的組件。我直接導入corelib.swc卻報錯，幸好有源代碼可以直接使用。
3 .使用URLRequest發送ByteArray到服務端的java servlet
4 .在servlet中使用ImageIO保存圖片或者輸出到response
下面是具體代碼
這里使用了一個Bar Chart圖表進行實驗，URLRequest的myImage是我的java servlet
printImage將圖形輸出到response，將會在web瀏覽器中看到圖片。或者你可以使用saveImage保存圖片到服務器。
1 .使用BitmapData將flex的某個UIComponent轉換為ByteArray
2 .使用JPGEncoder轉換ByteArray。JPGEncoder是corelib( http://code.google.com/p/as3corelib/ ) 的組件。我直接導入corelib.swc卻報錯，幸好有源代碼可以直接使用。
3 .使用URLRequest發送ByteArray到服務端的java servlet
4 .在servlet中使用ImageIO保存圖片或者輸出到response
下面是具體代碼
actionscript 代碼
- < mx:Application ???
- ???? xmlns:mx = "http://www.adobe.com/2006/mxml" ???
- ???? layout = "absolute" > ??
- ??
- ???? < mx:Script > ??
- ????????[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");??
- ????????????}??
- ????????]]??
- ???? </ mx:Script > ??
- ??
- ???? < mx:Panel ? id = "chartPanel" ? title = "Bar?Chart" ? width = "300" ? height = "400" > ??
- ????? < mx:BarChart ? id = "myChart" ? dataProvider = "{expenses}" ? width = "100%" ? height = "100%" > ??
- ???????? < mx:verticalAxis > ??
- ??????????? < mx:CategoryAxis ???
- ???????????????? dataProvider = "{expenses}" ???
- ???????????????? categoryField = "Month" ??
- ??????????? /> ??
- ???????? </ mx:verticalAxis > ??
- ???????? < mx:series > ??
- ??????????? < mx:BarSeries ???
- ???????????????? yField = "Month" ???
- ???????????????? xField = "Profit" ???
- ???????????????? displayName = "Profit" ??
- ??????????? /> ??
- ??????????? < mx:BarSeries ???
- ???????????????? yField = "Month" ???
- ???????????????? xField = "Expenses" ???
- ???????????????? displayName = "Expenses" ??
- ??????????? /> ??
- ???????? </ mx:series > ??
- ????? </ mx:BarChart > ??
- ????? < mx:Legend ? dataProvider = "{myChart}" /> ??
- ????? < mx:Button ? label = "Get?Chart?Image" ? click = "sendImageByte(myChart)" /> ??
- ????? < mx:Button ? label = "Get?Panel?Image" ? click = "sendImageByte(chartPanel)" /> ??
- ???? </ mx:Panel > ??
- ??????
- </ mx:Application > ??
這里使用了一個Bar Chart圖表進行實驗，URLRequest的myImage是我的java servlet
java 代碼
- import ?java.awt.image.BufferedImage;??
- import ?javax.imageio.ImageIO;??
- import ?org.apache.commons.io.IOUtils;??
- ??
- public ? class ?ImageServlet? extends ?HttpServlet?{??
- ??????
- ???? @Override ??
- ???? protected ? void ?doGet(HttpServletRequest?arg0,?HttpServletResponse?arg1)? throws ?ServletException,?IOException?{??
- ????????doService(arg0,?arg1);??
- ????}??
- ??
- ???? @Override ??
- ???? protected ? void ?doPost(HttpServletRequest?arg0,?HttpServletResponse?arg1)? throws ?ServletException,?IOException?{??
- ????????doService(arg0,?arg1);??
- ????}??
- ??
- ???? private ? void ?doService(HttpServletRequest?request,?HttpServletResponse?response)? throws ?IOException?{??
- ???????? //saveImage(request,?response); ??
- ????????printImage(request,?response);??
- ????}??
- ??????
- ???? private ? void ?saveImage(HttpServletRequest?request,?HttpServletResponse?response)? throws ?IOException??{??
- ????????String?fileName?=? "D://" ?+?System.currentTimeMillis()?+? ".jpg" ;??
- ????????BufferedImage?bufferedImage?=?ImageIO.read(request.getInputStream());??
- ???????? if ?(bufferedImage?!=? null )?{??
- ????????????ImageIO.write(bufferedImage,? "jpeg" ,? new ?File(fileName));??
- ????????}??
- ????}??
- ??????
- ???? private ? void ?printImage(HttpServletRequest?request,?HttpServletResponse?response)? throws ?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保存圖片到服務器。
更多文章、技術交流、商務合作、聯系博主
微信掃碼或搜索：z360901061
微信掃一掃加我為好友
QQ號聯系： 360901061
您的支持是博主寫作最大的動力，如果您喜歡我的文章，感覺我的文章對您有幫助，請用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧，狠狠點擊下面給點支持吧，站長非常感激您！手機微信長按不能支付解決辦法：請將微信支付二維碼保存到相冊，切換到微信，然后點擊微信右上角掃一掃功能，選擇支付二維碼完成支付。
【本文對您有幫助就好】元
