Flex實(shí)現(xiàn)的上傳攝像頭拍照并將UI保存為圖片
更新時(shí)間:2014年05月02日 13:57:46 作者:
這篇文章主要介紹了Flex如何實(shí)現(xiàn)上傳攝像頭拍照并將UI保存為圖片,需要的朋友可以參考下
flex客戶端代碼:
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" creationComplete="application1_creationCompleteHandler(event)">
<fx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.core.UIComponent;
import mx.events.FlexEvent;
import mx.graphics.codec.JPEGEncoder;
import mx.rpc.events.FaultEvent;
import mx.rpc.events.ResultEvent;
import mx.utils.UIDUtil;
protected function application1_creationCompleteHandler(event:FlexEvent):void
{
initCamera(videoDis);
}
//初始化Camera控件,并添加在VideoDisplay
public function initCamera(videoDis:UIComponent):void
{
var myCamera:Camera = Camera.getCamera();//獲取客戶端攝像頭
myCamera.setMode(500,500,30);
var myVideo:Video = new Video(500,500);
myVideo.attachCamera(myCamera);//獲取攝像頭的視頻流
videoDis.addChild(myVideo);
}
//將可視的UIComponent組件轉(zhuǎn)換為圖片
public function UItoBitmap(source:UIComponent,target:UIComponent):void
{
var width :int = source.width;
var height :int = source.height;
var bitmapData:BitmapData =new BitmapData(width,height);
bitmapData.draw(source,new Matrix());
var bitmap:Bitmap=new Bitmap(bitmapData);
var uic:UIComponent = new UIComponent();
uic.addChild(bitmap);
target.addChild(uic);
}
//將可視的UIComponent組件保存為本地圖片
public function UISaveAsImg(imgID:UIComponent):void
{
var width :int = imgID.width;
var height :int = imgID.height;
var bitmapData:BitmapData =new BitmapData(width,height);
bitmapData.draw(imgID);
var byteArr:ByteArray = bitmapData.getPixels(new Rectangle(0,0,width,height));
var byteArr123:ByteArray =new JPEGEncoder().encodeByteArray(byteArr,width,height);
var fileRefer:FileReference = new FileReference();
fileRefer.save(byteArr123,UIDUtil.createUID()+".png");
fileRefer.addEventListener(Event.COMPLETE,function completeHandler():void{
Alert.show("保存本地成功");
});
}
//照片上傳到服務(wù)器
protected function upLoadImg(imgID:UIComponent):void
{
var width :int = imgID.width;
var height :int = imgID.height;
var bitmapData:BitmapData =new BitmapData(width,height);
bitmapData.draw(imgID);
var byteArr:ByteArray = bitmapData.getPixels(new Rectangle(0,0,width,height));
var byteArr123:ByteArray =new JPEGEncoder().encodeByteArray(byteArr,width,height);
webService.UploadFile(byteArr123,"123.png");
}
protected function webService_faultHandler(event:FaultEvent):void
{
Alert.show(event.fault.toString());
}
protected function webService_successHandler(event:ResultEvent):void
{
Alert.show(event.result.toString());
}
]]>
</fx:Script>
<fx:Declarations>
<!-- 將非可視元素(例如服務(wù)、值對(duì)象)放在此處 -->
<s:WebService id="webService" wsdl="http://10.19.1.48/upImg/Service1.asmx?WSDL" fault="webService_faultHandler(event)">
<s:operation name="UploadFile" result="webService_successHandler(event)"></s:operation>
</s:WebService>
</fx:Declarations>
<s:VideoDisplay id="videoDis" width="500" height="500" click="UItoBitmap(videoDis,t_img_Picture),UItoBitmap(videoDis,content)" toolTip="點(diǎn)擊拍照"></s:VideoDisplay>
<mx:DateChooser id="myDate" x="62" y="508" click="UItoBitmap(myDate,t_img_Picture),UItoBitmap(myDate,content)" toolTip="點(diǎn)擊拍照"/>
<mx:Image id="t_img_Picture" x="522" y="0" width="500" height="500" click="UISaveAsImg(t_img_Picture)" toolTip="點(diǎn)擊保存本地"/>
<mx:Canvas id="content" x="500" y="300" width="500" height="500" click="UISaveAsImg(content)" toolTip="點(diǎn)擊保存本地"></mx:Canvas>
<s:Button x="305" y="537" label="上傳" width="130" height="64" click="upLoadImg(t_img_Picture)"/>
</s:Application>
webservice代碼:
/// <summary>
/// 上傳文件到遠(yuǎn)程服務(wù)器
/// </summary>
/// <param name="fileBytes">文件流</param>
/// <param name="fileName">文件名</param>
/// <returns>字符串</returns>
[WebMethod(Description = "上傳文件到遠(yuǎn)程服務(wù)器.")]
public string UploadFile(byte[] fileBytes, string fileName)
{
try
{
MemoryStream memoryStream = new MemoryStream(fileBytes); //1.定義并實(shí)例化一個(gè)內(nèi)存流,以存放提交上來的字節(jié)數(shù)組。
FileStream fileUpload = new FileStream(Server.MapPath(".") + "\\" + fileName, FileMode.Create); ///2.定義實(shí)際文件對(duì)象,保存上載的文件。
memoryStream.WriteTo(fileUpload); ///3.把內(nèi)存流里的數(shù)據(jù)寫入物理文件
memoryStream.Close();
fileUpload.Close();
fileUpload = null;
memoryStream = null;
return "文件已成功上傳至服務(wù)器";
}
catch (Exception ex)
{
return ex.Message;
}
}
復(fù)制代碼 代碼如下:
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" creationComplete="application1_creationCompleteHandler(event)">
<fx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.core.UIComponent;
import mx.events.FlexEvent;
import mx.graphics.codec.JPEGEncoder;
import mx.rpc.events.FaultEvent;
import mx.rpc.events.ResultEvent;
import mx.utils.UIDUtil;
protected function application1_creationCompleteHandler(event:FlexEvent):void
{
initCamera(videoDis);
}
//初始化Camera控件,并添加在VideoDisplay
public function initCamera(videoDis:UIComponent):void
{
var myCamera:Camera = Camera.getCamera();//獲取客戶端攝像頭
myCamera.setMode(500,500,30);
var myVideo:Video = new Video(500,500);
myVideo.attachCamera(myCamera);//獲取攝像頭的視頻流
videoDis.addChild(myVideo);
}
//將可視的UIComponent組件轉(zhuǎn)換為圖片
public function UItoBitmap(source:UIComponent,target:UIComponent):void
{
var width :int = source.width;
var height :int = source.height;
var bitmapData:BitmapData =new BitmapData(width,height);
bitmapData.draw(source,new Matrix());
var bitmap:Bitmap=new Bitmap(bitmapData);
var uic:UIComponent = new UIComponent();
uic.addChild(bitmap);
target.addChild(uic);
}
//將可視的UIComponent組件保存為本地圖片
public function UISaveAsImg(imgID:UIComponent):void
{
var width :int = imgID.width;
var height :int = imgID.height;
var bitmapData:BitmapData =new BitmapData(width,height);
bitmapData.draw(imgID);
var byteArr:ByteArray = bitmapData.getPixels(new Rectangle(0,0,width,height));
var byteArr123:ByteArray =new JPEGEncoder().encodeByteArray(byteArr,width,height);
var fileRefer:FileReference = new FileReference();
fileRefer.save(byteArr123,UIDUtil.createUID()+".png");
fileRefer.addEventListener(Event.COMPLETE,function completeHandler():void{
Alert.show("保存本地成功");
});
}
//照片上傳到服務(wù)器
protected function upLoadImg(imgID:UIComponent):void
{
var width :int = imgID.width;
var height :int = imgID.height;
var bitmapData:BitmapData =new BitmapData(width,height);
bitmapData.draw(imgID);
var byteArr:ByteArray = bitmapData.getPixels(new Rectangle(0,0,width,height));
var byteArr123:ByteArray =new JPEGEncoder().encodeByteArray(byteArr,width,height);
webService.UploadFile(byteArr123,"123.png");
}
protected function webService_faultHandler(event:FaultEvent):void
{
Alert.show(event.fault.toString());
}
protected function webService_successHandler(event:ResultEvent):void
{
Alert.show(event.result.toString());
}
]]>
</fx:Script>
<fx:Declarations>
<!-- 將非可視元素(例如服務(wù)、值對(duì)象)放在此處 -->
<s:WebService id="webService" wsdl="http://10.19.1.48/upImg/Service1.asmx?WSDL" fault="webService_faultHandler(event)">
<s:operation name="UploadFile" result="webService_successHandler(event)"></s:operation>
</s:WebService>
</fx:Declarations>
<s:VideoDisplay id="videoDis" width="500" height="500" click="UItoBitmap(videoDis,t_img_Picture),UItoBitmap(videoDis,content)" toolTip="點(diǎn)擊拍照"></s:VideoDisplay>
<mx:DateChooser id="myDate" x="62" y="508" click="UItoBitmap(myDate,t_img_Picture),UItoBitmap(myDate,content)" toolTip="點(diǎn)擊拍照"/>
<mx:Image id="t_img_Picture" x="522" y="0" width="500" height="500" click="UISaveAsImg(t_img_Picture)" toolTip="點(diǎn)擊保存本地"/>
<mx:Canvas id="content" x="500" y="300" width="500" height="500" click="UISaveAsImg(content)" toolTip="點(diǎn)擊保存本地"></mx:Canvas>
<s:Button x="305" y="537" label="上傳" width="130" height="64" click="upLoadImg(t_img_Picture)"/>
</s:Application>
webservice代碼:
復(fù)制代碼 代碼如下:
/// <summary>
/// 上傳文件到遠(yuǎn)程服務(wù)器
/// </summary>
/// <param name="fileBytes">文件流</param>
/// <param name="fileName">文件名</param>
/// <returns>字符串</returns>
[WebMethod(Description = "上傳文件到遠(yuǎn)程服務(wù)器.")]
public string UploadFile(byte[] fileBytes, string fileName)
{
try
{
MemoryStream memoryStream = new MemoryStream(fileBytes); //1.定義并實(shí)例化一個(gè)內(nèi)存流,以存放提交上來的字節(jié)數(shù)組。
FileStream fileUpload = new FileStream(Server.MapPath(".") + "\\" + fileName, FileMode.Create); ///2.定義實(shí)際文件對(duì)象,保存上載的文件。
memoryStream.WriteTo(fileUpload); ///3.把內(nèi)存流里的數(shù)據(jù)寫入物理文件
memoryStream.Close();
fileUpload.Close();
fileUpload = null;
memoryStream = null;
return "文件已成功上傳至服務(wù)器";
}
catch (Exception ex)
{
return ex.Message;
}
}
相關(guān)文章
如何在Renderer中設(shè)置屬性 Renderer中設(shè)置屬性的方法實(shí)例
如何在Renderer中設(shè)置屬性 Renderer中設(shè)置屬性的方法實(shí)例,需要的朋友可以參考一下2013-06-06flex 開發(fā)項(xiàng)目報(bào)錯(cuò)之404錯(cuò)誤解決方案
最近兩天被HttpStates404這個(gè)錯(cuò)誤折騰的夠嗆,查了很多的文章都是大同小異,接下來為大家介紹下詳細(xì)的解決方法,感興趣的各位可以參考下哈,希望可以幫助到你2013-03-03FLEX給頁面添加滾動(dòng)條實(shí)現(xiàn)思路及代碼
給頁面添加滾動(dòng)條的方法有很多,使用js獲取瀏覽器窗口的寬高,根據(jù)瀏覽器窗口寬高修改樣式,讓滾動(dòng)條出現(xiàn),具體的實(shí)現(xiàn)如下,需要的朋友可以參考下2013-11-11flex壓縮圖片exif信息(作者/相機(jī))丟失問題解決
使用flex的jpegencoder對(duì)圖片進(jìn)行壓縮的時(shí)候,exif信息會(huì)丟失這一點(diǎn)確實(shí)令人郁悶啊,此問題應(yīng)當(dāng)如何解決呢?經(jīng)研究jpeg的文檔,最終解決這個(gè)問題,曬出來與大家分享希望可以幫助到你們2013-02-02flex的tree動(dòng)態(tài)加載大量數(shù)據(jù)與滾動(dòng)條相關(guān)問題探討
本文將對(duì)flex的tree動(dòng)態(tài)加載大量數(shù)據(jù)與滾動(dòng)條相關(guān)的問題進(jìn)行探討,感興趣的朋友可以參考下哈,希望對(duì)你有所幫助2013-05-05Flex上傳本地圖片并提前瀏覽的實(shí)現(xiàn)方法
個(gè)性頭像最終需要上傳到服務(wù)器的文件系統(tǒng)中,但是程序希望在用戶選擇后直接有個(gè)預(yù)覽,針對(duì)這個(gè)問題,下面有個(gè)不粗的實(shí)現(xiàn),希望對(duì)大家有所幫助2014-01-01