Flex手机项目 - 调用摄像头拍照,并显示
作者:hangge | 2015-01-06 14:29
as3中,使用flash.media.CameraUI类,可以使用设备摄像头将图像加载到应用程序中,下面两个是该类重要的API功能:

1,CameraUI.isSupported:用于确定是否可以启用原生摄像头
2,CameraUI.launch():用于启动摄像头应用程序
下面是一个简单的demo,效果图如下:

代码如下:
<?xml version="1.0" encoding="utf-8"?>
<s:View xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
creationComplete="onCreationComplete()"
title="摄像头">
<fx:Script>
<![CDATA[
import flash.media.CameraUI;
private var cameraUI:CameraUI;
private var mediaLoader:Loader;
/**
* 页面初始化
*/
private function onCreationComplete():void
{
//判断是否支持摄像头
if (CameraUI.isSupported)
{
cameraUI = new CameraUI();
cameraUI.addEventListener(MediaEvent.COMPLETE, onComplete);
}
}
/**
* 打开摄像头
*/
private function launchCamera():void
{
if (CameraUI.isSupported)
{
cameraUI.launch(MediaType.IMAGE);
}
}
/**
* 拍照完毕响应函数
*/
private function onComplete(e:MediaEvent):void
{
var promiseObj:MediaPromise = e.data as MediaPromise;
//capturedImage.source = promiseObj.file.url;
//为什么不用, e.data.file得到一个File对象呢,因为只能在Android系统下工作,
//在IOS系统不工作,所以我们用MediaPromise,loadFilePromise得到图片.
mediaLoader = new Loader();
mediaLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, mediaPromisLoadHandler);
//加载照片
mediaLoader.loadFilePromise(promiseObj);
}
/**
* 照片加载完毕响应函数
*/
private function mediaPromisLoadHandler(e:Event):void{
mediaLoader.contentLoaderInfo.removeEventListener(Event.COMPLETE, mediaPromisLoadHandler);
var mediaLoaderInfo:LoaderInfo = e.target as LoaderInfo;
capturedImage.source = mediaLoaderInfo.loader;
capturedImage.width = this.width - 10;
capturedImage.height = this.height/2 - 10;
}
]]>
</fx:Script>
<s:layout>
<s:VerticalLayout paddingLeft="20" paddingRight="20" paddingBottom="20" paddingTop="20"/>
</s:layout>
<s:VGroup horizontalAlign="center" width="100%">
<s:Label id="description" text="拍照并在下方显示...." width="100%" height="25"/>
<s:Image id="capturedImage" backgroundColor="#000000"/>
<s:Button label="打开摄像头" click="launchCamera()" width="100%" height="75"/>
</s:VGroup>
</s:View>
全部评论(0)