phonegap入门--4 Camera 摄像头

2023-05-16

今天周六了,每次到了周六就不知道干嘛去,好没劲啊.有在北京的如果周六也没劲的,可以联系我大家一起出去玩,qq598660766.

没事干,那就写写博客吧,今天介绍一下Camera这个对象.camera对象提供对设备默认摄像头应用程序的访问.

Camera提供了两个方法:

camera.getPicture
camera.cleanup

在使用Camera对象之前需要配置一下:

app/res/xml/config.xml
<plugin name="Camera" value="org.apache.cordova.CameraLauncher" />

app/AndroidManifest
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />

首先介绍第一个方法:

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

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

对于cameraOptions 在后面会介绍,这个主要是使用这个方法时候的配置参数.

camera.getPicture函数打开设备的默认摄像头应用程序,使用户可以拍照(如果 Camera.sourceType 设置为 Camera.PictureSourceType.CAMERA,这也是默认值)。一旦拍照结束,摄像头应用程序会关闭并恢复用户应用程序。
如果Camera.sourceType = Camera.PictureSourceType.PHOTOLIBRARY或Camera.PictureSourceType.SAVEDPHOTOALBUM,系统弹出照片选择对话框,用户可以从相集中选择照片。
返回值会按照用户通过cameraOptions参数所设定的下列格式之一发送给cameraSuccess回调函数:
一个字符串,包含Base64编码的照片图像(默认情况)。
一个字符串,表示在本地存储的图像文件位置。


下面看一个简单的例子

<!DOCTYPE html>
<html>
  <head>
    <title>Capture Photo</title>

    <script type="text/javascript" charset="utf-8" src="js/cordova-2.6.0.js"></script>
    <script type="text/javascript" charset="utf-8">

    var pictureSource;  //设定图片来源
    var destinationType; //选择返回数据的格式

    document.addEventListener("deviceready",onDeviceReady,false);

    // Cordova准备好了可以使用了
    function onDeviceReady() {
        pictureSource=navigator.camera.PictureSourceType;
        destinationType=navigator.camera.DestinationType;
    }

    function onPhotoDataSuccess(imageData) {
      // base64 encoded image data
      var smallImage = document.getElementById('smallImage');

      smallImage.style.display = 'block';
	  //在使用base64编码的时候需要使用这样的前缀
      smallImage.src = "data:image/jpeg;base64," + imageData;
    }

    // Called when a photo is successfully retrieved
    //
    function onPhotoURISuccess(imageURI) {
      // image file URI 
      var largeImage = document.getElementById('largeImage');
      largeImage.style.display = 'block';
	  //使用image file URI 直接赋值就可以了
      largeImage.src = imageURI;
    }

    // 第一个按钮调用函数
    function capturePhoto() {
      navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50,
        destinationType: destinationType.DATA_URL });
    }

	//第二个按钮调用的函数
    function capturePhotoEdit() {
      navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 20, allowEdit: true,
        destinationType: destinationType.DATA_URL });
    }

    //第三/四个按钮调用的函数
    function getPhoto(source) {
      // Retrieve image file location from specified source
      navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 50, 
        destinationType: destinationType.FILE_URI,
        sourceType: source });
    }

    function onFail(message) {
      alert('Failed because: ' + message);
    }

    </script>
  </head>
  <body>
    <button οnclick="capturePhoto();">Capture Photo</button> <br>
    <button οnclick="capturePhotoEdit();">Capture Editable Photo</button> <br>
    <button οnclick="getPhoto(pictureSource.PHOTOLIBRARY);">From Photo Library</button><br>
    <button οnclick="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>

运行效果如下:


小图片是第一二个按钮拍照后显示的地方,大图片是三四按钮从相簿中选择后显示的.

下面介绍cameraOptions:

一般格式如下:

{ quality : 75,
  destinationType : Camera.DestinationType.DATA_URL,
  sourceType : Camera.PictureSourceType.CAMERA,
  allowEdit : true,
  encodingType: Camera.EncodingType.JPEG,
  targetWidth: 100,
  targetHeight: 100,
  popoverOptions: CameraPopoverOptions,
  saveToPhotoAlbum: false };

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同时使用。相应的宽高比保持不变。(数字类型)

