你的位置:首页 > 网页设计

[网页设计]HTML5+学习笔记2


// 拍照function getImage() {  outSet( "开始拍照:" );  var cmr = plus.camera.getCamera();  cmr.captureImage( function ( p ) {    outLine( "成功:"+p );    plus.io.resolveLocalFileSystemURL( p, function ( entry ) {      createItem( entry );    }, function ( e ) {      outLine( "读取拍照文件错误:"+e.message );    } );  }, function ( e ) {    outLine( "失败:"+e.message );  }, {filename:"_doc/camera/",index:1} );}

 

// 录像function getVideo() {  outSet( "开始录像:" );  var cmr = plus.camera.getCamera();  cmr.startVideoCapture( function ( p ) {    outLine( "成功:"+p );    plus.io.resolveLocalFileSystemURL( p, function( entry) {      createItem( entry );    }, function( e ) {      outLine( "读取录像文件错误:"+e.message );    } );  }, function( e ){    outLine( "失败:"+e.message );  }, {filename:"_doc/camera/",index:i} );}

 

 

 

camera

Camera模块管理设备的摄像头,可用于拍照、摄像操作,通过plus.camera获取摄像头管理对象。

方法:

  • getCamera: 获取摄像头管理对象

对象:

  • Camera: 摄像头对象
  • CameraOption: JSON对象,调用摄像头的参数
  • PopPosition: JSON对象,弹出拍照或摄像界面指示位置

回调方法:

  • CameraSuccessCallback: 调用摄像头操作成功回调
  • CameraErrorCallback: 摄像头操作失败回调

权限:

permissions

"Camera":{"description":"访问摄像头设备"}

getCamera

获取摄像头管理对象

Camera plus.camera.getCamera( index );

说明:

获取需要操作的摄像头对象,如果要进行拍照或摄像操作,需先通过此方法获取摄像头对象。

参数:

  • index: ( Number ) 可选 要获取摄像头的索引值
    指定要获取摄像头的索引值,1表示主摄像头,2表示辅摄像头。如果没有设置则使用系统默认主摄像头。

返回值:

Camera : 摄像头对象

平台支持:

  • Android - 2.2+ (支持)
  • iOS - 4.3+ (支持)

示例:

<!DOCTYPE html><html><head><metacharset="utf-8"><title>Camera Example</title><scripttype="text/javascript">// 扩展API加载完毕后调用onPlusReady回调函数 document.addEventListener("plusready", onPlusReady,false);var r =null;// 扩展API加载完毕,现在可以正常调用扩展API function onPlusReady(){// 获取设备默认的摄像头对象 var cmr = plus.camera.getCamera();// ...... }</script></head><body></body></html>

Camera

摄像头对象

interfaceCamera{readonly attribute DOMString[] supportedImageResolutions;readonly attribute DOMString[] supportedVideoResolutions;readonly attribute DOMString[] supportedImageFormats;readonly attribute DOMString[] supportedVideoFormats;functionvoid captureImage( successCB, errorCB, option );functionvoid startVideoCapture( successCB, errorCB, option );functionvoid stopVideoCapture();}

属性:

  • supportedImageResolutions: 字符串数组,摄像头支持的拍照分辨率
  • supportedVideoResolutions: 字符串数组,摄像头支持的摄像分辨率
  • supportedImageFormats: 字符串数组,摄像头支持的拍照文件格式
  • supportedVideoFormats: 字符串数组,摄像头支持的摄像文件格式

方法:

  • captureImage: 进行拍照操作
  • startVideoCapture: 调用摄像头进行摄像操作
  • stopVideoCapture: 结束摄像操作

supportedImageResolutions

字符串数组,摄像头支持的拍照分辨率

说明:

Array 类型 只读属性

属性类型为DOMString[],若不支持此属性则返回空数组对象。摄像头支持的拍照图片分辨率字符串形式“WIDTH*Height”,如“400*800”;如果支持任意自定义分辨率则“*”。

平台支持:

  • Android (支持)
  • iOS (不支持): 返回空数组对象

示例:

<!DOCTYPE html><html><head><metacharset="utf-8"><title>Camera Example</title><scripttype="text/javascript">// 扩展API加载完毕后调用onPlusReady回调函数 document.addEventListener("plusready", onPlusReady,false);// 扩展API加载完毕,现在可以正常调用扩展API function onPlusReady(){var cmr = plus.camera.getCamera();	alert("Camera supperted image resolutions: "+ cmr.supportedImageResolutions );}</script></head><body></body></html>

supportedVideoResolutions

字符串数组,摄像头支持的摄像分辨率

说明:

Array 类型 只读属性

