点击分享按钮,生成海报
按钮调用的方法(http网络图片要使用getImageInfo转为本地路径再画):
BindShare: function (e) { wx.showLoading({ title: '海报正在生成中......' }) let that = this let id = e.currentTarget.id // 文章id that.setData({ iscode: true }) // CANVAS 绘图 console.log("CANVAS 绘图:生成海报图片" + that.data.poster) const ctx = wx.createCanvasContext('share'); wx.getImageInfo({ src: that.data.poster, // 服务器返回的图片地址 success: function (res) { console.log("绘制临时海报:" + res.path) let path = res.path; ctx.drawImage(path, 0, 0, 450, 700, 0, 0, 360, 560); //绘制海报图片 wx.getImageInfo({ src: that.data.qrcode, success(ret){ console.log("绘制临时二维码:" + ret.path) let path = ret.path; ctx.drawImage(path, 270, 470, 80, 80); //绘制二维码 ctx.draw(true, function () { // canvas画布转成图片 wx.canvasToTempFilePath({ x: 0, y: 0, width: 360, height: 570, // 560 destWidth: 360, destHeight: 570, // 560 canvasId: 'share', success(res) { wx.hideLoading() console.log("画布转成图片:" + res.tempFilePath); that.setData({ sharePic: res.tempFilePath }) }, fail(res) { console.log(res) } }) }) }, fail(ret){ console.log("绘制临时二维码失败:") console.log(ret) } }) },fail(res){ console.log("绘制临时海报失败:") console.log(res) } }) },
点击保存图片所调用的方法:
/** * 分享到朋友圈 并 保存图片 */ BindSave: function (e) { let that = this wx.showLoading({ title: '图片保存中......' }) console.log("保存海报图片") wx.saveImageToPhotosAlbum({ filePath: that.data.sharePic, success (res) { wx.hideLoading() wx.showToast({ title: '已保存至相册', }) setTimeout(function () { wx.hideLoading() }, 1000) },fail (res) { wx.hideLoading() wx.showLoading({ title: '已取消保存', }) setTimeout(function () { wx.hideLoading() }, 1000) } }) },
文章评论 (0)