微信小程序绘制二维码

2021/10/26 11:10:46

本文主要是介绍微信小程序绘制二维码,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

话不多说,直接上代码。

这里的宽高是二维码的宽高

<view id="container" class="qrcode">
      <view class="ewm">
            <canvas style="width: 400rpx; height: 400rpx;" canvas-id="myQrcode">
            </canvas>
      </view>
</view>

.ewm的宽高是背景的宽高,如果不加或和二维码的宽高一样,又可能降低识别率

.qrcode的left是控制位置,750-.ewm的宽度,再除二

.ewm {
        background-color: #e8e8e8;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 440rpx;
        height: 440rpx; 
        margin: 50rpx auto;
}

.qrcode {
        position: fixed;
        top: 490rpx;
        left: 175rpx;  
        z-index: 2;
}
// 绘制Qrcode
ewmChange(id) {
        let size = {}
        size.w = wx.getSystemInfoSync().windowWidth / 750 * 400
        size.h = size.w
        drawQrcode({
                width: size.w,
                height: size.h,
                canvasId: 'myQrcode',
                text: id,
         })
},

把想转化为二维码的字符串通过id传给这个方法就可以在视图绘制出你想要的二维码啦!

快去试试吧



这篇关于微信小程序绘制二维码的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!


扫一扫关注最新编程教程