微信小程序绘制二维码

话不多说,直接上代码。

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

<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传给这个方法就可以在视图绘制出你想要的二维码啦!

快去试试吧

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
微信小程序生成二维码邀请好友的过程可以分为以下几个步骤: 1. 发起请求:使用wx.request函数向微信服务器发送请求,请求生成小程序码的接口。在请求中需要传入access_token和其他参数,如场景值scene和页面路径page等。\[1\] 2. 处理响应:在请求成功后,可以通过success回调函数获取到响应数据。响应数据是一个二进制数组,需要将其转换为base64格式的字符串,以便在小程序中显示二维码图片。\[1\] 3. 绘制小程序码:在页面中插入一个canvas标签,并设置其位置在界面外。通过控制canvas标签的位置,可以实现在界面上显示二维码图片。同时,需要准备好用户名和小程序码的相关信息,如背景图等。\[2\] 4. 下载图片:使用wx.downloadFile函数将远程图片下载到本地,以便在绘制小程序码时使用。\[2\] 5. 处理授权:由于小程序的限制,如果用户拒绝过保存到相册的授权,再次点击保存按钮时需要弹出授权界面。根据微信的要求,弹出授权界面必须是用户直接点击按钮触发,因此需要通过openAlbumSetting函数来处理授权操作。\[3\] 综上所述,生成微信小程序邀请好友的二维码需要通过发起请求、处理响应、绘制小程序码、下载图片和处理授权等步骤来完成。 #### 引用[.reference_title] - *1* [微信小程序生成二维码](https://blog.csdn.net/zh_is_code_world/article/details/89491586)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item] - *2* *3* [项目功能整理:微信小程序生成二维码海报](https://blog.csdn.net/weixin_33713503/article/details/91378236)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值