更新记录

1.0.0（2026-09-10）

• 首发：二维码 / 条形码绘制，支持保存到相册。
• APP（鸿蒙 ScanKit、Android ZXing、iOS CoreImage）原生生成
• 微信 / 支付宝 / 抖音小程序与元服务使用 canvas type="2d"

平台兼容性

uni-app x(4.83)

umi-barcode

二维码、条形码绘制组件。

• APP（HarmonyOS / Android / iOS）：系统原生生成码图（鸿蒙 ScanKit、Android ZXing、iOS CoreImage），以图片展示。
• 微信小程序、支付宝小程序、抖音小程序、元服务：canvas type="2d" 绘制。

使用

easycom 自动引入：

<umi-barcode type="qrcode" value="https://uniapp.dcloud.net.cn/" :size="200" logo="/static/logo.png"></umi-barcode>
<umi-barcode type="barcode" format="code128" value="ABC-12345678" :width="280" :height="88"></umi-barcode>

也可调用原生生成 / 保存 API（仅 APP）：

import { generateCode, saveCodeToAlbum } from '@/uni_modules/umi-barcode'

generateCode({
    content: 'hello',
    type: 'qrcode',
    width: 200,
    height: 200,
    logo: '/static/logo.png'
}).then((path : string) => {
    // path 为本地文件路径，可用于 image.src，或保存到相册
    saveCodeToAlbum(path).then((albumPath : string) => {
        uni.showToast({ title: '已保存到相册', icon: 'none' })
    })
})

组件绘制成功后会带上 path，也可直接保存。Android 上自定义事件参数是 Map，不要直接读 e.path：

function readEventPath(e : any) : string {
    if (e instanceof Map) {
        const raw = (e as Map<string, any>).get('path')
        if (raw == null) {
            return ''
        }
        return raw as string
    }
    const ok = e as UmiBarcodeOkEvent
    return ok.path
}
saveCodeToAlbum(readEventPath(e))

组件实例也可调用 download()（内部走 saveCodeToAlbum；小程序 / 元服务会先导出 Canvas）：

const codeRef = ref<UmiBarcodeComponentPublicInstance | null>(null)
const inst = codeRef.value
if (inst != null) {
    const job = inst.download?.()
    if (job != null) {
        job.then((albumPath : string) : void => {})
    }
}

属性

事件

• success：绘制成功，{ width, height, path }（APP 上 path 为本地码图路径）
• fail：绘制失败，{ errMsg }

下载

APP 需相册写入权限（iOS NSPhotoLibraryAddUsageDescription，鸿蒙图库写入）。Android 在 manifest.json 的 app-android.distribute.permissions 声明存储权限，不要加 android:maxSdkVersion="28"，否则 saveImageToPhotosAlbum 会抛 IllegalArgumentException。

"app-android": {
  "distribute": {
    "permissions": [
      "<uses-permission android:name=\"android.permission.WRITE_EXTERNAL_STORAGE\"/>",
      "<uses-permission android:name=\"android.permission.READ_EXTERNAL_STORAGE\"/>"
    ]
  }
}

小程序保存相册需要用户授权写入相册。微信小程序请在 manifest.json 的 mp-weixin.permission 中声明：

"permission": {
  "scope.writePhotosAlbum": {
    "desc": "用于将生成的二维码和条形码保存到相册"
  }
}

格式支持

Canvas 端 CODE128 仅支持 ASCII 32–127。