这些属性并不是在所有的设备上都起作用,具体的每个设备的支持情况还请参照官方文档.


下面介绍第二个方法

camera.cleanup

清空使用摄像头拍照时候产生的缓存文件.

当我们使用如下参数的时候会产生临时文件,这时候使用这个方法会及时的清楚临时文件.

Camera.sourceType = Camera.PictureSourceType.CAMERA and Camera.destinationType = Camera.DestinationType.FILE_URI

使用方法如下:

navigator.camera.cleanup( cameraSuccess, cameraError );

这个方法的回调方法中没有参数,只是去调用对应的方法,可以在对应的方法中alert一些东西,判断是否清空了.


本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

phonegap入门--4 Camera 摄像头 的相关文章

  • THREE.js 正交相机缩放到鼠标点

    我正在为我们的 THREE js 应用程序开发正交相机 本质上 该相机将以 2D 方式向用户呈现场景 用户可以选择在 2D 和 3D 相机之间切换 该相机将允许平移和缩放到鼠标点 我可以进行平移 也可以进行缩放 但不能缩放到鼠标点 这是我的
  • 来自相机的原始图像数据

    我一直在这个论坛上上下搜索 但找不到我真正需要的东西 我想从相机获取原始图像数据 到目前为止 我尝试通过该方法从 imageDataSampleBuffer 中获取数据captureStillImageAsynchronouslyFromC
  • 将预览帧转换为位图

    我知道这个主题已经在黑板上出现过很多次了 但无论如何我都无法让它发挥作用 我想将预览中的视图帧保存为 jpeg 文件 它看起来或多或少 代码被简化 没有额外的逻辑 异常等 像这样 public void onPreviewFrame byt
  • Zxing扫描仪相机变焦

    我已经尝试解决这个问题3天了 但仍然没有找到答案 我想在通过 Zxing 扫描仪扫描二维码时向相机添加 ZOOM 构建 gradle implementation me dm7 barcodescanner zxing 1 9 8 Xml
  • 不确定如何使用 CICrop 裁剪图像

    我正在尝试使用 CICrop 裁剪图像 但是当我尝试裁剪时 它崩溃并显示以下错误消息 由于未捕获的异常 NSUnknownKeyException 而终止应用程序 原因 setValue forUndefinedKey 这个类 不符合键的键
  • 在网络应用程序中从网络摄像头或移动摄像头拍照

    我正在开发一个网络应用程序 可以从本地浏览和拍照 而且我想通过相机捕获图像 我使用以下代码 我可以捕获设备相机
  • 如何在没有 Windows iTunes 的情况下在 iPhone 上安装 IPA [已关闭]

    Closed 这个问题是与编程或软件开发无关 help closed questions 目前不接受答案 在没有 Mac 或不使用 iTunes 的情况下 如何在 iPhone 上安装 iPhone 应用程序 IPA 另外 如果这还不够困难
  • 在 Windows 8.1 平板电脑上的 Web 应用程序中捕获图像

    我即将开发一个在 Windows 8 1 平板电脑上运行的应用程序 一个重要的功能是能够单击按钮来访问相机来拍摄一些照片 理想情况下 我想将其创建为Web应用程序由于多种原因 许可证 跨平台 开发时间 没有本机应用程序经验等 而不是本机应用
  • Windows Mobile:通过 C# 使用手机摄像头

    我想展示手机摄像头在 WinForm 中的控件的图像 我的想法是我的应用程序就像相机的程序一样工作 我想显示图像 就像用户要拍照一样 我怎样才能做到这一点 我可以这样做吗 如果您需要更多详细信息 请询问我 谢谢你 不太确定您需要什么 但您可
  • 适用于图片和视频的 Android 相机

    我想在我的 Android 应用程序中启动相机活动 并且我知道该怎么做 我想问当相机活动结束时 如何检查是否是用户拍摄的照片或视频 UPDATED 我有一个对话框 它询问两件事 新照片或视频 现有照片或视频 如果没有的话 1 这意味着相机将
  • 访问 iOS 6 新 API 以获取相机曝光和快门速度

    在苹果的iOS 6 0 功能页面 https developer apple com technologies ios6 过去常说 利用内置摄像头的高级功能 新的 API 可让您控制焦点 曝光和感兴趣区域 您还可以使用人脸检测 API 访问
  • 关闭 Android 中的自动对焦

    这是在我的应用程序代码中关闭相机自动对焦的任何方法 我想检查如果手机没有自动对焦功能 我的扫描仪如何工作 但我的手机有该功 能 Use FOCUS MODE INFINITY http developer android com refer
  • 如何检测位图中的红色像素

    android中的getPixels 是上下左右读取像素 还是左右上下读取像素 基本上是按行或列读取 如果我想知道图片中的红色值较高的位置 我可以这样做吗 我假设它是按列读取的 Bitmap thumbnail Bitmap data ge
  • iOS:同时使用 WiFi 和移动数据

    Setup 我的项目涉及一个 WiFi 相机 它创建一个 WiFi 热点 为了在相机上流式传输视频预览 浏览媒体 用户需要连接到相机的热点 Problem 用户无法同时使用 3G 4G 上的蜂窝数据 因为 iOS 设备已通过 WiFi 连接
  • 如何使用 UIImagePickerController CropRect

    我刚刚找到了一种方法来更改裁剪框的矩形 该裁剪框在捕获图像后出现UIImagePickerViewController 这可以在以下帮助下完成UIImagePickerControllerCropRect 但我不知道如何使用它 最初的裁剪框
  • ipad 2相机支持检测

    我有一个使用以下宏的应用程序 define IS IPAD UIDevice currentDevice respondsToSelector selector userInterfaceIdiom UIDevice currentDevi
  • 如何在 AVCaptureDevice 上准确设置快速快门速度(曝光时间)?

    我正在开发适用于 IOS 13 的相机应用程序 为此 我将 AVCaptureSession 与 AVCaptureVideoPreviewLayer 结合使用 到目前为止一切正常 现在我想让用户从给定的典型快门速度值数组 以 1 3 曝光
  • 在 iOS 8 中呈现相机权限对话框

    当我的应用程序在 iOS 8 上第一次尝试访问摄像头时 会向用户显示一个摄像头权限对话框 很像 iOS 7 中用于访问麦克风的麦克风对话框 在 iOS 7 中 可以预先调用麦克风权限对话框并查看是否授予了权限 请参阅这个问题 https s
  • 手电筒打开时 Android 相机的奇怪行为

    我有以下 android 代码 这里用伪代码编写 mCamera configAndInitialize all I want to do before taking picture mCamera startPreview mCamera
  • 相机预览的有效模糊

    到目前为止我尝试过的 将每一帧转换为位图 然后用library https github com wasabeef Blurry并将其放入ImageView这是在相机预览前 显然太慢了 就像1 fps 然后我开始使用渲染脚本这会模糊每一帧

