PhoneGap API介紹:Camera
方法:
參數(shù):
選擇使用攝像頭拍照,或從設(shè)備相冊(cè)中獲取一張照片。圖片以base64編碼的字符串或圖片URI形式返回。
簡(jiǎn)單的范例:
- navigator.camera.getPicture( cameraSuccess, cameraError, [ cameraOptions ] );
說(shuō)明:
camera.getPicture函數(shù)打開(kāi)設(shè)備的默認(rèn)攝像頭應(yīng)用程序,使用戶(hù)可以拍照(如果 Camera.sourceType 設(shè)置為 Camera.PictureSourceType.CAMERA,這也是默認(rèn)值)。一旦拍照結(jié)束,攝像頭應(yīng)用程序會(huì)關(guān)閉并恢復(fù)用戶(hù)應(yīng)用程序。
如果Camera.sourceType = Camera.PictureSourceType.PHOTOLIBRARY或Camera.PictureSourceType.SAVEDPHOTOALBUM,系統(tǒng)彈出照片選擇對(duì)話(huà)框,用戶(hù)可以從相集中選擇照片。
返回值會(huì)按照用戶(hù)通過(guò)cameraOptions參數(shù)所設(shè)定的下列格式之一發(fā)送給cameraSuccess回調(diào)函數(shù):
一個(gè)字符串,包含Base64編碼的照片圖像(默認(rèn)情況)。
一個(gè)字符串,表示在本地存儲(chǔ)的圖像文件位置。
你可以對(duì)編碼的圖片或URI做任何處理,例如:
通過(guò)標(biāo)簽渲染圖片(參看后續(xù)范例)
存儲(chǔ)為本地?cái)?shù)據(jù)(LocalStorage,Lawnchair*等)
將數(shù)據(jù)發(fā)送到遠(yuǎn)程服務(wù)器
備注:較新的設(shè)備上使用攝像頭拍攝的照片的質(zhì)量是相當(dāng)不錯(cuò)的,使用Base64對(duì)這些照片進(jìn)行編碼已導(dǎo)致其中的一些設(shè)備出現(xiàn)內(nèi)存問(wèn)題(如IPHONE4、BlackBerry Torch 9800)。因此,強(qiáng)烈建議將“Camera.destinationType”設(shè)為FILE_URI。
支持的平臺(tái):
Android
BlackBerry WebWorks (OS 5.0或更高版本)
iOS
簡(jiǎn)單的范例:
拍照并獲取Base64編碼的圖像:
- navigator.camera.getPicture(onSuccess, onFail, { quality: 50 });
- function onSuccess(imageData) {
- var image = document.getElementById('myImage');
- image.src = "data:image/jpeg;base64," + imageData;
- }
- function onFail(message) {
- alert('Failed because: ' + message);
- }
拍照并獲取圖像文件路徑:
- navigator.camera.getPicture(onSuccess, onFail, { quality: 50,
- destinationType: Camera.DestinationType.FILE_URI });
- function onSuccess(imageURI) {
- var image = document.getElementById('myImage');
- image.src = imageURI;
- }
- function onFail(message) {
- alert('Failed because: ' + message);
- }
完整的范例:
- <!DOCTYPE html>
- <html>
- <head>
- <title>Capture Photo</title>
- <script type="text/javascript" charset="utf-8" src="phonegap.js"></script>
- <script type="text/javascript" charset="utf-8">
- var pictureSource; //圖片來(lái)源
- var destinationType; //設(shè)置返回值的格式
- // 等待PhoneGap連接設(shè)備
- document.addEventListener("deviceready",onDeviceReady,false);
- // PhoneGap準(zhǔn)備就緒,可以使用!
- function onDeviceReady() {
- pictureSource=navigator.camera.PictureSourceType;
- destinationType=navigator.camera.DestinationType;
- }
- // 當(dāng)成功獲得一張照片的Base64編碼數(shù)據(jù)后被調(diào)用
- function onPhotoDataSuccess(imageData) {
- // 取消注釋以查看Base64編碼的圖像數(shù)據(jù)
- // console.log(imageData);
- // 獲取圖像句柄
- var smallImage = document.getElementById('smallImage');
- // 取消隱藏的圖像元素
- smallImage.style.display = 'block';
- // 顯示拍攝的照片
- // 使用內(nèi)嵌CSS規(guī)則來(lái)縮放圖片
- smallImage.src = "data:image/jpeg;base64," + imageData;
- }
- // 當(dāng)成功得到一張照片的URI后被調(diào)用
- function onPhotoURISuccess(imageURI) {
- // 取消注釋以查看圖片文件的URI
- // console.log(imageURI);
- // 獲取圖片句柄
- var largeImage = document.getElementById('largeImage');
- // 取消隱藏的圖像元素
- largeImage.style.display = 'block';
- // 顯示拍攝的照片
- // 使用內(nèi)嵌CSS規(guī)則來(lái)縮放圖片
- largeImage.src = imageURI;
- }
- // “Capture Photo”按鈕點(diǎn)擊事件觸發(fā)函數(shù)
- function capturePhoto() {
- // 使用設(shè)備上的攝像頭拍照,并獲得Base64編碼字符串格式的圖像
- navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50 });
- }
- // “Capture Editable Photo”按鈕點(diǎn)擊事件觸發(fā)函數(shù)
- function capturePhotoEdit() {
- // 使用設(shè)備上的攝像頭拍照,并獲得Base64編碼字符串格式的可編輯圖像
- navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 20, allowEdit: true });
- }
- //“From Photo Library”/“From Photo Album”按鈕點(diǎn)擊事件觸發(fā)函數(shù)
- function getPhoto(source) {
- // 從設(shè)定的來(lái)源處獲取圖像文件URI
- navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 50,
- destinationType: destinationType.FILE_URI,sourceType: source });
- }
- // 當(dāng)有錯(cuò)誤發(fā)生時(shí)觸發(fā)此函數(shù)
- function onFail(mesage) {
- alert('Failed because: ' + message);
- }
- </script>
- </head>
- <body>
- <button onclick="capturePhoto();">Capture Photo</button> <br>
- <button onclick="capturePhotoEdit();">Capture Editable Photo</button> <br>
- <button onclick="getPhoto(pictureSource.PHOTOLIBRARY);">From Photo Library</button><br>
- <button onclick="getPhoto(pictureSource.SAVEDPHOTOALBUM);">From Photo Album</button><br>
- <img style="display:none;width:60px;height:60px;" id="smallImage" src="" />
- <img style="display:none;" id="largeImage" src="" />
- </body>
- </html>
提供圖像數(shù)據(jù)的onSuccess回調(diào)函數(shù)。
- function(imageData) {
- // 對(duì)圖像進(jìn)行處理
- }
參數(shù):
imageData:根據(jù)cameraOptions的設(shè)定值,為Base64編碼的圖像數(shù)據(jù)或圖像文件的URI。(字符串類(lèi)型)
范例:
- // 顯示圖片
- function cameraCallback(imageData) {
- var image = document.getElementById('myImage');
- image.src = "data:image/jpeg;base64," + imageData;
- }
提供錯(cuò)誤信息的onError回調(diào)函數(shù)。
- function(message) {
- // 顯示有用信息
- }
參數(shù):
message:設(shè)備本地代碼提供的錯(cuò)誤信息。(字符串類(lèi)型)
定制攝像頭設(shè)置的可選參數(shù)。
- { quality : 75,
- destinationType : Camera.DestinationType.DATA_URL,
- sourceType : Camera.PictureSourceType.CAMERA,
- allowEdit : true,
- encodingType : Camera.EncodingType.JPEG,
- targetWidth : 100,
- targetHeight : 100};
選項(xiàng):
quality:存儲(chǔ)圖像的質(zhì)量,范圍是[0,100]。(數(shù)字類(lèi)型)
destinationType:選擇返回?cái)?shù)據(jù)的格式。通過(guò)navigator.camera.DestinationType進(jìn)行定義。(數(shù)字類(lèi)型)
- Camera.DestinationType = {
- DATA_URL : 0, //返回Base64編碼字符串的圖像數(shù)據(jù)
- FILE_URI : 1 //返回圖像文件的URI
- }
sourceType:設(shè)定圖片來(lái)源。通過(guò)nagivator.camera.PictureSourceType進(jìn)行定義。(數(shù)字類(lèi)型)
- Camera.PictureSourceType = {
- PHOTOLIBRARY : 0,
- CAMERA : 1,
- SAVEDPHOTOALBUM : 2
- }
allowEdit:在選擇圖片進(jìn)行操作之前允許對(duì)其進(jìn)行簡(jiǎn)單編輯。(布爾類(lèi)型)
EncodingType:選擇返回圖像文件的編碼方式,通過(guò)navigator.camera.EncodingType進(jìn)行定義。(數(shù)字類(lèi)型)
- Camera.EncodingType = {
- JPEG : 0, // 返回JPEG格式圖片
- PNG : 1 // 返回PNG格式圖片
- };
targetWidth:以像素為單位的圖像縮放寬度,必須和targetHeight同時(shí)使用。相應(yīng)的寬高比保持不變。(數(shù)字類(lèi)型)
targetHeight:以像素為單位的圖像縮放高度,必須和targetWidth同時(shí)使用。相應(yīng)的寬高比保持不變。(數(shù)字類(lèi)型)
Android的特異情況:
忽略allowEdit參數(shù)。
Camera.PictureSourceType.PHOTOLIBRARY 或 Camera.PictureSourceType.SAVEDPHOTOALBUM 都會(huì)顯示同一個(gè)相集。
Camera.EncodingType不被支持。
BlackBerry的特異情況:
忽略quality參數(shù)。
忽略sourceType參數(shù)。
忽略allowEdit參數(shù)。
當(dāng)拍照結(jié)束后,應(yīng)用程序必須有按鍵注入權(quán)限才能關(guān)閉本地Camera應(yīng)用程序。
使用大圖像尺寸,可能會(huì)導(dǎo)致新近帶有高分辨率攝像頭的型號(hào)設(shè)備無(wú)法對(duì)圖像進(jìn)行編碼(如:Torch 9800)。
Palm的特異情況:
忽略quality參數(shù)。
忽略sourceType參數(shù)。
忽略allowEdit參數(shù)。
iPhone的特異情況:
為了避免部分設(shè)備上出現(xiàn)內(nèi)存錯(cuò)誤,quality的設(shè)定值要低于50。
當(dāng)使用destinationType.FILE_URI時(shí),使用攝像頭拍攝的和編輯過(guò)的照片會(huì)存儲(chǔ)到應(yīng)用程序的Documents/tmp目錄。
應(yīng)用程序結(jié)束的時(shí)候,應(yīng)用程序的Documents/tmp目錄會(huì)被刪除。如果存儲(chǔ)空間大小非常關(guān)鍵的時(shí)候,開(kāi)發(fā)者也可以通過(guò)navigator.fileMgr的接口來(lái)刪除該目錄。