TIE绘制图形的文件保存实现

 

要求效果

1、点击绘图工具栏的文件保存按钮，会弹出一个页面显示用户绘制好的JPG格式的图像，而后用户可自行保存。

主要思想

1、将绘图板上的图形保存到一个位图图像中，这通过BitmapData类的draw()方法实现。

2、将位图数据编码成JPG图像，这通过mx.graphics.codec.JPEGEncoder类实现。

3、将jpg数据保存到ByteArray（字节数组）类型的对象中。

4、最关键的是这一步，新建一个HTTP请求，设置其url属性为处理图像数据的jsp页面地址；设置其data属性为上述的字节数组；设置其发送 数据的类型属性contentType为application/octet-stream；设置其发送方法为POST（因为GET方法不能发送二进制数 据）。

5、调用navigateToURL(request,"_blank")来在新窗口中打开目标jsp页面，此时后台已生成jpg文件，jsp文件接着调用response.sendRedirect()方法跳转到jpg文件的url地址。

存在的问题

navigateToURL在IE浏览器中不起作用，不过jpg文件一样能在后台生成。

上代码！

 

 

1. package  file
2. {
3.      import  flash.display.BitmapData; //用于存储位图数据
4.      import  flash.display.DisplayObject;
5.      import  flash.utils.ByteArray; //存储编码好的JPG位图字节
6.      import  flash.net.*; //flash网络相关功能
7.      import  mx.graphics.codec.JPEGEncoder; //重要：将位图数据压缩成JPG格式
8.     
9.     
11.     
12.      public   class  Export
13.     {
14.          //flash发送的jpg数据由这个jsp来处理
15.          private   static   const  UPLOAD_PAGE:String= "http://localhost:8080/upload.jsp" ;     
16.          public  function Export()
17.         {
18.              
19.         }
20.         
21.         
22.          public   static  function exportJpg(panel:DisplayObject): void   //以画板中的矢量图形为输入
23.         {
24.              //初始化一个大小跟画板一样的位图对象
25.             var bmpData:BitmapData =  new  BitmapData(panel.width, panel.height,  true ,  0x00FFFFFF );
26.              //将画板中的矢量图形绘制到位图对象中
27.             bmpData.draw(panel);
28.              //初始化一个JPG编码器
29.             var jpgEncoder:JPEGEncoder =  new  JPEGEncoder( 80 );
30.              //用JPG编码器对绘制好的位图编码，并将结果保存到一个字节数组中
31.             var imgByteArray:ByteArray = jpgEncoder.encode(bmpData);
32.             
33.              //初始化一个HTTP请求，将处理jpg图像的jsp页面作为其初始值
34.             var request:URLRequest =  new  URLRequest(UPLOAD_PAGE);
35.             
36.              //data值就为图片编码数据imgByteArray;
37.             request.data = imgByteArray;
38.              //注意！！只有POST方法可以携带二进制数据，GET方法不行！
39.             request.method = URLRequestMethod.POST;
40.              //这个是关键,内容类型必须是下面文件流形式;
41.             request.contentType =  "application/octet-stream" ;
42.             
43.              //在新窗口中打开处理图像的jsp页
44.             navigateToURL(request, "_blank" );
45.         }
46.     }
47. }

jsp页面代码

 

 

1. <%@ page contentType= "text/html; charset=utf-8"  language= "java" %>
2. <%@ page import= "java.util.*" %>
3. <%@ page import= "java.io.*" %>
4. <%
5. int  v;
6. long  mill = System.currentTimeMillis();
7. String filename = mill +  ".jpg" ;
8. //request.getRealPath方法用于获取该jsp在服务器上的文件系统绝对路径（不是http根目录！）
9. String filePath = request.getRealPath(filename);
10. //由request.getInputStream()实现JPG图像由flash到jsp的传递
11. BufferedInputStream inputStream =  new  BufferedInputStream(request.getInputStream());
12. //文件保存到跟jsp想同的目录下，当然这也是可以随业务更改的
13. FileOutputStream outputStream =  new  FileOutputStream( new  File(filePath));
15. //分配一个1024字节的缓冲区，将JPG数据写入输出文件
16. byte  [] bytes =  new   byte [1024];
17. while ((v=inputStream.read(bytes))>0){
18.     outputStream.write(bytes,0,v);
19. }
20. outputStream.close();
21. inputStream.close();
23. //将浏览器重定位到新生成的jpg图片的URL地址
24. response.sendRedirect( "http://localhost:8080/"  + filename);
25. %>