微信小程序分享朋友圈

 <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();

    });


  },

详情请参考：

来源：CSDN

作者：swj_soft

链接：https://blog.csdn.net/swj_soft/article/details/104111751

标签

微信分享