1、建立Android APP
2、在xml/config.xml中添加功能
<feature name="Notification">
<param name="android-package" value="org.apache.cordova.dialogs.Notification" />
</feature>
<feature name="Vibration">
<param name="android-package" value="org.apache.cordova.vibration.Vibration" />
</feature>
<feature name="Camera" >
<param
name="android-package"
value="org.apache.cordova.CameraLauncher" />
</feature>
<feature name="App" >
<param
name="android-package"
value="org.apache.cordova.App" />
</feature>
3、在AndroidManifest.xml添權重限
<uses-permission android:name="android.permission.VIBRATE" />
4、建立index.html
在assets目錄下 建立 www/index.html
<!DOCTYPE html>
<html>
<head>
<title>Capture Photo</title>
<meta charset="UTF-8">
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8">
var pictureSource; //圖檔來源
var destinationType; //設定傳回值格式
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() { //加載後執行
pictureSource = navigator.camera.PictureSourceType;
destinationType = navigator.camera.DestinationType;
}
//當成功擷取圖檔時以base64編碼格式顯示
function onPhotoDataSuccess(imageData) {
console.log(imageData);
var smallImage = document.getElementById('smallImage');
smallImage.style.display = 'block';
smallImage.src = "data:image/jpeg;base64," + imageData;
}
//當成功擷取圖檔時以uri格式顯示
function onPhotoURISuccess(imageURI) {
console.log(imageURI);
var largeImage = document.getElementById('largeImage');
largeImage.style.display = 'block';
largeImage.src = imageURI;
}
function capturePhoto() {
navigator.camera.getPicture(onPhotoDataSuccess, onFail, {
quality : 50,
destinationType : destinationType.DATA_URL
});
}
function capturePhotoEdit() {
navigator.camera.getPicture(onPhotoDataSuccess, onFail, {
quality : 20,
allowEdit : true,
destinationType : destinationType.DATA_URL
});
}
function getPhoto(source) {
// "content://com.android.providers.media.documents/document/image%3A418", source: file:///android_asset/www/camera.html (21)
navigator.camera.getPicture(onPhotoURISuccess, onFail, {
quality : 50,
destinationType : destinationType.FILE_URI,
sourceType : source
});
}
function onFail(message) {
alert('Failed because: ' + message);
}
</script>
</head>
<body>
<p>
<button οnclick="capturePhoto();">拍照</button>
</p>
<p>
<button οnclick="capturePhotoEdit();">編輯圖檔</button>
</p>
<p>
<button οnclick="getPhoto(pictureSource.PHOTOLIBRARY);">選擇圖檔庫中的圖檔</button>
</p>
<p>
<button οnclick="getPhoto(pictureSource.SAVEDPHOTOALBUM);">選擇相冊中的圖檔</button>
</p>
<img style="display: none; width: 200px; height: 200px;"
id="smallImage" src="" />
<img style="display: none; width: 300px; height: 300px;"
id="largeImage" src="" />
</body>
</html>
5、運作APP，最後的效果如下;
Camera方法詳解：
camera的方法：
navigator.camera.getPicture( cameraSuccess, cameraError, [ cameraOptions ] );
選擇使用攝像頭拍照，或從裝置相冊中擷取一張照片。圖檔以base64編碼的字元串或圖檔URI形式傳回。
camera.getPicture函數打開裝置的預設攝像頭應用程式，使使用者可以拍照（如果 Camera.sourceType 設定為 Camera.PictureSourceType.CAMERA，這也是預設值）。一旦拍照結束，攝像頭應用程式會關閉并恢複使用者應用程式。
如果Camera.sourceType = Camera.PictureSourceType.PHOTOLIBRARY或Camera.PictureSourceType.SAVEDPHOTOALBUM，系統彈出照片選擇對話框，使用者可以從相集中選擇照片。
傳回值會按照使用者通過cameraOptions參數所設定的下列格式之一發送給cameraSuccess回調函數：
一個字元串，包含Base64編碼的照片圖像（預設情況）。
一個字元串，表示在本地存儲的圖像檔案位置。
cameraOptions 參數詳解：
- quality：存儲圖像的品質，範圍是[0,100]。(數字類型)
- destinationType：選擇傳回資料的格式。通過navigator.camera.DestinationType進行定義。可選擇的值：destinationType.DATA_URL、destinationType.FILE_URI(數字類型)
- sourceType：設定圖檔來源。通過nagivator.camera.PictureSourceType進行定義。可選擇的值：Camera.PictureSourceType.CAMERA、Camera.PictureSourceType.PHOTOLIBRARY、Camera.PictureSourceType.SAVEDPHOTOALBUM(數字類型)
- allowEdit：在選擇圖檔進行操作之前允許對其進行簡單編輯。(布爾類型)
- encodingType：選擇傳回圖像檔案的編碼方式，通過navigator.camera.EncodingType進行定義。(數字類型)
- targetWidth：以像素為機關的圖像縮放寬度，必須和targetHeight同時使用。相應的寬高比保持不變。(數字類型)
- targetHeight：以像素為機關的圖像縮放高度，必須和targetWidth同時使用。相應的寬高比保持不變。(數字類型)
這些屬性并不是在所有的裝置上都起作用,具體的每個裝置的支援情況還請參照官方文檔.
