• cordova摄像头插件


    Cordova相机插件中文翻译

     这个插件定义了一个全局对象navigator.camera,它用来提供拍照和从系统相册里选取图片的API。


    安装:

    1.需要最新的cordova 5.0:

    cordova plugin add cordova-plugin-camera

    2.通过ID安装旧版本的cordova

    cordova plugin add org.apache.cordova.camera

    3.当然,也可以通过下载直接添加:(不稳定)

    cordova plugin add https://github.com/apache/cordova- plugin-camera.git


    提供的API

    .camera

          。.getPicture(successCallback,errorCallback,options)

          。cleanup()

          。onError:函数

          。onSuccess:函数

          。CameraOptions:对象

    .Camera

          。DestinationType:枚举

          。EncodingType:枚举

          。MediaType:枚举

          。PictureSourceType:枚举

          。PopoverArrowDirection:枚举

          。Direction:枚举

    .CameraPopoverHandle

    .CameraPopoverOptions


    camera


    1.camera.getPicture(successCallback, errorCallback, options)

    通过相机或者设备的相册获取到图片,如果传递成功会回调一个Base64编码的字符串或者图像文件的URI(统一资源标识符)。

    camera.getPicture这个函数会打开设备的默认摄像头,允许用户在默认情况下拍摄图片,当Camera.sourceType等于Camera.PictureSourceType.CAMERA,就会掉用摄像头。一旦用户获取到了图片,相机程序关闭并且恢复原程序。

    当Camera.sourceType是Camera.PictureSourceType.PHOTOLIBRARY或Camera.PictureSourceType.SAVEDPHOTOALBUM的话,会跳到系统相册让用户选择图片。

    当camera.getPicture函数返回一个CameraPopoverHandle对象,它可用于重新设定图像选择对话框,例如,设备方向改变时。

    返回值被发送到cameraSuccess回调函数,然后可以在cameraOptions中指定它们:

          .一个字符串包含base64编码的照片图像

          .一个字符串表示图像文件的本地储存位置(URL)

    你可以对base64编码的字符串或者URI做任何事儿,比如说:

         .让这个图片成为一个<img>,就像下面的例子一样

         .存储在本地(LocalStorage,Lawnchair等等)

         .把它传给远程服务器

    注:新设备的照片像素很高,从设备相册选取的图片不会被缩减质量(甚至它已经指定了分辨率),为了内存问题,设置Camera.destinationType为FILE_URI而不是DATA_URL。

    支持平台

    安卓,黑莓10,浏览器,火狐os,亚马逊os,iOS,windows,wp8,ubuntu

    类型:相机的静态方法:

    参数----------------------------类型-----------描述----

    successCallback-----------------onSuccess------        ----

    errorCallback-------------------onError--------          ----

    options------------------------CameraOptions--CameraOptions-

    例子:

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


    2.camera.cleanup()

    移除掉用camera.getPicture函数之后的本地储存,只有Camera.sourceType的值等于Camera.PictureSourceType.CAMERA和Camera.destinationType等于Camera.DestinationType.FILE_URI的时候会掉用。

    支持平台:iOS

    类型:相机的静态方法

    示例:

    navigator.camera.cleanup(onSuccess, onFail);

    functiononSuccess() {

    console.log("Camera cleanup success.")

    }

    functiononFail(message) {

    alert('Failed because: '+message);

    }


    3.camera.onError :(函数)

    回调一条错误信息

    类型:相机的静态方法

    参数--------------------------类型-----------------------------描述

    message------------------------string-------------------------由原生代码提供


    4.camera.onSuccess:(函数)

    回调图像的数据

    类型:相机的静态方法

    参数--------------类型-----------------------------描述

    imageData---------string------基于cameraOptions的图像Base64编码或者图像文件的URI

    示例:

    // Show image

    //

    functioncameraCallback(imageData) {

    varimage=document.getElementById('myImage');

    image.src="data:image/jpeg;base64,"+imageData;

    }


    5.camera.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--空--设定在ipad的popover的位置

    cameraDirection--Direction--BACK--选择前置摄像头或者后面的摄像头


    Camera


    1.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)


    2.Camera.EncodingType :enum

    类型:相机的静态枚举属性

    特性:

    变量名-类型-默认值-描述

    JPEG--number--0--返回JPEG的图片

    PNG--number--1--返回PNG的图片


    3.Camera.MediaType :enum

    类型:相机的静态枚举属性

    特性:

    变量名-类型-默认值-描述

    PICTURE--number--0--允许选择静态影像。 默认。将通过DestinationType返回指定格式

    VIDEO--number--1--允许选择视频,只返回网址

    ALLMEDIA--number--2--允许返回所有媒体格式


    4.Camera.PictureSourceType :enum

    类型:相机的静态枚举属性

    特性:

    变量名-类型-默认值-描述

    PHOTOLIBRARY--number--0--从设备相册选择图片

    CAMERA--number--1--用摄像头拍摄图片

    SAVEDPHOTOALBUM--number--2--从设备相册选择图片(一个应该是ios一个安卓)


    5.Camera.PopoverArrowDirection :enum

    匹配的iOS UIPopoverArrowDirection在popover固定的箭头位置。

    类型:相机的静态枚举属性

    特性:

    变量名-类型-默认值

    ARROW_UP--number--1

    ARROW_DOWN--number--2

    ARROW_LEFT--number--4

    ARROW_RIGHT--number--8

    ARROW_ANY--number--15


    6.Camera.Direction :enum

    类型:相机的静态枚举属性

    特性:

    变量名-类型-默认值-描述

    BACK--number--0--使用后置摄像头

    FRONT--number--1--使用前置摄像头


    7.CameraPopoverOptions

    iOS特供,从iPad的系统相册选择图片,指定popover的定位元素的位置箭头方向和参数。需要注意的是popover的尺寸可以改变,以适应屏幕的箭头和取向方向。确保指定元素位置时考虑方向变化。

    变量名-类型-默认值-描述

    [x]--number--0--屏幕选取框的x坐标

    [y]--number--32--屏幕选取框的y坐标

    [width]--number--320--屏幕选取框的宽度

    [height]--number--480--屏幕选取框的高度

    [arrowDir]--PopoverArrowDirection--ARROW_ANY--确定popover的指向


    8.CameraPopoverHandle

    图片选择框的句柄

    支持平台:iOS

    示例:

    varcameraPopoverHandle=navigator.camera.getPicture(onSuccess, onFail,

    {

    destinationType:Camera.DestinationType.FILE_URI,

    sourceType:Camera.PictureSourceType.PHOTOLIBRARY,

    popoverOptions:newCameraPopoverOptions(300,300,100,100, Camera.PopoverArrowDirection.ARROW_ANY)

    });

    // Reposition the popover if the orientation changes.

    window.onorientationchange=function() {

    varcameraPopoverOptions=newCameraPopoverOptions(0,0,100,100, Camera.PopoverArrowDirection.ARROW_ANY);

    cameraPopoverHandle.setPosition(cameraPopoverOptions);

    }


    9.camera.getPicture  勘误表

    示例:

    照一张照片并且获取Base64编码后的图像:

    navigator.camera.getPicture(onSuccess, onFail, { quality: 50,

    destinationType: Camera.DestinationType.DATA_URL

    });

    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);

    }

    。特殊(iOS)

    CameraUsesGeolocation(布尔值,默认为false)。对于拍摄JPEG文件,设置为true来获得地理定位数据的EXIF头。这将触发对地理位置权限的请求,如果设置为true。

    (下面省略了其他操作系统的特殊情况,只显示ios和安卓的)

    。Android

    安卓在低端机上调用Cordova这个插件的时候可能会被强制关掉。在这种情况在,插件的调用结果会通过resume事件。有关更多信息,请参见Android生命周期指南。pendingResult这个函数将会传递给回调函数一个值(URI / URL或错误消息)。pendingResult.pluginStatus是用来判断调用插件是否成功的。

    。iOS

    包含alert()的回调函数会发生问题,内置警报器setTimeout()允许在完全关闭警报之前显示图像采集窗口


    10.CameraOptions勘误表(同样只翻译iOS和安卓)

    。安卓

            .后置摄像头包括任何cameraDirection的结果值

            .allowEdit这个在安卓上运行结果未知,不建议使用!这个插件在作用本来是为了实现用户在设备上裁剪图像,但是用户可能会有不兼容的操作,导致这个插件崩溃。这个插件其实在大部分设备上是支持的,因为兼容(Google Plus Photos)这个插件,但是强制使用并不明智。如果这个功能对于你来说是很重要的,可以考虑其他的第三方插件,它们的功能一般很强大。

            .Camera.PictureSourceType.PHOTOLIBRARY和Camera.PictureSourceType.SAVEDPHOTOALBUM显示的都是设备的系统相册

            .如果图像未编辑(quality=100,correctOrientation=false,没有targetHeight或targetWidth指定),忽略encodingType,获取到的图片的编码是系统默认的。

    。iOS

            .当使用destinationType/FILE_URI时,照片保存在应用程序的临时目录中。当应用程序结束,这个临时存储会被删除。

            .当使用了destinationType.NATIVE_URI和sourceType.CAMERA,照片是否出存在系统相册是和saveToPhotoAlbum的值无关了的。

  • 相关阅读:
    IE9的兼容性
    element 弹框关闭报错
    时间选择器moment格式化存在时差问题
    项目常见bug
    函数封装——函数封装——函数封装
    element-ui 日期选择器范围时间限制
    vue + element 创建教程
    Html基础学习
    HTML、PHP、CSS、JS之间的关系
    vs连接MySQL
  • 原文地址:https://www.cnblogs.com/BetterMyself/p/7117158.html
Copyright © 2020-2023  润新知