属性类型为String[],若不支持此属性则返回空数组对象。摄像头支持的视频分辨率字符串形式为“WIDTH*Height”,如“400*800”;如果支持任意自定义分辨率则“*”。

平台支持:

  • Android (支持)
  • iOS (不支持): 返回空数组对象

示例:

<!DOCTYPE html><html><head><metacharset="utf-8"><title>Camera Example</title><scripttype="text/javascript">// 扩展API加载完毕后调用onPlusReady回调函数 document.addEventListener("plusready", onPlusReady,false);// 扩展API加载完毕,现在可以正常调用扩展API function onPlusReady(){var cmr = plus.camera.getCamera();	alert("Camera supperted image resolutions: "+ cmr.supportedImageResolutions );}</script></head><body></body></html>

supportedImageFormats

字符串数组,摄像头支持的拍照文件格式

说明:

Array 类型 只读属性

属性类型为String[],若不支持此属性则返回空数组对象。摄像头支持的图片文件格式字符串形式为文件格式后缀名,如“jpg”、“png”、“bmp”。

平台支持:

  • Android (支持)
  • iOS (不支持): 返回空数组对象

示例:

<!DOCTYPE html><html><head><metacharset="utf-8"><title>Camera Example</title><scripttype="text/javascript">// 扩展API加载完毕后调用onPlusReady回调函数 document.addEventListener("plusready", onPlusReady,false);// 扩展API加载完毕,现在可以正常调用扩展API function onPlusReady(){var cmr = plus.camera.getCamera();	alert("Camera supperted image formats: "+ cmr.supportedImageFormats );}</script></head><body></body></html>

supportedVideoFormats

字符串数组,摄像头支持的摄像文件格式

说明:

Array 类型 只读属性

属性类型为String[],若不支持此属性则返回空数组对象。摄像头支持的视频文件格式字符串形式为文件格式后缀名,如“3gp”、“mp4”、“avi”。

平台支持:

  • Android (支持)
  • iOS (不支持): 返回空数组对象

示例:

<!DOCTYPE html><html><head><metacharset="utf-8"><title>Camera Example</title><scripttype="text/javascript">// 扩展API加载完毕后调用onPlusReady回调函数 document.addEventListener("plusready", onPlusReady,false);// 扩展API加载完毕,现在可以正常调用扩展API function onPlusReady(){var cmr = plus.camera.getCamera();	alert("Camera supperted video formats: "+ cmr.supportedVideoFormats );}</script></head><body></body></html>

captureImage

进行拍照操作

cmr.captureImage( successCB, errorCB, option );

说明:

摄像头资源为独占资源,如果其它程序或页面已经占用摄像头,再次操作则失败。 拍照操作成功将通过successCB返回拍照获取的图片路径。 可通过option设置摄像头的各种属性参数。

参数:

  • successCB: ( CameraSuccessCallback ) 必选 拍照操作成功的回调函数
  • errorCB: ( CameraErrorCallback ) 可选 拍照操作失败的回调函数
  • option: ( CameraOption ) 必选 摄像头拍照参数

返回值:

void : 无

平台支持:

  • Android - 2.2+ (支持)
  • iOS - 4.3+ (支持)

示例:

<!DOCTYPE html><html><head><metacharset="utf-8"><title>Camera Example</title><scripttype="text/javascript">// 扩展API加载完毕后调用onPlusReady回调函数 document.addEventListener("plusready", onPlusReady,false);var r =null;// 扩展API加载完毕,现在可以正常调用扩展API function onPlusReady(){var cmr = plus.camera.getCamera();var res = cmr.supportedImageResolutions[0];var fmt = cmr.supportedImageFormats[0];	cmr.captureImage(function( path ){			alert("Capture image success: "+ path );},function( error ){			alert("Capture image failed: "+ error.message );},{resolution:res,			format:fmt		});}</script></head><body></body></html>

startVideoCapture

调用摄像头进行摄像操作

cmr.startVideoCapture( successCB, errorCB, option );

说明:

摄像头资源为独占资源,如果其它程序或页面已经占用摄像头,再次操作则失败。 拍照操作成功将通过successCB返回摄像获取的视频文件路径。 可通过option设置摄像头的各种属性参数。

参数:

  • successCB: ( CameraSuccessCallback ) 必选 摄像操作成功的回调函数
  • errorCB: ( CameraErrorCallback ) 可选 拍摄像操作失败的回调函数
  • option: ( CameraOption ) 必选 摄像头拍照参数

返回值:

void : 无

平台支持:

  • Android - 2.2+ (支持)
  • iOS - 4.3+ (支持)

示例:

