Camera
Camera
camera对象提供调用设备上的默认照相应用。
Methods
- camera.getPicture
camera.getPicture
通过摄像机照一张像，或者从相册中取出一张图片。图片是基础base64编码的字符串或者图片URI地址作为返回值的。
- navigator.camera.getPicture( cameraSuccess, cameraError, [ cameraOptions ] );
Description
camera.getPicture 方法打开设备上的摄像功能，一遍用户照相（如果Camera.sourceType= Camera.PictureSourceType.CAMERA,通常sourcetype是默认该值的）。
一旦摄了像，Camera应用会关闭，信息被存储起来。
如果Camera.sourceType = Camera.PictureSourceType.PHOTOLIBARARY 或者是 Camera.PictureSourceType.SAVEDPHOTOALBUM，这是会显示图片选择对话框，该图片是从相册中选择出来的。
返回值将被发送到cameraSuccess函数，格式依赖于cameraOptions的值。
- 一段字符串包含加密过的Base64图像（默认）。
- 一段字符串代表该图片在存储器中的位置。
可以根据自己的要求就能得到的是图像或者URL，例如：
- 给image的img赋值（看下面的例子）
- 保存数据到本地（本地存储，移动设备等）
- 把数据传递给服务端
小记：使用相机或比较新的设备以至于确保图像的质量，在一些设备上用Base64加密图像数据导致内存问题(iPhone 4, BlackBerry Torch 9800)，因此推荐使用FILE_URI作为“Camera.destinationType”。
Supported Platforms
Android
Blackberry WebWorks (OS 5.0 and higher)
iPhone
Windows Phone 7 ( Mango )
Quick Example
照相并且取得由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);
- }
Full Example
- <!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; // picture source
- var destinationType; // sets the format of returned value
- // Wait for PhoneGap to connect with the device
- //
- document.addEventListener("deviceready",onDeviceReady,false);
- // PhoneGap is ready to be used!
- //
- function onDeviceReady() {
- pictureSource=navigator.camera.PictureSourceType;
- destinationType=navigator.camera.DestinationType;
- }
- // Called when a photo is successfully retrieved
- //
- function onPhotoDataSuccess(imageData) {
- // Uncomment to view the base64 encoded image data
- // console.log(imageData);
- // Get image handle
- //
- var smallImage = document.getElementById('smallImage');
- // Unhide image elements
- //
- smallImage.style.display = 'block';
- // Show the captured photo
- // The inline CSS rules are used to resize the image
- //
- smallImage.src = "data:image/jpeg;base64," + imageData;
- }
- // Called when a photo is successfully retrieved
- //
- function onPhotoURISuccess(imageURI) {
- // Uncomment to view the image file URI
- // console.log(imageURI);
- // Get image handle
- //
- var largeImage = document.getElementById('largeImage');
- // Unhide image elements
- //
- largeImage.style.display = 'block';
- // Show the captured photo
- // The inline CSS rules are used to resize the image
- //
- largeImage.src = imageURI;
- }
- // A button will call this function
- //
- function capturePhoto() {
- // Take picture using device camera and retrieve image as base64-encoded string
- navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50 });
- }
- // A button will call this function
- //
- function capturePhotoEdit() {
- // Take picture using device camera, allow edit, and retrieve image as base64-encoded string
- navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 20, allowEdit: true });
- }
- // A button will call this function
- //
- function getPhoto(source) {
- // Retrieve image file location from specified source
- navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 50,
- destinationType: destinationType.FILE_URI,
- sourceType: source });
- }
- // Called if something bad happens.
- //
- function onFail(message) {
- 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>
cameraSuccess
onSuccess函数有一个图像数据字符串参数.
function(imageData) {
// Do something with the image
}
// Do something with the image
}
Parameters
imageData:Base64的图像数据或者是图片的URI，取决于cameraOptions的设置.
例如
// Show image
//
function cameraCallback(imageData) {
var image = document.getElementById('myImage');
image.src = "data:image/jpeg;base64," + imageData;
}