更新记录
1.1.2(2025-02-17)
customMode模式增加线条动画效果
1.1.1(2025-02-16)
补充MultiProcessorMode模式,支持多码识别
1.1.0(2025-02-14)
增加创建二维码
查看更多平台兼容性
Vue2 | Vue3 |
---|---|
× | √ |
App | 快应用 | 微信小程序 | 支付宝小程序 | 百度小程序 | 字节小程序 | QQ小程序 |
---|---|---|---|---|---|---|
HBuilderX 4.51,Android:5.0,iOS:不支持,HarmonyNext:不支持 | × | × | × | × | × | × |
钉钉小程序 | 快手小程序 | 飞书小程序 | 京东小程序 | 鸿蒙元服务 |
---|---|---|---|---|
× | × | × | × | × |
H5-Safari | Android Browser | 微信浏览器(Android) | QQ浏览器(Android) | Chrome | IE | Edge | Firefox | PC-Safari |
---|---|---|---|---|---|---|---|---|
× | × | × | × | × | × | × | × | × |
xwq-hw-scan
开发文档说明
-
目前扫码只支持安卓端,iOS后续会支持(注意:购买前请先试用,合适再下单)
-
模式选择:defaultMode、customMode、MultiProcessorMode
-
功能点
- 支持默认扫码样式和自定义扫码样式两种
- 支持多种扫码类型设置
- 支持连续扫码(只有自定义扫码模式支持)
- 支持相册二维码识别
- 支持成成二维码
- 支持多个二维码识别(MultiProcessorMode模式)
- ....后续补充
-
下一步计划增加功能点
- 支持iOS端扫码
支持14种扫码格式设置
/** 所扫码的类型
*
* 可选值:
* - 'QR': 二维码;
* - 'Aztec': 一维码;
* - 'Codabar': 一维码;
* - 'Code39': 一维码;
* - 'Code93': 一维码;
* - 'Code128': 一维码;
* - 'DataMatrix': 二维码;
* - 'EAN-8': 一维码;
* - 'EAN-13': 一维码;
* - 'ITF14': 一维码;
* - 'PDF417': 二维码;
* - 'UPC-A': 一维码;
* - 'UPC-E': 一维码;
* - 'WX_CODE': 二维码;
*/
扫码方法调用参数说明
参数 | 类型 | 是否必填 | 描述 |
---|---|---|---|
scanMode | string | Y | 扫码模式,支持defaultMode、customMode、MultiProcessorMode(支持多码) |
scanType | string[] | N | 设置扫码类型,参考上面的14种类型 |
continuouslyScan | boolean | N | 设置连续扫码(customMode模式),默认false |
success | Function | N | 码识别成功回调 |
fail | Function | N | 码识别失败回调 |
扫码成功回调参数说明
{
/** 只有sms类型二维码才有值 */
smsPhone ?: string | null
/** 只有sms类型二维码才有值 */
smsContent ?: string | null
/** 只有wifi类型二维码才有值 */
ssidNumber ?: string | null
/** 只有wifi类型二维码才有值 */
password ?: string | null
/** 扫码的内容 */
scanVal ?: string | null
/** 所扫码的类型 */
scanType : ScanFormatTypeCode
/**成功或失败状态*/
errMsg : string
}
创建二维码参数
参数 | 类型 | 是否必填 | 描述 |
---|---|---|---|
content | string | Y | 二维码内容 |
width | number | Y | 宽度 |
height | number | Y | 高度 |
bgColor | string | N | 背景色 |
foreColor | string | N | 码颜色 |
qrMargin | number | N | 间距 |
success | Function | Y | 成功回调 |
fail | Function | Y | 失败回调 |
UniappX使用方式
<template>
<view>
<button @click="openScan">默认样式模式扫码</button>
<button @click="customScan">自定义页面模式扫码</button>
<image :src="qrcode" mode="widthFix"></image>
</view>
</template>
<script setup>
import { openScanCode } from '@/uni_modules/xwq-hw-scan';
import { GeneralCallbackResult,ScanCodeSuccessCallbackResult,ScanCodeOption } from '@/uni_modules/xwq-hw-scan/utssdk/interface.uts';
const qrcode=ref('');
//默认样式模式
const openScan = () => {
openScanCode({
scanMode:'defaultMode',//扫码模式
scanType:['QR'],
success:(val:ScanCodeSuccessCallbackResult)=>{
console.log(val)
},
fail:(val:GeneralCallbackResult)=>{
console.log(val)
},
} as ScanCodeOption);
};
//自定义样式模式
const customScan=()=>{
console.log('自定义模式')
openScanCode({
scanMode:'customMode',//扫码模式,可选defaultMode、customMode
scanType:[],//设置扫码类型
continuouslyScan:false,//设置连续扫码,默认false
success:(val:ScanCodeSuccessCallbackResult)=>{
console.log(val)
},
fail:(val:GeneralCallbackResult)=>{
console.log(val)
},
} as ScanCodeOption);
}
//图片模式
const MultiProcessor = () => {
console.log('多码模式')
openScanCode({
scanMode: 'MultiProcessorMode',
scanType: [],//设置扫码类型
continuouslyScan: false,//设置连续扫码,默认false
success: (val : ScanCodeSuccessCallbackResult) => {
console.log(val)
},
fail: (val : GeneralCallbackResult) => {
console.log(val)
},
} as ScanCodeOption);
}
//创建二维码
const createCodeHandle = () => {
createCode({
content: "122222222222",//内容
height: 200, //高度
width: 200, //宽度
bgColor:'#ace5ff',//背景色
foreColor:'#ff00ff',//码颜色
qrMargin:1,//间距
success: (res:string) => {
qrcode.value=res;
},
fail: (res:string) => {
console.log('图片===',res)
}
} as CreateCodeOptions)
}
</script>