cordova-plugin-camera相机插件使用

一、cordova-plugin-camera提供照相机API与设备相机进行交互。

通过API我们可以拍摄或访问照片库中的照片,返回图片的base64编码字符串或者图片的url文件路径。

二.安装命令:

cordova plugin add cordova-plugin-camera

官当文档:

http://cordova.apache.org/docs/en/latest/reference/cordova-plugin-camera/index.html#module_Camera.Direction

三.API和相关对象

1.navigator.camera.getPicture(onSuccess,onError,opiotns) 从相机或图片库获取

2.navigator.camera.cleanup(onSuccess,onError) 移除掉图像文件调用camera.getPicture所保存的临时存储空间。


3.CameraOptions 相机设置的可选参数

名字

类型

默认值

描述

quality

number 50 图像的保存质量,范围0-100,100是最大值,最高的分辨率,没有任何压缩损失(请注意有关该相机的分辨率信息不可用。)
destinationType DestinationType FILE_URI 选择返回值的格式
sourceType PictureSourceType         CAMERA 获取图片的来
allowEdit Boolean true 允许在选择图片之前进行简单的编辑
encodingType EncodingType JPEG 选择图像的返回编码
targetWidth number   宽度像素用来缩放图像。必须和targetHeight一起使用。宽高比保持不变。
targetHeight number   高度像素用来缩放图像。必须和targetWidth一起使用。宽高比保持不变
mediaType MediaType PICTURE                        选择media类型。它只适用PictureSourceType是PHOTOLIBRARY或SAVEDPHOTOALBUM
correctOrientation                    Boolean   如果是横向拍摄的照片,会自动旋转到正确的方向
saveToPhotoAlbum                                    Boolean   设备拍照后的图像是否保存的图片库中
popoverOptions CameraPopoverOptions                                            仅ios可用,设定在ipad的popover的位置
cameraDirection Direction BACK 选择前置摄像头还是后置摄像头


























Camera.DestinationType :返回数据类型
特性:
变量名 类型 默认值 描述
DATA_URL number 0 返回Base64编码的字符串
FILE_URI number 1 返回文件的URI(content://media/external/images/media/2 for Android)
NATIVE_URI number 2 返回原生URI (eg. asset-library://... for iOS)
Camera.EncodingType :图片格式指定
特性:
变量名 类型 默认值 描述
JPEG number 0 返回JPEG的图片
PNG number 1 返回PNG的图片
Camera.MediaType :获取的媒体格式,图片/视频
特性:
变量名 类型 默认值 描述
PICTURE number 0 仅允许选择静态影像。 默认。将通过DestinationType返回指定格式
VIDEO number 1 仅允许选择视频,只返回网址
ALLMEDIA number 2 允许返回所有媒体格式
Camera.PictureSourceType :媒体来源,相册/拍照
特性:
变量名 类型 默认值 描述
PHOTOLIBRARY number 0 从设备相册选择图片
CAMERA number 1 用摄像头拍摄图片
SAVEDPHOTOALBUM number 2 从设备相册选择图片(一个应该是ios一个安卓)
Camera.PopoverArrowDirection :枚举 匹配的iOS UIPopoverArrowDirection在popover固定的箭头位置。
类型:相机的静态枚举属性
特性:
变量名 类型 默认值
ARROW_UP number 1
ARROW_DOWN number 2
ARROW_LEFT number 4
ARROW_RIGHT number 8
ARROW_ANY number 15
Camera.Direction :前后摄像头指定
特性:
变量名 类型 默认值 描述
BACK number 0 使用后置摄像头
FRONT number 1 使用前置摄像头
CameraPopoverOptions
iOS特供,从iPad的系统相册选择图片,指定popover的定位元素的位置箭头方向和参数。需要注意的是popover的尺寸可以改变,以适应屏幕的箭头和取向方向。确保指定元素位置时考虑方向变化。
变量名 类型 默认值 描述
[x] number 0 屏幕选取框的x坐标
[y] number 32 屏幕选取框的y坐标
[width] number 320 屏幕选取框的宽度
[height] number 480 屏幕选取框的高度
[arrowDir] PopoverArrowDirection ARROW_ANY 确定popover的指向
四、获取图片示例

1.从相册获取DATA_URL类型

navigator.camera.getPicture(onSuccess, onError, {
    quality: 50,
    destinationType: Camera.DestinationType.DATA_URL,//返回Base64编码字符串
    sourceType: Camera.PictureSourceType.SAVEDPHOTOALBUM,//指定图片来自相册
    encodingType: Camera.EncodingType.JPEG, //指定返回图片是png格式还是jpeg

});
function onSuccess(data) {
    alert(data.length);
    var result = "data:image/jpeg;base64," + data;
    app.url1 = result;
    document.getElementById('imgOne').src = result;
}
function onError() {
    alert('获取失败');
}
2.从拍照获取图片File_Uri路径

navigator.camera.getPicture(onSuccess, onError, {
    quality: 50,
    destinationType: Camera.DestinationType.FILE_URI,//返回FILE_URI类型
    sourceType: Camera.PictureSourceType.CAMERA,//指定图片来自拍照
    cameraDirection: Camera.Direction.FRONT,//指定前后摄像头--好像没起作用
    targetWidth: 300,
    targetHeight: 300
    //encodingType: Camera.EncodingType.PNG //指定返回图片是png格式还是jpeg
});
function onSuccess(data) {
    alert(data);
    app.url2 = data;
    document.getElementById('imgTwo').src = data;
}
function onError() {
    alert('获取失败');
}

更多:  

cordova-plugin-contacts联系人操作

cordova-plugin-device-motion加速计和cordova-plugin-device-orientation设备方向

cordova-plugin-battery-status监听电池状态

相关文章
相关标签/搜索