随机推荐

  • 美团技术十年:让我们感动的那些人那些事

    时光荏苒 xff0c 美团十岁了 xff0c 美团技术团队也走过了十个春秋 2010年3月4日美团网上线的时候 xff0c 整个公司总共十来人 xff0c 在一套三居室的民房里起步 其中技术团队只有5个人 xff0c 现在有4位还在美团 今
  • linux update kernel

    1 update source step 1 deb https mirrors zju edu cn ubuntu focal main restricted universe multiverse deb https mirrors z
  • sql基础知识left join,right join,inner join区别

    1 left join即以左表为主查出左边表对应的所有数据 lt pre name 61 34 code 34 class 61 34 sql 34 gt select from A left join B on A id 61 B pid
  • 明知 | TypeScript 结合 egg.js 基本使用

    小小又进入了学习状态 xff0c 此时小小由于最近接触了js的相关内容 xff0c 进而接触了一些ts相关的内容 xff0c 所以小小本次主要学习的内容是ts 安装相关依赖 这里安装两个依赖 xff0c 分别为egg和ts 安装ts 这里需
  • 数据库中like的用法

    转自 xff1a http www pinlue com article 2020 03 3100 0310073883813 html
  • Log4j 2使用教程

    转载自 Blog of 天外的星星 xff1a http www cnblogs com leo lsw p log4j2tutorial html Log4j 2的好处就不和大家说了 xff0c 如果你搜了2 xff0c 说明你对他已经有
  • http常见的响应状态码

    HTTP响应状态码分类 1XX xff1a 100 199 信息响应 2XX xff1a 200 299 成功响应 3XX xff1a 300 399 重定向 4XX xff1a 400 499客户端错误 5XX xff1a 500 505
  • vncserver无法启动

    一 问题现象 运行vncserver的时候提示出错 xff0c 查看vnc的日志发现如下错误日志 litin 64 linuxService vnc cat linuxService 4 log Xvnc Free Edition 4 1
  • MongoDB自学笔记12---4.4 更新文档

    4 4 更新文档 Mongodb的增删查都已经学完了 xff0c 只剩下更新了 在mongodb中提供了update 和save 方法用于更新一个文档 xff0c update 是使用最多的 xff0c save 在前面4 1插入文档的时候
  • ffmpeg重要结构体之AVCodec和AVIOContext

    今天继续讲解ffmpeg结构体AvCodec和AVIOContext以便加深对ffmpge的理解 一 AVCodec的讲解 AVCodec结构体是有关codec的结构体 在文件 34 libavcodec avcodec h 34 中 其中
  • xcode6制作framework(使用第三方依赖框架)

    这两天由于会用到framework所以研究了一下framework的制作 xff0c 我用到了xcode6 1 AFNetworing 转载请注明http blog csdn net mengxiangyue 废话不多说了 xff0c 下面
  • OC项目中使用Swift

    OC项目中使用Swift 本文版权归作者所有 xff0c 如需转载请联系孟祥月 CSDN博客 xff1a http blog csdn net mengxiangyue 独立博客 xff1a http mengxiangyue com 最近
  • iOS9-by-Tutorials-学习笔记六:UIStackView-Auto-Layout-Changes

    iOS9 by Tutorials 学习笔记六 xff1a UIStackView Auto Layout Changes 本文版权归作者所有 xff0c 如需转载请联系孟祥月 CSDN博客 xff1a http blog csdn net
  • Java多线程4—线程同步问题+火车票售票系统

    在上一篇文章中写到了许多线程共享同一数据 xff0c 这种情况在现实的生活中也是经常发生的 xff0c 比如火车站的火车票售票系统 火车票售票系统是一个常年运行的系统 xff0c 为了满足乘客的需求 xff0c 我们不能只设一个窗口 xff
  • Java模拟操作系统进程调度算法—先来先服务、短作业优先、高响比优先

    首先我们先介绍一下这三个算法 xff0c 先来先服务是指按照进程到来的时间 xff0c 谁先来谁执行 短作业优先是指作业服务时间短的先执行 高响比优先是根据公式计算出优先权选出优先权最高的执行 xff0c 计算高响比优先权的公式 xff1a
  • Java中JTbale使用—设置单元格对齐方式

    作者 xff1a 孟祥月 博客 xff1a http blog csdn net mengxiangyue import java awt Color import java awt Component import javax swing
  • Spring Cloud 入门(1)-- 第一个 Kotlin 微服务

    最近公司需要使用 Spring Cloud 开发后台应用 xff0c 为了以后能够看懂后台代码 xff0c 所以决定学习一下 Spring Cloud 对于Spring Cloud和微服务的介绍 xff0c 各位自行网上搜索吧 本系列文章是
  • Spring Cloud 入门(2)-- 编写服务消费者

    上一篇文章创建了一个 user service 微服务 xff0c 本文编写一个消费者 xff0c 本文比较简单 1 目标 创建一个 movie service xff0c 该服务器也能够查询用户信息 xff0c 但是内部是通过调用 use
  • jquerymobile-7 导航和多页面固定导航

    在开发的过程中 xff0c 我们经常会遇到在页面的底部有一排按钮 xff0c 我们可以根据这些按钮切换页面 xff0c 或者执行一些动作 在jquerymobile中我们可以在footer和header上添加这样的导航 下面看一个例子代码
  • phonegap入门--4 Camera 摄像头

    今天周六了 每次到了周六就不知道干嘛去 好没劲啊 有在北京的如果周六也没劲的 可以联系我大家一起出去玩 qq598660766 没事干 那就写写博客吧 今天介绍一下Camera这个对象 camera对象提供对设备默认摄像头应用程序的访问 C