在工作中,app需要整合到pad中,原有的app扫条码是通过调用摄像头扫码解析解决~
但是pda快捷键发起的扫码一维码通常是红外或者激光扫码,二维码才是摄像头扫码。而且,PDA通过快捷键扫码会直接解析(点击左侧黄色按钮)
那么,我们在开发的时候,PAD的快捷扫码就成为了输入设备,通常提供了2中输入方式~
第一种:类似键盘输入,就是开发者什么都不做,点击输入框获取焦点,按PDA的快捷按钮获取到的内容就会填入输入框~
第二种:广播模式,按PDA的快捷键获取到的内容通过监听广播获取~
第一种,开发最方便,基本没开发人员什么事,但是使用极度不友好,每次都要手动去点击输入框获取焦点再点击快捷键获取内容。
在这里,着重将第二种,监听广播的方式,只要打开APP,使用人员只需要点击快捷键就可以获取,后台根据逻辑判断处理就可以~
创建一个pdaScan.js文件
var main,receiver,filter; var _codeQueryTag = false; export default { initScan() { console.log("=初始化(二维码扫码)广播="); let _this = this; main = plus.android.runtimeMainActivity();//获取activity var IntentFilter = plus.android.importClass('android.content.IntentFilter'); filter = new IntentFilter(); //android.intent.ACTION_DECODE_DATA filter.addAction("com.sunmi.scanner.ACTION_DATA_CODE_RECEIVED"); // 换你的广播动作,你的pda设备里面看 receiver = plus.android.implements('io.dcloud.feature.internal.reflect.BroadcastReceiver',{ onReceive : function(context, intent) { console.log("=监听返回="); // console.log(context); //barcode_string plus.android.importClass(intent); let code = intent.getStringExtra("data");// 换你的广播标签,你的pda设备里面看 // console.log(code); _this.queryCode(code); }}); }, startScan(){ console.log("=开启(二维码扫码)广播="); main.registerReceiver(receiver,filter); }, stopScan(){ console.log("=关闭(二维码扫码)广播="); main.unregisterReceiver(receiver); }, queryCode: function(code){ //防重复 if(_codeQueryTag)return false; _codeQueryTag = true; setTimeout(function(){ _codeQueryTag = false; },150); console.log('(二维码扫码)code:', code); console.log(typeof code); uni.$emit("scan_handle",code); } }
在App.vue页面引入部署广播监听
import pdaScan from '@/common/pdaScan.js';
onLaunch中假如监听事件
onLaunch: function() { //初始化广播 pdaScan.initScan(); }
应用进入前台,开启监听广播
onShow: function() { //监听广播 pdaScan.startScan(); }
应用进入到后台,停止监听,防止切换应用的时候,监听到PDA给其他应用的数据,从而去执行业务报错~
onHide: function() { //监听广播 pdaScan.stopScan(); }
到此,APP已经可以监听到PDA的扫码数据了,但是我们还要写不同页面的业务逻辑~
在指定的页面中,onLoad增加uniapp的监听事件,前面砸门通过PDA的广播监听,监听到了扫码数据~
再通过uniapp的(uni.$emit(“scan_handle”,”扫码数据”);)事件进行全局传输,各个页面可以通过uni.$on(‘scan_handle’,callback);来接收处理~
增加了page_show,用于监听当前页面如果在前台才处理,在app中,打开下一页,这个页面并不会关闭,而是进入了下一层隐藏了,如果一直监听处理,可能也会导致数据污染~
通过onShow与onHide对page_show的控制,就可以灵活的控制是否处理监听数据~
data() { return { page_show:false, } }, onLoad: function() { uni.$on('scan_handle',function(data){ if(!this.page_show) return false; console.log('scan_index 监听到事件来自 scan_handle ,携带参数 data 为:' + data); //这里根据你当前业务逻辑写 }.bind(this)); }, onShow() { console.log("show进入前台,开启监听状态"); this.page_show = true; }, onHide() { console.log("hide进入后台,关闭状态"); this.page_show = false; },
到此,全部结束~
未经允许不得转载:小罗同学 » uniapp整合pad扫码功能