<!DOCTYPE html><html><head><metacharset="utf-8"><title>Camera Example</title><scripttype="text/javascript">// 扩展API加载完毕后调用onPlusReady回调函数 document.addEventListener("plusready", onPlusReady,false);var r =null;// 扩展API加载完毕,现在可以正常调用扩展API function onPlusReady(){var cmr = plus.camera.getCamera();var res = cmr.supportedVideoResolutions[0];var fmt = cmr.supportedVideoFormats[0];	cmr.startVideoCapture(function( path ){			alert("Capture video success: "+ path );},function( error ){			alert("Capture video failed: "+ error.message );},{resolution:res,			format:fmt		});}</script></head><body></body></html>

stopVideoCapture

结束摄像操作

cmr.stopVideoCapture();

说明:

开始调用摄像头进行摄像操作后,可在后台结束摄像操作,与用户在界面结束操作效果一致。 摄像操作成功将通过startVideoCapture函数中的successCB返回拍照获取的图片路径。 用户如果没有进行摄像操作关闭摄像头页面则调用失败回调函数。

参数:

返回值:

void : 无

平台支持:

  • Android - 2.2+ (支持)
  • iOS - 4.3+ (支持)

示例:

<!DOCTYPE html><html><head><metacharset="utf-8"><title>Camera Example</title><scripttype="text/javascript">// 扩展API加载完毕后调用onPlusReady回调函数 document.addEventListener("plusready", onPlusReady,false);var r =null;// 扩展API加载完毕,现在可以正常调用扩展API function onPlusReady(){var cmr = plus.camera.getCamera();var res = cmr.supportedVideoResolutions[0];var fmt = cmr.supportedVideoFormats[0];	cmr.startVideoCapture(function( path ){			alert("Capture video success: "+ path );},function( error ){			alert("Capture video failed: "+ error.message );},{resolution:res,			format:fmt		});// 拍摄10s后自动完成 	setTimeout(function(){		cmr.stopVideoCapture();},10000);}</script></head><body></body></html>

CameraOption

JSON对象,调用摄像头的参数

interfaceCameraOption{	attribute String filename;	attribute String format;	attribute String index;	attribute PopPosition popover;}

属性:

  • filename: (DOMString 类型 )拍照或摄像文件保存的路径

    可设置具体文件名,也可只设置路径,如果以“/”结尾则表明是路径,如未设置文件名称或设置的文件名冲突则文件名由程序程序自动生成。

  • format: (DOMString 类型)拍照或摄像的文件格式

    可通过Camera对象的supportedImageFormats或supportedVideoFormats获取,如果设置的参数无效则使用系统默认值。

  • index: (DOMString 类型)拍照或摄像默认使用的摄像头

    拍照或摄像界面默认使用的摄像头编号,1表示主摄像头,2表示辅摄像头。

  • popover: (PopPosition 类型)拍照或摄像界面弹出指示区域

    对于大屏幕设备如iPad,拍照或摄像界面为弹出窗口,此时可通过此参数设置弹出窗口位置,其为JSON对象,格式如{top:10,left:10,width:200,height:200},默认弹出位置为屏幕居中。

PopPosition

JSON对象,弹出拍照或摄像界面指示位置

属性:

  • top: (DOMString 类型)指示区域距离容器顶部的距离

    弹出拍照或摄像窗口指示区域距离容器顶部的距离,支持像素值(如100px)和百分比(如50%)。

  • left: (DOMString 类型)指示区域距离容器左侧的距离

    弹出拍照或摄像窗口指示区域距离容器左侧的距离,支持像素值(如100px)和百分比(如50%)。

  • width: (DOMString 类型)指示区域的宽度

    弹出拍照或摄像窗口指示区域的宽度,支持像素值(如100px)和百分比(如50%)。

  • height: (DOMString 类型)指示区域的高度

    弹出拍照或摄像窗口指示区域的高度,支持像素值(如100px)和百分比(如50%)。

CameraSuccessCallback

调用摄像头操作成功回调

void onSuccess( capturedFile ){// Caputre image/video file code.}

说明:

调用摄像头操作成功的回调函数,在拍照或摄像操作成功时调用,用于返回图片或视频文件的路径。

参数:

  • capturedFile: ( DOMString ) 必选 拍照或摄像操作保存的文件路径

返回值:

void : 无

平台支持:

  • Android - 2.2+ (支持)
  • iOS - 4.3+ (支持)

CameraErrorCallback

摄像头操作失败回调

void onError( error ){// Handle camera error}

参数:

  • error: ( DOMException ) 必选 摄像头操作的错误信息

返回值:

void : 无

平台支持:

  • Android - 2.2+ (支持)
  • iOS - 4.3+ (支持)