html5中呼叫攝像頭拍照
方法:
getCamera: 獲取攝像頭管理物件
物件:
Camera: 攝像頭物件
CameraOption: JSON物件,呼叫攝像頭的引數
PopPosition: JSON物件,彈出拍照或攝像介面指示位置
回撥方法:
CameraSuccessCallback: 呼叫攝像頭操作成功回撥
CameraErrorCallback: 攝像頭操作失敗回撥
許可權:
功能模組(permissions)
{
// ...
"permissions":{
// ...
"Camera": {
"description" : "攝像頭"
}
}
}
getCamera
獲取攝像頭管理物件
Camera plus.camera.getCamera( index );
說明:
獲取需要操作的攝像頭物件,如果要進行拍照或攝像操作,需先通過此方法獲取攝像頭物件。
引數:
index: ( Number ) 可選 要獲取攝像頭的索引值
指定要獲取攝像頭的索引值,1表示主攝像頭,2表示輔攝像頭。如果沒有設定則使用系統預設主攝像頭。
返回值:
Camera : 攝像頭物件
平臺支援:
Android - 2.2+ (支援)
iOS - 4.3+ (支援)
示例:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Camera Example</title>
<script type="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
攝像頭物件
interface Camera {
readonly attribute String[] supportedImageResolutions;
readonly attribute String[] supportedVideoResolutions;
readonly attribute String[] supportedImageFormats;
readonly attribute String[] supportedVideoFormats;
function void captureImage( successCB, errorCB, option );
function void startVideoCapture( successCB, errorCB, option );
function void stopVideoCapture();
}
屬性:
supportedImageResolutions: 字串陣列,攝像頭支援的拍照解析度
supportedVideoResolutions: 字串陣列,攝像頭支援的攝像解析度
supportedImageFormats: 字串陣列,攝像頭支援的拍照檔案格式
supportedVideoFormats: 字串陣列,攝像頭支援的攝像檔案格式
方法:
captureImage: 進行拍照操作
startVideoCapture: 呼叫攝像頭進行攝像操作
stopVideoCapture: 結束攝像操作
supportedImageResolutions
字串陣列,攝像頭支援的拍照解析度
說明:
Array 型別 只讀屬性
屬性型別為String[],若不支援此屬性則返回空陣列物件。攝像頭支援的拍照圖片解析度字串形式“WIDTH*Height”,如“400*800”;如果支援任意自定義解析度則“*”。
平臺支援:
Android (支援)
iOS (不支援): 返回空陣列物件
示例:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Camera Example</title>
<script type="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>
<meta charset="utf-8">
<title>Camera Example</title>
<script type="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>
<meta charset="utf-8">
<title>Camera Example</title>
<script type="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>
<meta charset="utf-8">
<title>Camera Example</title>
<script type="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>
<meta charset="utf-8">
<title>Camera Example</title>
<script type="text/javascript">
// 擴充套件API載入完畢後呼叫onPlusReady回撥函式
document.addEventListener( "plusready", onPlusReady, false );
// 擴充套件API載入完畢,現在可以正常呼叫擴充套件API
function onPlusReady() {
console.log("plusready");
}
// 拍照
function captureImage(){
var cmr = plus.camera.getCamera();
var res = cmr.supportedImageResolutions[0];
var fmt = cmr.supportedImageFormats[0];
console.log("Resolution: "+res+", Format: "+fmt);
cmr.captureImage( function( path ){
alert( "Capture image success: " + path );
},
function( error ) {
alert( "Capture image failed: " + error.message );
},
{resolution:res,format:fmt}
);
}
</script>
</head>
<body>
<button onclick="captureImage()">拍照</button>
</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>
<meta charset="utf-8">
<title>Camera Example</title>
<script type="text/javascript">
// 擴充套件API載入完畢後呼叫onPlusReady回撥函式
document.addEventListener( "plusready", onPlusReady, false );
// 擴充套件API載入完畢,現在可以正常呼叫擴充套件API
function onPlusReady() {
console.log("plusready");
}
// 攝像
function videoCapture(){
var cmr = plus.camera.getCamera();
var res = cmr.supportedVideoResolutions[0];
var fmt = cmr.supportedVideoFormats[0];
console.log("Resolution: "+res+", Format: "+fmt);
cmr.startVideoCapture( function( path ){
alert( "Capture video success: " + path );
},
function( error ) {
alert( "Capture video failed: " + error.message );
},
{resolution:res,format:fmt}
);
}
</script>
</head>
<body>
<button onclick="videoCapture()">攝像</button>
</body>
</html>
stopVideoCapture
結束攝像操作
cmr.stopVideoCapture();
說明:
開始呼叫攝像頭進行攝像操作後,可在後臺結束攝像操作,與使用者在介面結束操作效果一致。 攝像操作成功將通過startVideoCapture函式中的successCB返回拍照獲取的圖片路徑。 使用者如果沒有進行攝像操作關閉攝像頭頁面則呼叫失敗回撥函式。
引數:
返回值:
void : 無
平臺支援:
Android - ALL (不支援): 暫不支援呼叫此API停止攝像,需要手動操作停止。
iOS - ALL (不支援): 暫不支援呼叫此API停止攝像,需要手動操作停止。
示例:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Camera Example</title>
<script type="text/javascript">
// 擴充套件API載入完畢後呼叫onPlusReady回撥函式
document.addEventListener( "plusready", onPlusReady, false );
// 擴充套件API載入完畢,現在可以正常呼叫擴充套件API
function onPlusReady() {
console.log("plusready");
}
var cmr=null;
// 攝像
function videoCapture(){
cmr = plus.camera.getCamera();
var res = cmr.supportedVideoResolutions[0];
var fmt = cmr.supportedVideoFormats[0];
console.log("Resolution: "+res+", Format: "+fmt);
cmr.startVideoCapture( function( path ){
alert( "Capture video success: " + path );
},
function( error ) {
alert( "Capture video failed: " + error.message );
},
{resolution:res,format:fmt}
);
// 拍攝10s後自動完成
setTimeout( stopCapture, 10000 );
}
// 停止攝像
function stopCapture(){
console.log("stopCapture");
cmr.stopVideoCapture();
}
</script>
</head>
<body>
<button onclick="videoCapture()">攝像</button><br/>
<button onclick="stopCapture()">停止攝像</button>
</body>
</html>
CameraOption
JSON物件,呼叫攝像頭的引數
interface CameraOption {
attribute String filename;
attribute String format;
attribute String index;
attribute PopPosition popover;
}
屬性:
filename: (String 型別 )拍照或攝像檔案儲存的路徑
可設定具體檔名(如"_doc/camera/a.jpg");也可只設置路徑,以"/"結尾則表明是路徑(如"_doc/camera/")。如未設定檔名稱或設定的檔名衝突則檔名由程式程式自動生成。 format: (String 型別 )拍照或攝像的檔案格式 可通過Camera物件的supportedImageFormats或supportedVideoFormats獲取,如果設定的引數無效則使用系統預設值。 index: (String 型別 )拍照或攝像預設使用的攝像頭 拍照或攝像介面預設使用的攝像頭編號,1表示主攝像頭,2表示輔攝像頭。
平臺支援
Android - 2.2+ (不支援): 暫不支援設定攝像頭,忽略此屬性值
iOS - 4.3+ (支援)
popover: (PopPosition 型別 )拍照或攝像介面彈出指示區域
對於大螢幕裝置如iPad,拍照或攝像介面為彈出視窗,此時可通過此引數設定彈出視窗位置,其為JSON物件,格式如{top:"10px",left:"10px",width:"200px",height:"200px"},預設彈出位置為螢幕居中。
平臺支援
Android - ALL (不支援): 暫不支援設定攝像頭,忽略此屬性值
iOS - 5.0+ (支援): 僅iPad裝置支援此屬性,iPhone/iTouch上忽略此屬性值
PopPosition
JSON物件,彈出拍照或攝像介面指示位置
屬性:
top: (String 型別 )指示區域距離容器頂部的距離
彈出拍照或攝像視窗指示區域距離容器頂部的距離,支援畫素值(如"100px")和百分比(如"50%")。
left: (String 型別 )指示區域距離容器左側的距離
彈出拍照或攝像視窗指示區域距離容器左側的距離,支援畫素值(如"100px")和百分比(如"50%")。
width: (String 型別 )指示區域的寬度
彈出拍照或攝像視窗指示區域的寬度,支援畫素值(如"100px")和百分比(如"50%")。
height: (String 型別 )指示區域的高度
彈出拍照或攝像視窗指示區域的高度,支援畫素值(如"100px")和百分比(如"50%")。
CameraSuccessCallback
呼叫攝像頭操作成功回撥
void onSuccess( capturedFile ) {
// Caputre image/video file code.
}
說明:
呼叫攝像頭操作成功的回撥函式,在拍照或攝像操作成功時呼叫,用於返回圖片或視訊檔案的路徑。
引數:
capturedFile: ( String ) 必選 拍照或攝像操作儲存的檔案路徑
返回值:
void : 無
平臺支援:
Android - 2.2+ (支援)
iOS - 4.3+ (支援)
CameraErrorCallback
攝像頭操作失敗回撥
void onError( error ) {
// Handle camera error
var code = error.code; // 錯誤編碼
var message = error.message; // 錯誤描述資訊
}
引數:
error: ( Exception ) 必選 攝像頭操作的錯誤資訊
可通過error.code(Number型別)獲取錯誤編碼; 可通過error.message(String型別)獲取錯誤描述資訊。
返回值:
void : 無
平臺支援:
Android - 2.2+ (支援)
iOS - 4.3+ (支援)