一、简介

开源软件 https://github.com/phonegap/phonegap-plugin-barcodescanner 可以支持各种类型的扫描,包括二维码等等……

  • QR Code

  • Data Matrix

  • UPC E

  • UPC A

  • EAN 8

  • EAN 13

  • Code 128

  • Code 39

  • ITF

插件内部使用类库 https://github.com/zxing/zxing

二、安装插件

首先准备项目:

ionic start IonicProject blank

cd IonicProject

ionic platform add android

ionic platform add ios

1、安装插件

This requires phonegap 5.0+ ( current stable v3.0.0 )

phonegap plugin add phonegap-plugin-barcodescanner

Older versions of phonegap can still install via the deprecated id ( stale v2.0.1 )

phonegap plugin add com.phonegap.plugins.barcodescanner

It is also possible to install via repo url directly ( unstable )

phonegap plugin add https://github.com/phonegap/phonegap-plugin-barcodescanner.git

2、下载 ng-cordova 相应 js

下载 https://github.com/driftyco/ng-cordova/releases

将其中的 ng-cordova.min.js 拷贝到项目的 www/js 目录

修改 index.html 代码

<script src="lib/ionic/js/ionic.bundle.js"></script>

<script src="js/ng-cordova.min.js"></script>

<script src="cordova.js"></script>

<script src="js/app.js"></script>

三、使用类库

1、修改 app.js

angular.module('starter', ['ionic', 'ngCordova'])

2、使用扫描功能

exampleApp.controller("ExampleController", function($scope, $cordovaBarcodeScanner) {

$scope.scanBarcode = function() {

$cordovaBarcodeScanner.scan().then(function(imageData) {

alert(imageData.text);

console.log("Barcode Format -> " + imageData.format);

console.log("Cancelled -> " + imageData.cancelled);

}, function(error) {

console.log("An error happened -> " + error);

});

};

});

转载于:https://www.cnblogs.com/hugofgh/p/5053478.html

ionic 组件之二维码扫描相关推荐

  1. ionic+Angular 手机二维码扫描

    ionic+Angular 手机二维码扫描 HTML 主要二维码插件 npm install @ionic-native/qr-scanner/ngx <ion-header class=&qu ...

  2. 基于Capacitor编写Ionic React二维码扫描应用

    在上一篇文章中,我们简要演示了如何使用capacitor-plugin-dynamsoft-barcode-reader构建跨平台二维码扫描应用.在本文中,我们将使用Ionic React来构建一个二 ...

  3. Ionic—二维码扫描与关于模块的开发

    一.二维码扫描功能布局开发 1.开发设计 功能需求:布局二维码扫描页面 二维码扫描在Ionic Native中为QS Scanner插件,安装如下 sudo ionic cordova plugin ...

  4. H5混合开发二维码扫描教程之大圣众娱十人牛牛源码搭建架设

    今天用H5调用本地摄像头进行扫描二维码,我之前有做过原生安卓的二维码扫一扫,主要是通过调用zxing插件进行操作的,其中还弄了个闪光灯.但是纯H5的没接触过,心里没底,于是晚上回家开始网上各处找方案. ...

  5. React Native之二维码扫描

    请使用react-native-smart-barcode组件 以下内容是2016年的内容 下文指出的组件已经不再维护 我们知道在android原生开发中,我们经常要用到二维码扫描的功能,在微信.QQ ...

  6. 使用安卓实现一个二维码扫描功能(基于Android Studio)

    二维码扫描使用很广泛,在这里记录二维码扫描的功能,需要导入第三方的类库. 步骤一:在项目中导入第三方的类库,导入方法:往Android Studio中导入第三方类库文件这篇博客中有详细记录 步骤二:定 ...

  7. js 二维码扫描盒/枪对接

    二维码扫描盒/枪对接 前言 二维码应用非常广泛,使用场景有:手机上网.个人名片.凭证类.溯源类.数据防伪等等,如下图: 使用也非常简单,外接USB接口, 如下图,以下就是我对接的盒子 原理 ​ 拿到二 ...

  8. Android 9 实现二维码扫描处理(BGAQRCode-Android) 笔记

    首先声明,本笔记是在下面这位大佬的代码基础上改的,本人会将实现过程中出现的问题和经验写在下面,本笔记可以结合github上作者的readme一起看: https://github.com/bingoo ...

  9. 完整的二维码扫描解决方案

    现在的应用都有自己的二维码扫描工具,最近接手的项目也不例外,集成了ZXing二维码扫描,但是用起来却实在差强人意,后来看到QrCodeReaderView效果不错,识别速度上有明显提高,而且使用也非常 ...

最新文章

  1. Unity C# Sting.Format的学习
  2. 程序 峰谷值 提取_医学影像组学特征值(Radiomics Features)提取之Pyradiomics(一)理论篇...
  3. SpringBoot+Swagger2.7.0实现汉化(2.8.0不行)
  4. 管家婆SQL SERVER数据库“可能发生了架构损坏。请运行DBCC CHECKCATALOG”修复
  5. NOX的使用之学习篇【三】
  6. 2021年已经过去了4天,创业者、负债累累而希望通过再创业实现东山再起者,你们准备的怎么样了?
  7. java盛最多水的容器_Leetcode刷题java之11. 盛最多水的容器(top100)
  8. Flutter进阶第2篇:Dio库实现网络请求以及动态渲染数据
  9. 从主机 Windows 上无法远程访问 Linux 的 Tomcat 服务器解决方法
  10. 8021x 获取IP信息失败,请检查锐捷认证客户端当前配置是否符合所在网络的要求,检查完毕后尝试重新认证...
  11. 计算机病毒与木马的区别,计算机病毒和木马的区别
  12. 哪个ei期刊容易过计算机专业,计算机期刊哪个好中_ei期刊计算机_计算机八大核心期刊...
  13. FS4052单节2A充电IC采用三段式充电管理IC
  14. android自动播放音乐代码,Android MediaPlayer实现音乐播放器实例代码
  15. git基础教程(47)设置全局.gitignore
  16. 网络安全——WEP实现无线局域网安全
  17. excel保存快捷键_知心小虎| Excel 中常用的快捷键(第十一期)
  18. 在LInux系统上安装ImageMagick
  19. (java)判断a是奇数还是偶数
  20. 【Lilishop商城】No4-1.业务逻辑的代码开发,涉及到:会员B端第三方登录使用及后端接口(微信、QQ等)

热门文章

  1. TransactionScope和分布式事务的注意点
  2. JMeter使用命令行模式生成HTML测试报告
  3. 百度联盟广告代码php,百度联盟原生广告的投放步骤
  4. sqlserver 没有维护计划_制定数据库备份计划,不再为数据丢失闹心!
  5. android9 前台服务通知_Android通知概览
  6. 与孩子一起学编程python_与孩子一起学编程(Python读书笔记3)
  7. 动态网页和静态网页的区别是什么?
  8. 前端工作、学习中常用工具推荐
  9. 单例模式、使用getInstance()方法的原因及作用
  10. java初_JAVA的初体验