excel.as文件
package yes3d.utils { import flash.net.URLRequest; import flash.net.URLRequestMethod; import flash.net.navigateToURL; public class Execl { public function Execl() { } /** * 导出excel */ public function load(url:String,keyids:String,fields:):void { //用post方式发送数据 var urlStr:String=url+'?keyids='+keyids; var u:URLRequest = new URLRequest(urlStr); u.method = URLRequestMethod.POST; navigateToURL(u,"_self"); } }}
视图层sendExcel.mxml
服务端excel.php
header(”Content-type:application/vnd.ms-excel”);
header(”Content-Disposition:filename=”.date(’Y-m-d’,time()).”.xls”);
?>
$_REQUEST['keyid']
$_REQUEST['keyid']
完成，其实生成图片这种功能FLEX也是要通过服务端的。
昨天写了个FLEX导出EXCEL的例子，今天写一个FLEX导出图像的例子，其实原理一样，都是通过服务端进行。
注意把组件处理为图像的类库要下载下来，http://code.google.com/p/as3corelib/
flex把组件处理为图像字节流的类ExplortImage.as
package utils{import com.adobe.images.JPGEncoder;import flash.display.BitmapData;import flash.net.URLRequest;import flash.net.URLRequestMethod;import flash.net.navigateToURL;import flash.utils.ByteArray;import mx.core.UIComponent;public class ExportImage{public function ExportImage(){}/*** 把图像发送到服务端，转为图像输出*/public function sendImageByte(target:UIComponent,url:String):void{var request:URLRequest = new URLRequest(url);request.contentType = ‘applicatoin/octet-stream’;request.data = getJPGByteArray(target);request.method = URLRequestMethod.POST;navigateToURL(request, “_blank”);}/*** 把目标组件转换为图像数组*/private function getJPGByteArray(target:UIComponent):ByteArray{var bitmapData : BitmapData = new BitmapData(target.width, target.height);bitmapData.draw(target); var jpg : JPGEncoder = new JPGEncoder(80);var jpgByteArray : ByteArray = jpg.encode(bitmapData);return jpgByteArray;}}}
表现层自己随便写什么什么东西进去都行test.mxml吧
<?xml version=”1.0″ encoding=”utf-8″?>
<mx:TitleWindow xmlns:mx=”http://www.adobe.com/2006/mxml” layout=”absolute” width=”700″ height=”620″ showCloseButton=”true” close=”PopUpManager.removePopUp(this)”>
<mx:Script>
<![CDATA[
import utils.ExportImage;
private var exportImage:ExportImage=new ExportImage;
]]>
</mx:Script>
<mx:ViewStack x=”0″ y=”0″ id=”vs_chart” width=”100%” height=”100%” creationPolicy=”all”>
<mx:Canvas id=”cv_column” label=”柱型图” width=”100%” height=”100%”>
<mx:ColumnChart id=”ch_column” showDataTips=”true” top=”91″ right=”10″ bottom=”153″ left=”200″/>
<mx:Legend dataProvider=”{ch_column}” direction=”horizontal” x=”200″ y=”55″/>
<mx:Label x=”200″ y=”27″ text=”柱状图” id=”lb_imgInfo”/>
<mx:Label x=”325″ y=”27″ text=”开始时间：2008-03-14″ id=”lb_startTime”/>
<mx:Label x=”531″ y=”27″ text=”结束时间：2008-12-24″ id=”lb_endTime”/>
<mx:DataGrid id=”db_info” left=”10″ top=”438″ bottom=”0″ right=”10″/>
<mx:Button x=”482″ y=”55″ label=”导出图像” click=”exportImage.sendImageByte(cv_column,’http://192.168.0.114/exportImage.php’)”/>
<mx:Panel title=”数据来源” borderThicknessLeft=”1″ borderAlpha=”1″ borderThicknessRight=”1″ top=”91″ left=”10″ bottom=”183″ right=”502″ cornerRadius=”4″ layout=”absolute” backgroundAlpha=”1.0″>
<mx:Text id=”txt_dataCome” top=”10″ left=”10″ right=”10″ bottom=”10″/>
</mx:Panel>
</mx:Canvas>
<mx:Canvas id=”cv_pie” label=”饼型图” width=”100%” height=”100%”>
<mx:PieChart id=”ch_pie” showDataTips=”true” left=”10″ top=”48″ right=”10″ bottom=”138″>
<mx:series>
<mx:PieSeries nameField=”xaxis” field=”value”/>
</mx:series>
</mx:PieChart>
<mx:Legend id=”le_pie” dataProvider=”{ch_pie}” x=”10″ y=”48″/>
<mx:Panel layout=”absolute” title=”数据来源” top=”462″ left=”10″ right=”10″ bottom=”10″>
<mx:Text x=”10″ y=”10″ id=”txt_pieDataCome”/>
</mx:Panel>
<mx:Label x=”24″ y=”19″ text=”饼状图” id=”lb_pieImgInfo”/>
<mx:Label x=”208″ y=”19″ text=”开始时间：2008-03-14″ id=”lb_pieStartTime”/>
<mx:Label x=”364″ y=”19″ text=”结束时间：2008-12-24″ id=”lb_pieEndTime”/>
<mx:Button x=”534″ y=”17″ label=”导出图像” click=”exportImage.sendImageByte(cv_pie,’http://192.168.0.114/exportImage.php’)”/>
</mx:Canvas>
</mx:ViewStack>
</mx:TitleWindow>
下面就是服务端的代码了，非常简单，是把FLEX发过来的数据转为图像输出。
<?php
if (isset($GLOBALS["HTTP_RAW_POST_DATA"])) {
$jpg = $GLOBALS["HTTP_RAW_POST_DATA"];
header('Content-Type: image/jpeg');
header("Content-Disposition: attachment; filename=".time().".jpg");
echo $jpg;
}
?>
本文来源于 冰山上的播客 http://xinsync.xju.edu.cn , 原文地址：http://xinsync.xju.edu.cn/index.php/archives/4148
相关资源：flex 导出excel工具
