更新记录
1.8(2024-09-30)
优化支持权限说明
1.7(2024-07-23)
解决跳转界面返回后一定几率的黑屏问题
1.6(2024-07-18)
1、优化部分手机黑屏问题 2、支持取消事件监听 3、其他优化
查看更多平台兼容性
Android | Android CPU类型 | iOS |
---|---|---|
适用版本区间:5.0 - 14.0 | armeabi-v7a:支持,arm64-v8a:支持,x86:支持 | × |
原生插件通用使用流程:
- 购买插件,选择该插件绑定的项目。
- 在HBuilderX里找到项目,在manifest的app原生插件配置中勾选模块,如需要填写参数则参考插件作者的文档添加。
- 根据插件作者的提供的文档开发代码,在代码中引用插件,调用插件功能。
- 打包自定义基座,选择插件,得到自定义基座,然后运行时选择自定义基座,进行log输出测试。
- 开发完毕后正式云打包
付费原生插件目前不支持离线打包。
Android 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/android
iOS 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/ios
注意事项:使用HBuilderX2.7.14以下版本,如果同一插件且同一appid下购买并绑定了多个包名,提交云打包界面提示包名绑定不一致时,需要在HBuilderX项目中manifest.json->“App原生插件配置”->”云端插件“列表中删除该插件重新选择
扫码原生插件 - 新版(支持连续扫码模式;支持设置格式;可任意自定义界面)Ba-Scanner
简介
Ba-Scanner 是一款毫秒级扫码插件,同时支持多码、相册、闪光灯、焦距缩放、提示音、震动等等。
新增支持自定义任意界面、任意点击事件,可以让扫码界面和您的应用更加匹配、美观。
新增支持连续扫码,可设置时间间隔,亲测持续扫码万次不卡顿。
新增支持设置扫码格式。
新增支持自定义webview遮罩界面,可直接传html地址,本地、网络都支持(参考:“自定义webview遮罩界面”)
- 支持同时扫多个二维码和条形码
- 支持配置相册
- 支持闪光灯
- 相机可以调整焦距放大缩小
- 支持自定义扫描线颜色、提示文案等
- 支持扫描完成提示音、震动
- 支持任意自定义界面(支持自行定制,也可联系作者定制)
- 支持自定义点击事件
- 支持连续扫码模式
- 支持设置扫码格式
- 新增支持自定义webview遮罩界面,可直接传html地址,本地、网络都支持,(参考:“自定义webview遮罩界面”)
- 支持自定义权限使用说明
支持定制,有建议和需要,请联系QQ:2579546054
也可关注博客,实时更新最新插件:
扫码原生插件 - 新版(支持连续扫码模式;支持设置格式;可任意自定义界面)Ba-Scanner
扫码原生插件 - 基础版(毫秒级、支持多码)Ba-Scanner-G
扫码原生插件 - 组件版(毫秒级、连续扫码、多码、相册)Ba-ScanView
扫码原生插件 - 组件版(毫秒级、连续扫码、多码、相册、新增支持拍照)Ba-ScanView2
扫码原生插件 - 组件版(华为、连续扫码、多码、相册、新增支持抓拍图片)Ba-ScanViewH
扫码原生插件 - (最经典zxing版本)Ba-Scanner-Zxing
截图展示
使用方法(示例)
在 script
中引入组件
const scanner = uni.requireNativePlugin('Ba-Scanner')
在 script
中调用
methods: {
onScan() { //默认界面
scanner.onScan({
isContinuous: true,
barcodeFormats: ["QR Code"],
scanTimeSpace: 2000,
isShowVibrate: true,
isShowBeep: false,
hintText: '测试扫码',
},
(ret) => {
console.log(ret)
if (ret.result) {
this.showToast(ret.result)
}
});
},
onScan2() { //自定义界面
scanner.onScan({
isShowVibrate: true,
isShowBeep: false,
hintText: '测试扫码',
customResName: 'ba_scan_custom_view',
customConfig: {
lightTvTextOn: '轻触关闭',
lightTvTextOff: '轻触照亮'
},
customEvents: [{
resId: 'btn_my_card',
}, {
resId: 'btn_scan_record',
}]
},
(ret) => {
console.log(ret)
if (ret.result) {
this.showToast(ret.result)
}
if (ret.isCustomEvent) {
this.showToast(ret.eventResId);
}
});
},
onScan3() {//自定义webview遮罩界面
let that = this;
scanner.onScan({
isContinuous: true,
scanTimeSpace: 3000,
isShowVibrate: true,
isShowBeep: true,
hintText: '测试扫码',
customWebview:'file:///android_asset/testScan.html'
},
(ret) => {
console.log(ret)
if (ret.result) {//判断为扫码结果
that.resultList.push(ret.result);
that.showToast(ret.result);
}
if (ret.isSendMsg) {//判断是webview和页面间消息传递
that.resultList.push(ret.data);
this.showToast(ret.data);
}
});
},
}
默认界面
Ba-Scanner 自定义配置参数
属性名 | 类型 | 默认值 | 说明 |
---|---|---|---|
isShowVibrate | Boolean | true | 扫描完成震动 |
isShowBeep | Boolean | false | 扫描完成声音 |
isShowPhotoAlbum | Boolean | true | 是否显示相册 |
isShowLightController | Boolean | true | 是否显示闪光灯开关 |
zoom | Boolean | false | 是否支持手势缩放 |
isFacingFront | Boolean | false | 是否前置摄像头 |
scanColor | String | #FF0000 | 扫描线的颜色 |
hintText | String | 扫二维码/条形码 | 提示文案 |
hintTextColor | String | #FF0000 | 提示文案颜色 |
hintTextSize | Number | 14 | 提示文案字体大小 |
scanGrid | Boolean | false | 扫描线样式是否为网格 |
gridScanLineColumn | Number | 30 | 网格扫描线的列数 |
gridScanLineHeight | Number | 300 | 网格高度 |
isContinuous | Boolean | false | 是否开启连续扫描,默认 false |
scanTimeSpace | int | 1000 | 连续扫描时间间隔,单位毫秒,默认 1000 |
isShowToast | Boolean | true | 扫码成功是否 toast 提示,默认 true |
barcodeFormats | Array | 设置扫码格式,支持多个,默认所有。如:["QR Code", "Code 128"] | |
statusBarColor | String | '#00000000' | 状态栏背景颜色 |
statusBarDarkMode | Boolean | false | 状态栏图标和文字是否为深色 |
perTipTitle | String | "权限说明" | 权限使用说明标题 |
statusBarDarkMode | String | "为确保你能使用扫码服务,需要申请你的相机权限。允许后,你可以随时通过手机系统设置对授权进行管理" | 权限使用说明标题 |
支持的扫码格式 barcodeFormats 参数
- 线性格式:Codabar、Code 39、Code 93、Code 128、EAN-8、EAN-13、IFF、UPC-A、UPC-E
- 2D 格式:Aztec、Data Matrix、PDF417、QR Code(二维码)
回调参数
属性名 | 类型 | 说明 |
---|---|---|
code | String | 扫描结果判断,success为成功,其他失败 |
result | String | 扫描结果 |
自定义webview遮罩界面
使用简单,直接在调用onScan时,加一个customWebview参数传html网址即可,同时支持网络和原生本地地址(assets)。如
onScan3() {//自定义webview遮罩界面
let that = this;
scanner.onScan({
isContinuous: true,
scanTimeSpace: 3000,
isShowVibrate: true,
isShowBeep: true,
hintText: '测试扫码',
customWebview:'file:///android_asset/testScan.html'
},
(ret) => {
console.log(ret)
if (ret.result) {//判断为扫码结果
that.resultList.push(ret.result);
that.showToast(ret.result);
}
if (ret.isSendMsg) {//判断是webview和页面间消息传递
that.resultList.push(ret.data);
this.showToast(ret.data);
}
});
},
本地html放置位置如下,路径格式为 “file:///android_asset/”+文件名称,如“file:///android_asset/testScan.html”
注意:使用本地html尽量先配置,因为uniapp的规则,每次更改原生资源,都需要重新自定义基座
html示例代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>webview 遮罩界面</title>
<script>
function scanResult(result) { //监听扫码结果
alert("result:" + result);
}
function closeScan() { //关闭扫码界面
Android.closeScan();
}
function openAlbum() { //打开相册扫码
Android.openAlbum();
}
function openLight() { //打开闪光灯
Android.openLight();
}
function closeLight() { //关闭闪光灯
Android.closeLight();
}
</script>
</head>
<body>
<p style="color:white;">自定义 webview 遮罩界面</p>
<button type="button" onclick="closeScan()">closeScan</button>
<button type="button" onclick="openAlbum()">openAlbum</button>
<button type="button" onclick="openLight()">openLight</button>
<button type="button" onclick="closeLight()">closeLight</button>
</body>
</html>
支持 webview 和 uniapp页面交互
在 html 发送数据:
Android.sendMsg("msg");
在 uniapp 接收数据:
if (ret.isSendMsg) {//判断是webview和页面间消息传递
that.resultList.push(ret.data);
this.showToast(ret.data);
}
自定义界面(原生)
布局文件
自定义界面是编写 android 的xml布局界面,按文档配置即可,资源名称、控件id要和调用方法一致。可自行定制,也可联系作者定制(QQ:2579546054)。
- 编写好对应的布局文件,放在项目的 “nativeplugins\Ba-Scanner\android\res\layout” 目录下(没有就新建)。
- 所用到的图片资源,放在“nativeplugins\Ba-Scanner\android\res\drawable-xxhdpi” 目录下
注意:配置更改后,需要重新制作基座才生效,建议提前配置。
接口说明
方法名 | 说明 |
---|---|
onScan | 打开扫码页 |
onClose | 关闭扫码页 |
扫码调用参数(onScan)
属性名 | 类型 | 必填 | 默认值 | 说明 |
---|---|---|---|---|
customResName | String | true | 自定义界面名称 | |
customConfig | Object | false | 自定义界面配置 | |
customEvents | Array | false | 自定义点击事件 |
customConfig
属性名 | 类型 | 必填 | 默认值 | 说明 |
---|---|---|---|---|
backResId | String | false | "iv_back" | 返回控件ID |
albumResId | String | false | "iv_photo" | 相册控件ID |
lightResId | String | false | "btn_scan_light" | 闪光灯控件ID |
lightIvResId | String | false | "iv_scan_light" | 闪光灯图标控件ID |
lightTVResId | String | false | "tv_scan_light" | 闪光灯文本控件ID |
lightTvTextOn | String | true | "关闭手电筒" | 闪光灯打开时显示文本 |
lightTvTextOff | String | true | "打开手电筒" | 闪光灯关闭时显示文本ID |
lightIvIconOn | String | true | "scan_custom_light_open" | 闪光灯打开时显示图标 |
lightIvIconOff | String | true | "scan_custom_light_close" | 闪光灯关闭时显示图标 |
customEvents
属性名 | 类型 | 必填 | 默认值 | 说明 |
---|---|---|---|---|
resId | String | true | 自定义点击事件ID | |
show | Boolean | false | true | 自定义点击事件ID |
回调参数
属性名 | 类型 | 说明 |
---|---|---|
code | String | 扫描结果判断,success为成功,其他失败 |
result | String | 扫描结果 |
系列插件
应用消息通知插件(多种样式,新增支持常驻通知模式) Ba-Notify(文档)
自定义通知(耳机电量)插件 Ba-NotifyEarphone(文档)
应用未读角标插件 Ba-Shortcut-Badge (文档)
扫码原生插件 - 基础版(毫秒级、支持多码)Ba-Scanner-G(文档)
扫码原生插件 - 新(可任意自定义界面版本;支持连续扫码;支持设置扫码格式)Ba-Scanner(文档)
扫码原生插件 - 组件版(毫秒级、连续扫码、多码、相册)Ba-ScanView
动态修改状态栏、导航栏背景色、字体颜色插件 Ba-AppBar(文档)
安卓保活插件(采用多种主流技术) Ba-KeepAlive(文档)
安卓保活套装(通用、常驻通知、电池优化、自启管理、后台运行等)(文档)
安卓快捷方式(桌面长按app图标) Ba-Shortcut(文档)
自定义图片水印(任意位置) Ba-Watermark(文档)
最接近微信的图片压缩插件 Ba-ImageCompressor(文档)
视频压缩、视频剪辑插件 Ba-VideoCompressor(文档)
动态切换应用图标、名称(如新年、国庆等) Ba-ChangeIcon(文档)
原生Toast弹窗提示(穿透所有界面、穿透原生;自定义颜色、图标 ) Ba-Toast(文档)
websocket原生服务(自动重连、心跳检测) Ba-Websocket(文档)
智能安装(自动升级) Ba-SmartUpgrade(文档)
监听通知栏消息(支持白名单、黑名单、过滤) Ba-NotifyListener(文档)
全局置灰、哀悼置灰(可动态、同时支持nvue、vue) Ba-Gray(文档)
获取设备唯一标识(OAID、AAID、IMEI等) Ba-IdCode(文档)
实时定位(系统、后台运行、支持息屏)插件 Ba-Location(文档)
实时定位(高德、后台运行、支持息屏、坐标转换、距离计算) Ba-LocationAMap(文档)
窗口小工具、桌面小部件、微件 Ba-AppWidget(文档)
窗口小工具、桌面小部件、微件(日历、时间) Ba-AwCalendarS(文档)
悬浮窗(在其他应用上层显示) Ba-FloatWindow(文档)
悬浮窗(应用内、无需授权) Ba-FloatWindow2(文档)
悬浮窗(悬浮球、动态菜单、在其他应用上层显示) Ba-FloatBall(文档)
添加到“用其他应用打开”中,用于文件传递、分享等 Ba-ShareReceive(文档)
获取地图数据(高德、地理编码、反地理编码) Ba-AMapData(文档)