phonegap安卓环境下使用BarcodeScanner插件扫描二维码教程
由于一直在使用phoneGap来开发安卓应用,而对于原生Java小白的我最近这几天一直陷入了如何使用phonegap的BarcodeScanner插件这件事情上,可以说查遍了百度和Google,虽然只是一个小小的二维码的功能,但是这里面还是让我学到了许多开发安卓应用的内容,一起共勉吧。
首先,告诉大家的是
1、我使用的phonegap版本是2.9.0,当然对于phonegap版本的东西我也不太了解,不过可以保证的是phonegap2.0.0之后的按照我这种办法来实现二维码是没有问题的。
2、phonegap的插件都是放在github上托管的,大家可以Google一下或者到http://www.github.com搜索下载
下载插件之后是这样名字的压缩包
解压之后会看到
这里面最最重要的东西在 src 文件夹中
图片中划红线的文件可以说是有很多学问在里面了,我们在开发任何项目的时候都会将一些公用的文件封装好,然后就可以在任何地方使用,而这种思想在开发Android应用的时候同样适用,只不过在Android这里这种思想有一个名字叫做 Android Library,也就是图片这个LibraryProject就是已经给我们提供好的一个实现二维码的Android Library,但是这样的文件夹我们又不能直接拿来用,我们需要在ADT当中将这个LibraryProject引入到我们的一个公共二维码项目中去,具体的安装方法,查看
好了,当你已经将这个LibraryProject加入到项目中去后,结果会是这个样子的
还是重申一遍,这个叫做CaptureActivity的项目作为一个实现二维码功能的公共项目存在,我可以在Project1中使用这个CaptureActivity,也可以在Project2中使用这个CaptureActivity,也就是它作为一个公共项目存在,在其他项目中可以随时使用它。
接下来就开始看我们如何来实现二维码功能了,首先新建一个项目,比如叫做QRcode
将安卓项目配置成phonegap项目,引入phonegap-x.x.x.jar xml文件夹 phonegap-x.x.x.js,具体的操作步骤可以查看我的另一篇文章,当然这里说的有点多余。
配置完成之后是这个样子的
然后将CaptureActivity引入,右键QRcode项目,看到properties,点击左侧Android,右侧下面有个add,会看到之前已经引入的CaptureActivity,(isLibrary一定不要点),点击OK。
将下载下来的文件夹中的这些内容移动到项目目录中去,看下图
这个BarcodeScanner.java会报错,
报错1:
将这行代码改为 package com.example.qrcode; 即可,也就是
报错2:
解决办法很简单,按住Ctrl+shift + o 就可以将需要的包导进来了,这下就不会有错误了。
也差不多接近尾声了,需要配置一个非常重要的东西,叫做 AndroidManifest.xml,在它的<application>标签中添加如下代码
<!-- ZXing activities -->
<activity android:name="com.google.zxing.client.android.CaptureActivity"
android:screenOrientation="landscape"
android:clearTaskOnLaunch="true"
android:configChanges="orientation|keyboardHidden"
android:theme="@android:style/Theme.NoTitleBar.Fullscreen"
android:windowSoftInputMode="stateAlwaysHidden"
android:exported="false">
<intent-filter>
<action android:name="com.phonegap.plugins.barcodescanner.SCAN"/>
<category android:name="android.intent.category.DEFAULT"/>
</intent-filter>
</activity>
<activity android:name="com.google.zxing.client.android.encode.EncodeActivity" android:label="@string/share_name">
<intent-filter>
<action android:name="com.phonegap.plugins.barcodescanner.ENCODE"/>
<category android:name="android.intent.category.DEFAULT"/>
</intent-filter>
</activity>
<activity android:name="com.google.zxing.client.android.HelpActivity" android:label="@string/share_name">
<intent-filter>
<action android:name="android.intent.action.VIEW"/>
<category android:name="android.intent.category.DEFAULT"/>
</intent-filter>
</activity>
这里的配置也就是使用外部CaptureActivity那个公共项目的关键,当然还需要在Manifest中写入权限,将
<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.VIBRATE" />
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.RECEIVE_SMS" />
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.RECORD_VIDEO"/>
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
<uses-permission android:name="android.permission.READ_CONTACTS" />
<uses-permission android:name="android.permission.WRITE_CONTACTS" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.GET_ACCOUNTS" />
<uses-permission android:name="android.permission.BROADCAST_STICKY" /> <uses-feature android:name="android.hardware.camera" />
<uses-feature android:name="android.hardware.camera.autofocus" />
加入到</application>之后
配置res/xml/config.xml文件,在<plugins>标签中添加
<plugin name="BarcodeScanner" value="com.example.qrcode.BarcodeScanner"/>
其中com.example.qrcode也就是,之后的BarcodeScanner也就是那个引入的Java文件。
具体的配置过程就完成了,接下来需要通过JS来使用了,在assets文件中有个www文件夹(没有的创建一下),将phone-x.x.x.js和 下载下来的文件夹中的barcodescanner.js引入到www文件夹中,实际上下载下来的这个barcodescanner.js是用不了的,我把我的这个JS文件贴到这里,可以复制之后然后自己新建一个barcodescanner.js
barcodescanner.js
/**
* cordova is available under *either* the terms of the modified BSD license *or* the
* MIT License (2008). See http://opensource.org/licenses/alphabetical for full text.
*
* Copyright (c) Matt Kane 2010
* Copyright (c) 2011, IBM Corporation
*/ cordova.define("cordova/plugins/barcodescanner",
function(require, exports, module) {
var exec = require("cordova/exec");
var BarcodeScanner = function() {}; //-------------------------------------------------------------------
BarcodeScanner.prototype.scan = function(successCallback, errorCallback) {
if (errorCallback == null) { errorCallback = function() {}} if (typeof errorCallback != "function") {
console.log("BarcodeScanner.scan failure: failure parameter not a function");
return
} if (typeof successCallback != "function") {
console.log("BarcodeScanner.scan failure: success callback parameter must be a function");
return
} exec(successCallback, errorCallback, 'BarcodeScanner', 'scan', []);
}; //-------------------------------------------------------------------
BarcodeScanner.prototype.encode = function(type, data, successCallback, errorCallback, options) {
if (errorCallback == null) { errorCallback = function() {}} if (typeof errorCallback != "function") {
console.log("BarcodeScanner.scan failure: failure parameter not a function");
return
} if (typeof successCallback != "function") {
console.log("BarcodeScanner.scan failure: success callback parameter must be a function");
return
} exec(successCallback, errorCallback, 'BarcodeScanner', 'encode', [{"type": type, "data": data, "options": options}]);
}; var barcodeScanner = new BarcodeScanner();
module.exports = barcodeScanner; }); cordova.define("cordova/plugin/BarcodeConstants",
function(require, exports, module) {
module.exports = {
Encode:{
TEXT_TYPE: "TEXT_TYPE",
EMAIL_TYPE: "EMAIL_TYPE",
PHONE_TYPE: "PHONE_TYPE",
SMS_TYPE: "SMS_TYPE",
}
};
});
//-------------------------------------------------------------------
var BarcodeScanner = cordova.require('cordova/plugin/BarcodeConstants'); if(!window.plugins) {
window.plugins = {};
}
if (!window.plugins.barcodeScanner) {
window.plugins.barcodeScanner = cordova.require("cordova/plugins/barcodescanner");
}
需要的配置和文件都已经准备好了,接下来需要建立一个index.html文件来使用扫描二维码了,很兴奋噢!!
index.html
<html>
<head>
<script src="phonegap-2.9.0.js" type="text/javascript"></script>
<script src="barcodescanner.js" type="text/javascript"></script>
<script type="text/javascript">
var scanCode = function() {
window.plugins.barcodeScanner.scan(
function(result) {
alert("Scanned Code: " + result.text
+ ". Format: " + result.format
+ ". Cancelled: " + result.cancelled);
}, function(error) {
alert("Scan failed: " + error);
});
}
var encodeText = function() { window.plugins.barcodeScanner.encode(
BarcodeScanner.Encode.TEXT_TYPE,
"http://www.mobiledevelopersolutions.com",
function(success) {
alert("Encode success: " + success);
}, function(fail) {
alert("Encoding failed: " + fail);
});
}
var encodeEmail = function() { window.plugins.barcodeScanner.encode(
BarcodeScanner.Encode.EMAIL_TYPE,
"a.name@gmail.com", function(success) {
alert("Encode success: " + success);
}, function(fail) {
alert("Encoding failed: " + fail);
});
}
var encodePhone = function() { window.plugins.barcodeScanner.encode(
BarcodeScanner.Encode.PHONE_TYPE,
"555-227-5283", function(success) {
alert("Encode success: " + success);
}, function(fail) {
alert("Encoding failed: " + fail);
});
}
var encodeSMS = function() { window.plugins.barcodeScanner.encode(
BarcodeScanner.Encode.SMS_TYPE,
"An important message for someone.", function(success) {
alert("Encode success: " + success);
}, function(fail) {
alert("Encoding failed: " + fail);
});
}
</script>
</head>
<body>
hello 二维码!
<input type="button" onclick="scanCode()" value="扫描"/>
<input type="button" onclick="encodeText()" value="转换文本"/>
<input type="button" onclick="encodeEmail()" value="转换邮箱地址"/>
</body>
</html>
本文系转载:原文:http://blog.csdn.net/u014646984/article/details/25655725
写的非常详细,值得收藏。
phonegap安卓环境下使用BarcodeScanner插件扫描二维码教程的更多相关文章
- Cordova各个插件使用介绍系列(二)—$cordovaBarcodeScanner扫描二维码与生成二维码
详情链接地址:http://www.ncloud.hk/%E6%8A%80%E6%9C%AF%E5%88%86%E4%BA%AB/cordova-2-cordovabarcodescanner/ 这是 ...
- Ionic2学习笔记(10):扫描二维码
作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5575843.html 时间:6/11/2016 说明: 在本文发表的时候(2016-06-1 ...
- C#开发移动应用系列(3.使用照相机扫描二维码+各种基础知识)
前言 上篇文章地址: C#开发移动应用系列(1.环境搭建) C#开发移动应用系列(2.使用WebView搭建WebApp应用) 今天我们来讲一下如何使用Camera来调用照相机扫描二维码. (Tips ...
- h5端呼起摄像头扫描二维码并解析
2016年6月29日补充: 最近做了一些与表单相关的项目,使用了h5的input控件,在使用过程中遇到了很多的坑.也包括与这篇文章相关的. 首先我们应该知道使用h5新提供的属性getUserMedia ...
- 实现手机扫描二维码页面登录,类似web微信-第二篇,关于二维码的自动生成
转自:http://www.cnblogs.com/fengyun99/p/3541251.html 接上一章,我们已经基本把业务逻辑分析清楚了 下面我们第一步,实现二维码的web动态生成. 页面的二 ...
- Android实例-实现扫描二维码并生成二维码(XE8+小米5)
相关资料: 第三方资料太大没法写在博文上,请下载CSDN的程序包. 程序包下载: http://download.csdn.net/detail/zhujianqiangqq/9657186 注意事项 ...
- ionic 扫描二维码 Barcode Scanner、QR Scanner、ZBar
1.简介 ionic 官方给我们提供了三个扫描二维码条形码插件,分别为: Barcode Scanner 样式好看,类似支付宝的扫描框.速度稍微比最后一个慢几百毫秒,主要问题是 Android 部分手 ...
- 使用vue做移动app时,调用摄像头扫描二维码
现在前端技术发展飞快,前端都能做app了,那么项目中,也会遇到调用安卓手机基层的一些功能,比如调用摄像头,完成扫描二维码功能 下面我就为大家讲解一下,我在项目中调用这功能的过程. 首先我们需要一个中间 ...
- 制作IOS企业版App网页扫描二维码下载安装
有时候我们需要在XX网站的主页上去扫描二维码下载,那么ios开发中如何做到这一点呢. 我给大家解答一下,这也是在最近工作中用到的部分,在网上了解了一些. 下面给大家分解一下步骤: 1.Plist 和 ...
随机推荐
- 解决jQuery中dbclick事件触发两次click事件
首先感谢这位小哥!http://qubernet.blog.163.com/blog/static/1779472842011101505853216/ 太长姿势了. 在jQuery事件绑定中,dbc ...
- C# 连接 数据库的时候 出现 程序出现异常"尝试读取或写入受保护的内存这通常指示其他内存已损坏" 错误
今天调试程序的时候出现了毫无征兆的就出现了如标题所述 的错误,我之前的程序 都运行的好好的,网上 找了 好多帖子 ,都是没有找到解决方案,最后 一个问一个同事 不知道他在哪儿找到了一个解决方案,说是 ...
- haproxy之负载均衡算法
backend blance 算法 动态hash的特点 服务器运行时就可进行权重调整,即只需要重新载入配置文件即可,不需要重新启动haproxy 支持慢速启动,即重新恢复的后端 ...
- numpy库:常用基本
numpy 本文主要列出numpy模块常用方法 大部分内容来源于网络,而后经过自己的一点思考和总结,如果有侵权,请联系我 我是一名初学者,有哪些地方有错误请留言,我会及时更改的 创建矩阵(采用ndar ...
- 1006 Do the Untwist
考察编程基础知识,用到字符和数字相互转化等.形式是描述清楚明文和暗文的转化规则. #include <stdio.h> #include <string.h> #define ...
- winform 窗口点击窗体任意位置移动窗体
private bool _isDown; private Point _mousePoint; private void Users_MouseDown(object sender, MouseEv ...
- hdu 1355 The Peanuts
http://acm.hdu.edu.cn/showproblem.php?pid=1355 #include <cstdio> #include <iostream> #in ...
- C# 动态Linq(结合反射)
这篇文章决定对最近一个单机版Web程序用到的东西总结一下. 一.反射Linq之OrderBy 动态Linq结合反射对某字段排序: namespace 动态Linq { class Program ...
- 转:Dynamic Binding Of RDLC To ReportViewer
Introduction I was struggling to find the solution to bind rdlc dynamically to reportviewer .We had ...
- 一次使用Eclipse Memory Analyzer分析Tomcat内存溢出
转:http://tivan.iteye.com/blog/1487855 前言 在平时开发.测试过程中.甚至是生产环境中,有时会遇到OutOfMemoryError,Java堆溢出了,这表明程序有严 ...