更新记录

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>

隐私、权限声明

1. 本插件需要申请的系统权限列表:

相机和相册权限

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问