调用系统摄像头进行拍照。
方法:
camera.getPicture---调用系统照相机拍照
参数:
cameraSuccess---调用成功
cameraError---调用失败
[ cameraOptions ]---设置可选项
对于安卓可选项:
quality(图像的质量) : 75,
destinationType(返回数据的格式) : Camera.Destination(Base64编码) Type.DATA_URL(图像文件路径),一般显示时候用url上传服务器用base
sourceType(图片来源) : Camera.PictureSource(从相册中) Type.CAMERA(即时拍照),
targetWidth(以像素为单位的图像缩放宽度) : 100,
截图:
方法:
camera.getPicture---调用系统照相机拍照
参数:
cameraSuccess---调用成功
cameraError---调用失败
[ cameraOptions ]---设置可选项
对于安卓可选项:
quality(图像的质量) : 75,
destinationType(返回数据的格式) : Camera.Destination(Base64编码) Type.DATA_URL(图像文件路径),一般显示时候用url上传服务器用base
sourceType(图片来源) : Camera.PictureSource(从相册中) Type.CAMERA(即时拍照),
targetWidth(以像素为单位的图像缩放宽度) : 100,
targetHeight(以像素为单位的图像缩放高度) : 100
代码:
<!DOCTYPE html>
<html>
<head>
<title>照相机</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';
//用的相机是jpg格式可能不显示,一般传到服务端base64编码
smallImage.src = "data:image/jpeg;base64," + imageData;
}
// 当成功得到一张照片的URI后被调用
function onPhotoURISuccess(imageURI) {
// 控制台打印图片文件的URI
console.log(imageURI);
var largeImage = document.getElementById('largeImage');
// 取消隐藏的图像元素
largeImage.style.display = 'block';
largeImage.src = imageURI;
}
// base64编码数据显示
function capturePhoto() {
// 使用设备上的摄像头拍照,并获得Base64编码字符串格式的图像
navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50 });
}
//url从相册中选择
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 οnclick="capturePhoto();">立即拍照</button> <br>
<button οnclick="getPhoto(pictureSource.PHOTOLIBRARY);">从相册中选取相片</button><br>
<img style="display:none;width:300px;height:300px;" id="smallImage" src="" ></img>
<img style="display:none;" id="largeImage" src="" ></img>
</body>
</html>
截图: