• Barcode
    • start(object)
      • Object object
    • cancel()
    • setFlash(boolean)
      • Boolean boolean
    • 事件
    • marked
      • 返回参数说明
    • error
      • 返回参数说明

    Barcode

    app端nvue专用的扫码组件。

    注意：此组件用于app端nvue页面实现内嵌到界面上的扫码。其他场景、其他平台，请使用全屏扫码API：uni.scanCode

    此组件自HBuilderX 2.1.5+起支持。

    属性说明设置Barcode扫码控件的属性，如扫码框、扫码条的颜色等。

    属性类型默认值必填说明
    autostartbooleanfalse否是否自动开始扫码
    backgroundstring否条码识别控件背景颜色,颜色值支持(参考CSS颜色规范)：颜色名称(参考CSS Color Names)/十六进制值/rgb值，默认值为黑色。
    frameColorstring否扫码框颜色,颜色值支持(参考CSS颜色规范)：颜色名称(参考CSS Color Names)/十六进制值/rgb值/rgba值，默认值为红色。
    scanbarColorstring否扫码条颜色,颜色值支持(参考CSS颜色规范)：颜色名称(参考CSS Color Names)/十六进制值/rgb值/rgba值，默认值为红色。
    filtersArray[Number][0,1,2]否条码类型过滤器，条码类型常量数组，默认情况支持QR、EAN13、EAN8类型。 通过此参数可设置扫码识别支持的条码类型（注意：设置支持的条码类型越多，扫描识别速度可能将会降低）。

    码类型常量

    • QR: QR二维码，数值为0
    • EAN13: EAN条形码标准版，数值为1
    • EAN8: ENA条形码简版，数值为2
    • AZTEC: Aztec二维码，数值为3
    • DATAMATRIX: Data Matrix二维码，数值为4
    • UPCA: UPC条形码标准版，数值为5
    • UPCE: UPC条形码缩短版，数值为6
    • CODABAR: Codabar条形码，数值为7
    • CODE39: Code39条形码，数值为8
    • CODE93: Code93条形码，数值为9
    • CODE128: Code128条形码，数值为10
    • ITF: ITF条形码，数值为11
    • MAXICODE: MaxiCode二维码，数值为12
    • PDF417: PDF 417二维条码，数值为13
    • RSS14: RSS 14条形组合码，数值为14
    • RSSEXPANDED: 扩展式RSS条形组合码，数值为15

    start(object)

    开始扫码识别

    Object object

    属性说明类型必填备注
    conserve是否保存扫码成功时的截图Boolean否如果设置为true则在扫码成功时将图片保存，并通过onmarked回调函数的file参数返回保存文件的路径。 默认值为false，不保存截图。
    filename保存扫码成功时图片保存路径String否可通过此参数设置保存截图的路径和名称，如果设置图片文件名称则必须指定文件的后缀名（必须是.png），否则认为是指定目录，文件名称则自动生成。
    vibrate扫码成功时是否需要震动提醒Boolean否如果设置为true则在扫码成功时震动设备，false则不震动。 默认值为true。
    sound扫码成功时播放的提示音String否可取值： "none" - 不播放提示音； "default" - 播放默认提示音（5+引擎内置）。 默认值为"default"。

    cancel()

    取消扫码识别

    参数类型必填说明
    无无无结束对摄像头获取图片数据进行条码识别操作，同时关闭摄像头的视频捕获。 结束后可调用start方法重新开始识别。

    setFlash(boolean)

    操作闪光灯

    Boolean boolean

    类型必填说明备注
    Boolean是是否开启闪光灯可取值true或false，true表示打开闪光灯，false表示关闭闪光灯。

    事件

    marked

    条码识别成功事件

    返回参数说明

    参数类型说明
    typestring"success" 表示成功
    messagestring识别到的条码数据，扫码识别出的数据内容，字符串类型，采用UTF8编码格式。
    codeNumber识别到的条码类型，与Barcode组件的条码类型常量一致。
    filestring扫码成功的截图文件路径，扫码识别到的截图，png格式文件，如果设置为不保存截图，则返回undefined。

    error

    条码识别错误事件

    返回参数说明

    参数类型说明
    typestring"fail" 表示失败
    codenumber相应 code 码
    messagestring失败描述

    示例：

    1. <template>
    2.     <view>
    3.         <barcode id='1' class="barcode" autostart="true" ref="barcode" background="rgb(0,0,0)" frameColor="#1C86EE" scanbarColor="#1C86EE" :filters="fil" @marked="success1" @error="fail1"></barcode>
    4.         <button class="btn" @click="toStart">开始扫码识别</button>
    5.         <button class="btn" @click="tocancel">取消扫码识别</button>
    6.         <button class="btn" @click="toFlash">开启闪光灯</button>
    7.         <button class="btn" @click="toscan">预览</button>
    8.     </view>
    9. </template>
    11. <script>
    12.     export default {
    13.         onLoad() {
    15.         },
    16.         data: {
    17.             fil: [0, 2, 1]
    18.         },
    20.         methods: {
    21.             success1(e) {
    22.                 console.log("success1:" + JSON.stringify(e));
    23.             },
    24.             fail1(e) {
    25.                 console.log("fail1:" + JSON.stringify(e));
    26.             },
    27.             toStart: function() {
    28.                 this.$refs.barcode.start({
    29.                     conserve: true,
    30.                     filename: '_doc/barcode/'
    31.                 });
    32.             },
    33.             tocancel:function(){
    34.                 this.$refs.barcode.cancel();
    35.             },
    36.             toFlash: function() {
    37.                 this.$refs.barcode.setFlash(true);
    38.             },
    40.             toscan: function() {
    41.                 console.log("scan:");                
    42.                 const barcodeModule = uni.requireNativePlugin('barcodeScan');
    43.                 barcodeModule.scan("/static/barcode1.png"
    44.                 ,(e)=>{
    45.                     console.log("scan_error:"+JSON.stringify(e));
    46.                 });
    47.             }
    48.         }
    49.     }
    50. </script>
    52. <style>
    53.     .barcode {
    54.         width: 750rpx;
    55.         height: 700rpx;
    56.         background-color: #808080;
    57.     }
    59.     .btn {
    60.         top: 20rpx;
    61.         width: 730rpx;
    62.         margin-left: 10rpx;
    63.         margin-top: 10rpx;
    64.         background-color: #458B00;
    65.         border-radius: 10rpx;
    66.     }
    67. </style>

    发现错误？想参与编辑？在 GitHub 上编辑此页面！