WeX5 使用扫描二维码插件
扫描二维码使用phonegap-plugin-barcodescanner插件,插件提供了scan方法用于扫描二维码,并返回扫描结果。
1、引用插件
引用插件的目的有两个,一是生成App时,不用手动选择插件,系统会根据引用信息自动将插件放入App中;二是引用插件后,在JS文件中使用插件会出现代码提示。
在JS文件中,使用require方法引用Cordova插件。
require("cordova!phonegap-plugin-barcodescanner");
2、调用插件的方法
扫描二维码的方法是cordova.plugins.barcodeScanner.scan(onSuccess, onError);,其中onSuccess是扫描成功的回调方法,onError是扫描失败的回调方法。在onSuccess中可以获得扫描结果,扫描结果是一个对象,包括二维码信息text和格式format。在onError中可以获得出错信息。使用一个按钮调用scan方法,代码如下:
Model.prototype.scanBtnClick = function(event) {
function onSuccess(result) { //在扫描成功回调方法中获得扫描结果result
alert("扫描结果:" + result.text); //通过扫描结果result获取二维码信息
}
function onError(error) { //在扫描失败回调方法中获得出错信息error
alert("扫描失败:" + error);
}
cordova.plugins.barcodeScanner.scan(onSuccess,onError); //扫描二维码
};
3、设备就绪事件
在浏览器中运行的是Web App,在WeX5里面生成App,将APK或IPA安装到手机上运行的是Hybrid App。Web App不能访问手机硬件,Hybrid App才能访问手机硬件,即做为Hybrid App才能使用Cordova插件。Cordova提供设备就绪事件deviceready,通知应用设备就绪,所有本地API都已准备好。做为Web App deviceready不会触发,做为Hybrid App才会触发deviceready事件。
在页面上,通过单击一个按钮来扫描二维码,在设计时,这个按钮应该设置为不可用,在deviceready事件中再设置为可用。这样,做为Web App运行时,按钮不可用,做为Hybrid App运行时,按钮可用。在model加载完成后事件中,添加deviceready事件句柄,代码如下:
Model.prototype.modelLoad= function(event){ //页面加载事件
varme = this;
document.addEventListener("deviceready",onDeviceReady, false); //增加deviceready事件
functiononDeviceReady() { //设备就绪回调方法
me.comp("scanBtn").set({disabled:false}); //设置按钮可用
}
};
更多建议: