更新记录

1.0.0(2024-11-12)

初版


平台兼容性

Vue2 Vue3
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
HBuilderX 4.29,Android:5.0,iOS:不确定,HarmonyNext:不确定 × × × × × ×
钉钉小程序 快手小程序 飞书小程序 京东小程序
× × × ×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
× × × × × × × × ×

wow-scankit

简介

基于华为ScanKit集成的扫描服务,支持13种码制式,使用UTS开发,目前仅支持Android

使用方法

导入插件后,在页面使用以下方式导入,或者导入示例项目,示例项目为Uniapp-x项目

自定义基座再运行

import { defaultScan, customScan, generateCode} from '@/uni_modules/wow-scankit'

扫码API

defaultScan(cb):默认界面扫码

customScan(customQrOptions):自定义界面扫码

customQrOptions {Object}

参数 类型 是否必传 描述
mode String Y 区分自定义界面是否是全屏扫码(相机区域),可选值 fullsize halfsize,当取值是 multiprocessor时,是多码模式
tips String N 扫描矩形下方提示文字
mRectColor String N 扫描矩形的四个顶点角颜色,默认#07C160
mBorderColor String N 扫描矩形的边框颜色,默认#07C160
mBackgroundColor String N 扫描矩形以外的背景色(遮罩层),isDrawBg==true时,默认#80000000
isDrawBg Boolean N 是否绘制遮罩层,默认false,不显示遮罩层
isDrawBorder Boolean N 是否绘制扫描矩形的边框,默认false
mScanTimes Number N 扫描线的动画时间,默认1500
isFlashRequired Boolean N 是否显示闪光灯按钮,默认true

示例

/**
* 自定义扫码
*/
defineScan() {
    customScan({
    mode: "fullsize",
    tips:"xxx",
    mRectColor: '#07C160',
    isDrawBg: true,
    isDrawBorder: true,
    mScanTimes: 1500,
    mBackgroundColor: '#07C160'
    } as CustomQrOptions, {
    success: (res) => {
    console.log(res);
    this.result = res.result!
    this.qrCodeType = res.qrCodeType!
    }
   } as WowScanKitResult)
},

参考界面:

生成码API

generateCode(codeOptions, cb):生成码

cb:回调函数,包含成功/失败的结果

codeOptions {Object}

参数 类型 是否必传 描述
content String Y 生成码的内容
type Number Y 生成码的类型,如下
width Number Y 生成码的宽度
height Number Y 生成码的高度
codeColor String Y 生成码的颜色,例如:#1890FF
backgroundColor String Y 生成码的背景色,例如:#FFFFFF
margin Number Y 生成码的边距

type

类型
QR 1
Aztec 2
DataMatrix 4
PDF417 8
Code 39 16
Code 93 32
Code 128 64
EAN-13 128
EAN-8 256
ITF14 512
UPC-A 1024
UPC-E 2048
Codabar 4096

示例

generateCode(
    {
        type: 1,
    content: '加强李信!!',
    codeColor: '#1890FF',
    backgroundColor: '#FFFFFF',
    width: 700,
    height: 700,
    margin: 1,
    }, {
    success: (res) => {}  // 成功
        fali:(err)=>{} // 失败
    } as WowScanKitResult)

成功之后返回图片的Base64字符串,需要手动拼接data:image/png;base64,

关于自定义界面扫码

  • 基于xml实现,可自行修改xml布局调试自己想要的UI

  • 扫描区域的扫描线是一张图片,可以自行替换其它颜色的图片,位于插件目录wow-scankit/utssdk/app-android/res/drawable/scan_line.png

  • 半屏扫码扫描完毕后没有设置返回上一个页面,会在当前的Activit显示结果,如果需要扫码完毕立即返回可以自行修改逻辑或联系我提供修改方法(相机会有稍微压缩)

  • 如果自定义界面不符合您的要求,可联系我修改你想要的界面🤞

题外话===自定义基座云打包的时候太慢了,建议大家还是配置离线打包吧,毕竟磨刀不误砍柴工!!具体配置可以参考下我这篇文章传送

完结撒花 ✿✿ヽ(°▽°)ノ✿

隐私、权限声明

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

<uses-permission android:name="android.permission.CHANGE_WIFI_STATE"></uses-permission> <uses-permission android:name="android.permission.ACCESS_WIFI_STATE"></uses-permission> <uses-permission android:name="android.permission.CAMERA" /> <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" /> <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" /> <uses-permission android:name="android.permission.VIBRATE" /> <uses-permission android:name="android.permission.READ_MEDIA_VIDEO" /> <uses-permission android:name="android.permission.READ_MEDIA_IMAGES" /> <uses-permission android:name="android.permission.READ_MEDIA_AUDIO" /> <uses-permission android:name="android.permission.MANAGE_EXTERNAL_STORAGE" /> <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" /> <uses-feature android:name="android.hardware.camera" /> <uses-feature android:name="android.hardware.camera.autofocus" />

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

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

暂无用户评论。

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