1.官网:

  https://ionicframework.com/docs/native/camera/#DestinationType

2.引入插件

$ ionic cordova plugin add cordova-plugin-camera
$ npm install --save @ionic-native/camera

3.在app.module.ts里面引用

  import { Camera } from '@ionic-native/camera';
  

  providers:[ Camera ]

4.新建一个CameraPage 用来作例子

  ts:

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { Camera,CameraOptions } from '@ionic-native/camera'; /**
* Generated class for the CameraPage page.
*
* See https://ionicframework.com/docs/components/#navigation for more info on
* Ionic pages and navigation.
*/ @IonicPage()
@Component({
selector: 'page-camera',
templateUrl: 'camera.html',
})
export class CameraPage { public base64Image; constructor(public navCtrl: NavController, public navParams: NavParams,public camera:Camera) {
} doCamera(){
const options: CameraOptions = {
quality: ,//图片质量
destinationType: this.camera.DestinationType.DATA_URL,//返回base64地址
encodingType: this.camera.EncodingType.JPEG, sourceType:this.camera.PictureSourceType.CAMERA,
// mediaType: this.camera.MediaType.PICTURE,
allowEdit:true,
targetWidth:, /*宽度高度要设置*/
targetHeight:,
saveToPhotoAlbum:true,
} this.camera.getPicture(options).then((imageData) => {
this.base64Image = 'data:image/jpeg;base64,'+imageData; //拍照地址
console.log(this.base64Image);
}, (err) => { });
} }

  html:

<ion-content padding>
<button ion-button color="secondary" (click)="doCamera()">拍照</button>
<img *ngIf="base64Image" [src]="base64Image" />
<a>{{base64Image}}</a>
</ion-content>

5.照相机参数

ionic 照相机 Camera的更多相关文章

  1. ionic ngcordova camera

    拍照是經常用到的,所以記錄一下 拍照的代碼... 1. ionic start camera blankcd camera ionic platform add ios 2. 添加插件,這裏很熟悉.. ...

  2. libgdx学习记录17——照相机Camera

    照相机在libgdx中的地位举足轻重,贯穿于整个游戏开发过程的始终.一般我们都通过Stage封装而间接使用Camera,同时我们也可以单独使用Camera以完成背景的移动.元素的放大.旋转等操作. C ...

  3. android 自定义照相机Camera黑屏 (转至 http://blog.csdn.net/chuchu521/article/details/8089058)

    对于一些手机,像HTC,当自定义Camera时,调用Camera.Parameters的 parameters.setPreviewSize(width, height)方法时,如果width和hei ...

  4. Android Camera进行拍照

    Android应用提供了Camera来控制拍照,使用Camera进行拍照的步骤: 1.调用Camera的open()方法打开相机. 2.调用Camera的getParameters()方法获取拍照参数 ...

  5. Android平台之不预览获取照相机预览数据帧及精确时间截

    在android平台上要获取预览数据帧是一件极其容易的事儿,但要获取每帧数据对应的时间截并不那么容易,网络上关于这方面的资料也比较少.之所以要获取时间截,是因为某些情况下需要加入精确时间轴才能解决问题 ...

  6. Android之Camera控制拍照

    package com.android.xiong.cameratest; import java.io.File; import java.io.FileOutputStream; import j ...

  7. Android自定义照相机实现(拍照、保存到SD卡,利用Bundle在Acitivity交换数据)

    Android自定义照相机实现 近期小巫在学校有一个创新项目,也不是最近,是一个拖了很久的项目,之前一直没有去搞,最近因为要中期检查,搞得我跟小组成员一阵忙活,其实开发一款照相机软件并不太难,下面就是 ...

  8. C#开发移动应用系列(3.使用照相机扫描二维码+各种基础知识)

    前言 上篇文章地址: C#开发移动应用系列(1.环境搭建) C#开发移动应用系列(2.使用WebView搭建WebApp应用) 今天我们来讲一下如何使用Camera来调用照相机扫描二维码. (Tips ...

  9. threejs CameraHelper 查看照相机的观察范围

    简单例子 这个例子,是在一个视图中,看到照相机的辅助线,也就是,一个照相机的观察访问 这样,就需要两个照相机,一个是主照相机,一个是加有辅助线的照相机(有两种,正交和透视,这里辅助的使用的是正交的) ...

随机推荐

  1. Failed to read HTTP message: org.springframework.http.converter.HttpMessageNotReadableException: Required request body is missing: public xxxxxxxx.

    最近在使用 springBoot开发的时候, 使用PostMan访问接口,  返回一个 404 ,  后台报一个 warn : Failed to read HTTP message: org.spr ...

  2. Gym 101911F “Tickets”

    传送门 题意: 给你一个由六位数字组成的门票编码x,并定义F(x) = | 前三位加和 - 后三位加和|: 求出给定的门票编码 x 之前并且 F(i) < F(x) 的 i 的总个数. 题解: ...

  3. echarts柱状图鼠标移动在柱状图上显示数据给数据添加单位

    解决问题: 关键代码如下: tooltip : { trigger: 'axis', formatter:function(params){ return params[0].name+"& ...

  4. SCU-4437 Carries

    https://blog.csdn.net/catglory/article/details/46539283 https://blog.csdn.net/u012127882/article/det ...

  5. Luogu P4768 [NOI2018]归程

    题目链接 \(Click\) \(Here\) \(Kruskal\)重构树的好题.想到的话就很好写,想不到乱搞的难度反而相当高. 按照点的水位,建出来满足小根队性质的\(Kruskal\)重构树,这 ...

  6. MYSQL二进制5.7.安装

    一.下载MySQL二进制软件包 下载连接:MYSQ安装包下载 官网MySQL有四个版本:GA版.DMR版.RC版.Beta版.一般生产和测试环境使用GA版(常规可用的版本,经过bug修复测试) 二.安 ...

  7. 【3D动画建模设计工具】Maxon Cinema 4D Studio for Mac 20.0

    图标 Icon   软件介绍 Description Maxon Cinema 4D Studio R20 ,是由德国公司Maxon Computer一款适用于macOS系统的3D动画建模设计工具,是 ...

  8. maven编译或者打包web项目显示“软件包 javax.servlet.http 不存在"

    2.解决办法: 这是由于缺少servlet-api.jar包,其实tomcat下有,但是在java build path把他加载过来,还是报这个错误,所以我们直接在pom.xml里面加入这个jar包即 ...

  9. jQuery_parent() parents() closest()区别

    parent 是找当前元素的第一个父节点,不管匹不匹配都不继续往下找 parents 是找当前元素的所有父节点  closest 是找当前元素的所有父节点 ,直到找到第一个匹配的父节点 <%@ ...

  10. Hadoop基础-MapReduce入门篇之编写简单的Wordcount测试代码

    Hadoop基础-MapReduce入门篇之编写简单的Wordcount测试代码 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 本文主要是记录一写我在学习MapReduce时的一些 ...