小程序使用的是weapp-qrcode.js
使用說明
// 將 dist 目錄下,weapp.qrcode.esm.js 復制到項目目錄中
import drawQrcode from '../../utils/weapp.qrcode.esm.js'
drawQrcode({
width: 200,
height: 200,
canvasId: 'myQrcode',
// ctx: wx.createCanvasContext('myQrcode'),
text: 'https://github.com/yingye',
// v1.0.0+版本支持在二維碼上繪制圖片
image: {
imageResource: '../../images/icon.png',
dx: 70,
dy: 70,
dWidth: 60,
dHeight: 60
}
})
但是你在小程序里面使用會發現這個width height是px
可以使用微信的api wx.getSystemInfoSync()
wx.getSystemInfoSync()里面包含platform 表示手機的系統是android還是ios,windowWidth表示手機的使用窗口寬度單位px
所以就可以根據不同的寬度展示不同大小的二維碼了
const systemInfo = wx.getSystemInfoSync()
const width = 200*systemInfo.windowWidth/375
const height = width