`

PhoneGap API帮助文档翻译—Camera (摄像头)

阅读更多

camera对象提供对设备默认摄像头应用程序的访问。

方法:
  • camera.getPicture

参数:

  • cameraSuccess
  • cameraError
  • cameraOptions

camera.getPicture:选择使用摄像头拍照,或从设备相册中获取一张照片。图片以base64编码的字符串或图片URI形式返回。

简单的范例:

 

navigator.camera.getPicture( cameraSuccess, cameraError, [ cameraOptions ] );

 说明:

 

camera.getPicture函数打开设备的默认摄像头应用程序,使用户可以拍照(如果 Camera.sourceType 设置为 Camera.PictureSourceType.CAMERA,这也是默认值)。一旦拍照结束,摄像头应用程序会关闭并恢复用户应用程序。
如果Camera.sourceType = Camera.PictureSourceType.PHOTOLIBRARY或Camera.PictureSourceType.SAVEDPHOTOALBUM,系统弹出照片选择对话框,用户可以从相集中选择照片。
返回值会按照用户通过cameraOptions参数所设定的下列格式之一发送给cameraSuccess回调函数:
  • 一个字符串,包含Base64编码的照片图像(默认情况)。
  • 一个字符串,表示在本地存储的图像文件位置
你可以对编码的图片或URI做任何处理,例如:
  • 通过标签渲染图片(参看后续范例)
  • 存储为本地数据(LocalStorage,Lawnchair*等)
  • 将数据发送到远程服务器
备注:较新的设备上使用摄像头拍摄的照片的质量是相当不错的,使用Base64对这些照片进行编码已导致其中的一些设备出现内存问题(如IPHONE4、BlackBerry Torch 9800)。因此,强烈建议将“Camera.destinationType”设为FILE_URI。
支持的平台:
  • Android
  • BlackBerry WebWorks (OS 5.0或更高版本)
  • iOS
简单的范例:拍照并获取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;		//图片来源
	var destinationType;		//设置返回值的格式
	
	// 等待PhoneGap连接设备
	document.addEventListener("deviceready",onDeviceReady,false);
	
	// PhoneGap准备就绪,可以使用!
	function onDeviceReady() {
		pictureSource=navigator.camera.PictureSourceType;
		destinationType=navigator.camera.DestinationType;
	}
	
	// 当成功获得一张照片的Base64编码数据后被调用
	function onPhotoDataSuccess(imageData) {
	
		// 取消注释以查看Base64编码的图像数据
		// console.log(imageData);
		// 获取图像句柄
		var smallImage = document.getElementById('smallImage');
			 
		// 取消隐藏的图像元素
		smallImage.style.display = 'block';
		
		// 显示拍摄的照片
		// 使用内嵌CSS规则来缩放图片
		smallImage.src = "data:image/jpeg;base64," + imageData;
	}
	   
   // 当成功得到一张照片的URI后被调用
   function onPhotoURISuccess(imageURI) {
	
		// 取消注释以查看图片文件的URI
		// console.log(imageURI);
		// 获取图片句柄
		var largeImage = document.getElementById('largeImage');
		 
		// 取消隐藏的图像元素
		largeImage.style.display = 'block';
	
		// 显示拍摄的照片
		// 使用内嵌CSS规则来缩放图片
		largeImage.src = imageURI;
	}
	   
   // “Capture Photo”按钮点击事件触发函数
   function capturePhoto() {

		// 使用设备上的摄像头拍照,并获得Base64编码字符串格式的图像
		navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50 });
   }
   
   // “Capture Editable Photo”按钮点击事件触发函数
   function capturePhotoEdit() {

		// 使用设备上的摄像头拍照,并获得Base64编码字符串格式的可编辑图像
		navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 20, allowEdit: true });
   }
	   
   //“From Photo Library”/“From Photo Album”按钮点击事件触发函数
   function getPhoto(source) {
   
   		// 从设定的来源处获取图像文件URI
		navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 50,
		destinationType: destinationType.FILE_URI,sourceType: source });
   }

   // 当有错误发生时触发此函数
   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>
 cameraSuccess:提供图像数据的onSuccess回调函数。
参数:
  • imageData:根据cameraOptions的设定值,为Base64编码的图像数据或图像文件的URI。(字符串类型)
范例:
// 显示图片
function cameraCallback(imageData) {
	var image = document.getElementById('myImage');
	image.src = "data:image/jpeg;base64," + imageData;
}
 ameraError:提供错误信息的onError回调函数。
参数:
  • message:设备本地代码提供的错误信息。(字符串类型)
cameraOptions:定制摄像头设置的可选参数。
{	quality : 75,
	destinationType : Camera.DestinationType.DATA_URL,
	sourceType : Camera.PictureSourceType.CAMERA,
	allowEdit : true,
	encodingType : Camera.EncodingType.JPEG,
	targetWidth : 100,
	targetHeight : 100};
选项:
  • quality:存储图像的质量,范围是[0,100]。(数字类型)
  • destinationType:选择返回数据的格式。通过navigator.camera.DestinationType进行定义。(数字类型)
Camera.DestinationType = {
	DATA_URL : 0,	//返回Base64编码字符串的图像数据
	FILE_URI : 1	//返回图像文件的URI
}
 sourceType:设定图片来源。通过nagivator.camera.PictureSourceType进行定义。(数字类型)

 

Camera.PictureSourceType = {
	PHOTOLIBRARY : 0,
	CAMERA : 1,
	SAVEDPHOTOALBUM : 2
}
  • allowEdit:在选择图片进行操作之前允许对其进行简单编辑。(布尔类型)
  • EncodingType:选择返回图像文件的编码方式,通过navigator.camera.EncodingType进行定义。(数字类型)
Camera.EncodingType = {
	JPEG : 0,		// 返回JPEG格式图片
	PNG : 1			// 返回PNG格式图片
};
  • targetWidth:以像素为单位的图像缩放宽度,必须和targetHeight同时使用。相应的宽高比保持不变。(数字类型)
  • targetHeight:以像素为单位的图像缩放高度,必须和targetWidth同时使用。相应的宽高比保持不变。(数字类型)
Android的特异情况:
  • 忽略allowEdit参数。
  • Camera.PictureSourceType.PHOTOLIBRARY 或 Camera.PictureSourceType.SAVEDPHOTOALBUM 都会显示同一个相集。
  • Camera.EncodingType不被支持。
BlackBerry的特异情况:
  • 忽略quality参数。
  • 忽略sourceType参数。
  • 忽略allowEdit参数。
  • 当拍照结束后,应用程序必须有按键注入权限才能关闭本地Camera应用程序。
  • 使用大图像尺寸,可能会导致新近带有高分辨率摄像头的型号设备无法对图像进行编码(如:Torch 9800)。
Palm的特异情况:
  • 忽略quality参数。
  • 忽略sourceType参数。
  • 忽略allowEdit参数。
iPhone的特异情况:
  • 为了避免部分设备上出现内存错误,quality的设定值要低于50。
  • 当使用destinationType.FILE_URI时,使用摄像头拍摄的和编辑过的照片会存储到应用程序的Documents/tmp目录。
  • 应用程序结束的时候,应用程序的Documents/tmp目录会被删除。如果存储空间大小非常关键的时候,开发者也可以通过navigator.fileMgr的接口来删除该目录。

 

 

分享到:
评论
发表评论

文章已被作者锁定,不允许评论。

相关推荐

    PhoneGap,API帮助文档.zip

    这个"PhoneGap API帮助文档.zip"压缩包显然包含了关于如何使用PhoneGap API的详细指南,对于开发者来说是非常宝贵的资源。下面我们将深入探讨PhoneGap API中的关键组件及其功能。 1. **加速度计(Accelerometer)**...

    PhoneGap中文API帮助文档

    网上的phonegap中文帮助文档尚少,翻译也不太好,在此收集了一些翻译优秀的文章,并制作成chm的帮助文档,以帮助各位学习,此文档包含了phonegap的主要使用功能,并提供了完整示例

    PhoneGap,API帮助文档翻译整理2-Camera(相机)

    Camera API是PhoneGap提供的一个用于访问设备摄像头的重要功能。它允许开发者调用设备的默认相机应用,拍摄照片或从设备的相册中选择照片,并以Base64编码的字符串或图像文件URI的形式返回结果。 二、Camera API的...

    PhoneGap,API帮助文档翻译整理4-Compass(指南针)

    标题:PhoneGap,API帮助文档翻译整理4-Compass(指南针) 描述:本文档将深入探讨PhoneGap中Compass API的功能与应用,包括如何获取设备的指南针方向、监听指南针变化以及如何处理相关事件。 ### 一、Compass API...

    PhoneGap,API帮助文档翻译整理6-Contacts(通讯录)

    ### PhoneGap Contacts API详解 #### 一、简介 在移动应用开发中,有时我们需要访问用户的通讯录以便于实现社交功能或其他交互式应用需求。PhoneGap(现称Cordova)为开发者提供了一套丰富的API,使得跨平台应用...

    PhoneGap,API帮助文档翻译整理7-Events_(消息)

    PhoneGap API 提供了一系列的事件,这些事件可以帮助开发者响应移动设备上的特定操作,从而实现更丰富的用户体验。本文将详细介绍 PhoneGap 中的事件类型及其使用方法。 1. **backbutton**:当用户在 Android 设备...

    PhoneGap,API帮助文档翻译整理10-Media_(媒体)

    在本篇文档中,我们关注的是 PhoneGap 的 Media API,它提供了对移动设备媒体(如音频)的访问和控制能力。 Media API 提供了对音频文件的操作,包括播放、暂停、停止以及获取当前播放位置等功能。以下是对 Media ...

    PhoneGap,API帮助文档翻译整理5-Device(设备)

    知识点:PhoneGap设备API及其应用 一、PhoneGap设备API概览 PhoneGap是一个开源框架,允许开发者使用HTML、CSS和JavaScript开发跨平台移动应用程序。设备API是PhoneGap提供的核心功能之一,它允许开发者访问设备的...

    Phonegap API (中文版)

    最新的Phonegap api 中文翻译版。让你快速入门。

    PhoneGap,API帮助文档翻译整理6-Contacts(通讯录).pdf

    在本文中,我们将围绕PhoneGap框架的API文档进行探讨,特别是在处理移动设备上的通讯录(Contacts)数据时所使用的一系列方法。根据提供的文件信息,我们将会详细解释如何使用PhoneGap API来创建和查找通讯录中的...

    PhoneGap,API帮助文档翻译整理3-Capture(捕捉)

    ### PhoneGap Capture API详解 #### 一、简介 **PhoneGap**是一款开源框架,允许开发者使用HTML、CSS和JavaScript等Web技术开发跨平台移动应用程序。本文档主要介绍**PhoneGap**中的**Capture API**,该API提供了...

    PhoneGap,API帮助文档翻译整理8-File_(文件)

    在本篇文档中,我们将重点关注与“文件”相关的 API,包括 `File`、`DirectoryEntry`、`FileReader` 等。 **File API** 是一组用于读取、写入和管理设备文件系统层级结构的接口。这些接口遵循 W3C 的《文件系统 API...

    PhoneGap,API帮助文档翻译整理9-Geolocation_(定位)

    // PhoneGap 激活时执行 function onDeviceReady() { // 不使用超时,因为不是必需的 // 如果在设备准备好之前调用了 getCurrentPosition,将会失败 navigator.geolocation.getCurrentPosition(onSuccess, on...

    PhoneGap的API组件及使用方法

    8. **摄像头** (Camera): 通过调用`navigator.camera`,用户可以访问设备的摄像头,拍照或选择现有图片。 9. **联系人** (Contacts): `navigator.contacts`接口用于创建、读取、更新和删除联系人信息。 10. **加速...

    PhoneGap,API帮助文档翻译整理1-Accelerometer(加速度计)

    ### PhoneGap中的Accelerometer(加速度计)API详解 #### 一、简介 加速度计是一种常见的硬件传感器,被广泛应用于智能手机和平板电脑等移动设备上。它主要用于测量设备在三维空间中的线性加速度,通常包括三个轴...

    phonegap api中文手册

    本手册为PhoneGap API的中文版指南,旨在为开发者提供全面、详细的API使用指导,帮助其利用PhoneGap框架开发跨平台移动应用。PhoneGap是一款基于HTML、CSS和JavaScript的技术栈,允许开发者构建适用于多个移动操作...

    Android+ionic +phonegap 调用摄像头 $cordovaCamera

    Android+ionic +phonegap 调用摄像头 $cordovaCamera; 在Android上运行,ionic打包到assetc目录;上传一个实例,是phonegap100,树根老师讲的例子+自己写了调用摄像头的案例,给各位学习。以后还会添加功能,继续...

    Phonegap API中文版

    PhoneGap API是这个框架的核心,提供了与设备硬件功能交互的能力,如摄像头、加速度计、GPS等。本资源是PhoneGap API的中文版,对于中国开发者来说,无疑是一个宝贵的参考资料。 在使用PhoneGap API进行开发时,有...

    PhoneGap API之事件处理.

    在PhoneGap中,事件处理是连接用户交互与应用程序逻辑的关键环节,让我们深入探讨PhoneGap API中的事件处理机制。 1. **事件模型**:PhoneGap遵循W3C的DOM事件模型,包括事件监听器、事件冒泡和事件捕获。事件监听...

Global site tag (gtag.js) - Google Analytics