微信小程序分享朋友圈

 <canvas  style="margin-left:1rpx;width: 680rpx;height: 850rpx;position: relative;" canvas-id="myCanvas"></canvas>

 

 share() {
    var _this = this;
    this.setData({
      modalName: "Share"
    })
   //请求二维码
    var qrcode = new Promise(function(resolve) {
      wx.getImageInfo({
        src: app.globalData.prefixUrl + "/rest/rq.png",
        success: function(res) {
          resolve(res.path)

        }
      })
    })
   //获取绘制图片
    var sp = new Promise(function(resolve) {
      wx.getImageInfo({
        src: _this.data.detailInfo.url,
        success: function(res) {
          resolve(res.path)

        }
      })
    })
    Promise.all([sp, qrcode]).then(function(result) {
      _this.setData({
        loading: false
      })
      //绘制canvas图片
      const ctx = wx.createCanvasContext('myCanvas')
      var windowWidth = 680;
      ctx.setFillStyle('#ffffff')
      ctx.fillRect(0, 0, 375, 470);

      //绘制背景图片
      ctx.drawImage(result[0], 0, 0, 350, 300)

      ctx.drawImage(result[1], 235, 320, 100, 100)

      ctx.setFillStyle('#000000') //文字颜色:默认黑色
      ctx.setFontSize(12) //设置字体大小,默认10
      ctx.fillText(_this.data.detailInfo.cname, 20, 350) //绘制文本

      ctx.setFillStyle('red') //文字颜色:默认黑色
      ctx.setFontSize(12) //设置字体大小,默认10
      ctx.fillText('¥' + _this.data.detailInfo.price, 20, 370) //绘制文本

      ctx.setFillStyle('#aaaaaa') //文字颜色:默认黑色
      ctx.setFontSize(14) //设置字体大小,默认10
      ctx.fillText('长按识别二维码查看详情', 20, 410) //绘制文本

      ctx.draw();

    });


  },

 

详情请参考:项目开源https://ssl.qika88.com/wxindex.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值