怎样在小程序里实现标题的更改
2801
2022-10-09
小程序条形码、二维码生成(生成条形码的小程序)
weapp-qbcode
在小程序中快速生成条形码、二维码
Usage
先在 wxml 文件中,创建绘制的 canvas,并定义好 width, height, canvasId 。
使用小程序开发者工具->构建 npm,或引入js文件,使用Barcode绘制条形码、使用Qrcode绘制二维码
import { Qrcode, Barcode } from '../../miniprogram_npm/wxapp-qbcode/index';Barcode({ width: 200, height: 200, canvasId: 'canvasBarId', text: '3444556c55',})Qrcode({ width: 200, height: 200, canvasId: 'canvasQrId', text: 'https://github.com/github-seayon', image: { imageResource: '../../images/icon.png, destWidth: 100, destHeight: 100 }})
Demo
条形码示例
二维码示例
Api
Barcode([options])
options
Type:Object
参数 | 说明 | 示例 |
---|---|---|
width | 必须,二维码宽度,与canvas的width保持一致 | 375 |
height | 必须,二维码高度,与canvas的height保持一致 | 160 |
canvasId | 必须 canvas-id | 'canvasBarId' |
text | 必须 条形码内容 | '4445t55ddd' |
usingIn | 非必须,若在组件中使用,需要传入 | this |
x | 非必须,二维码绘制的 x 轴起始位置,默认值0 | 100 |
y | 非必须,二维码绘制的 y 轴起始位置,默认值0 | 100 |
fontColor | 非必须,条形码颜色,默认值#000000 | '#000000' |
backColor | 非必须,背景色,默认值#FFFFFF | '#FFFFFF' |
callback | 非必须,绘制完成后的回调函数,v0.8.0+版本支持。安卓手机兼容性问题,可通过自行设置计时器来解决,更多可以参考 issue #18 | function (e) { console.log('e', e) } |
Qrcode([options])
options
Type:Object
参数 | 说明 | 示例 |
---|---|---|
width | 必须,二维码宽度,与canvas的width保持一致 | 375 |
height | 必须,二维码高度,与canvas的height保持一致 | 160 |
canvasId | 必须 canvas-id | 'canvasQrId' |
text | 必须 条形码内容 | '4445t55ddd' |
typeNumber | 非必须,二维码的计算模式,默认值-1 | 8 |
correctLevel | 非必须,二维码纠错级别,默认值为高级,取值:{ L: 1, M: 0, Q: 3, H: 2 } | 1 |
usingIn | 非必须,若在组件中使用,需要传入 | this |
x | 非必须,二维码绘制的 x 轴起始位置,默认值0 | 100 |
y | 非必须,二维码绘制的 y 轴起始位置,默认值0 | 100 |
fontColor | 非必须,条形码颜色,默认值#000000 | '#000000' |
backColor | 非必须,背景色,默认值#FFFFFF | '#FFFFFF' |
image | 非必须,在 canvas 上绘制图片,层级高于二维码 | { imageResource: '', dx: 0, dy: 0, destWidth: 100, destHeight: 100 } |
callback | 非必须,绘制完成后的回调函数,v0.8.0+版本支持。安卓手机兼容性问题,可通过自行设置计时器来解决,更多可以参考 issue #18 | function (e) { console.log('e', e) } |
版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们jiasou666@gmail.com 处理,核实后本网站将在24小时内删除侵权内容。
发表评论
暂时没有评论,来抢沙发吧~