animate-QRScan

animate-QRScan 华为扫码

介绍

本组件封装了 QRScan 插件，QRScan 封装了华为统一扫码服务（HUAWEI Scan Kit） 。便捷的条形码和二维码扫描、解析、生成能力，帮助您快速构建应用内的扫码功能。支持扫描13种全球主流的码制式。如果您的应用只处理部分特定的码制式，您也可以在接口中指定制式以便加快扫码速度。已支持的码制式： 一维码：EAN-8、EAN-13、UPC-A、UPC-E、Codabar、Code 39、Code 93、Code 128、ITF 二维码：QR Code、Data Matrix、PDF417、Aztec

使用方法

import "../components/animate-QRScan/animate-QRScan.stml"

代码示例

<animate-QRScan   
  :marginB="34"  
  scanLineColor="#ff0000"  
  maskColor="rgba(0,0,0,0.5)" 
  tipString="放入框内，即可自动扫描"
  ref={this.QRScanRef}
  :navigationAndStatusBarHeight='navigationAndStatusBarHeight'
  @eventCallback="eventCallback"> 
</animate-QRScan>

API

props 属性

参数 说明 类型 默认值
marginB 手电筒按钮到底边距离 Number -
scanLineColor 扫描线颜色 String -
maskColor 遮罩层颜色 String -
tipString 扫描框提示文字 String -
navigationAndStatusBarHeight 状态栏和导航栏总高度 Number -

注意需要传入 ref={this.QRScanRef} 实现隐式 ref，详情参考demo。需要传入状态栏和导航栏总高度

events 事件

事件名 说明 回调参数
recognitionImage 识别图片的回调 e.detail(识别结果)
scan 摄像头扫码识别的回调 e.detail(识别结果)
close 关闭扫码插件的回调 -
torchOn 手电筒打开的回调 -
torchOff 手电筒关闭的回调 -

methods 方法

scanPicture

识别图片

scanPicture()

params

参数 说明 类型 默认值
图片路径 本地图片路径 String -

switchLight

切换手电筒开关

switchLight()

params

无

showScanner

显示已隐藏的扫码界面

showScanner()

params

无

hideScanner

隐藏扫码界面

hideScanner()

params

无

closeScanner

关闭扫码插件

closeScanner()

params

无

依赖的原生插件

QRScan

帮助说明 联系方式等

帮助说明

调用组件接口前需要首先通过隐式 ref 方式获取组件。

ref={this.QRScanRef}

QRScanRef(e) {
    this.QRScanObj = e;
}

联系方式

如果您在使用本组件过程中，遇到任何问题，可在论坛发帖求助。我们会有专业技术人员提供支持。

是否仍需要帮助？ 请保持联络！
最后更新于 2024/11/18