// component/shar-dialog/shar-dialog.js Component({ /** * 组件的属性列表 */ properties: { shareType: { type: 'String', value: '' } }, /** * 组件的初始数据 */ data: { shareFlag: true, imgUrls: '' }, /** * 组件的方法列表 */ methods: { poster: function () { const that = this; const ctx = wx.createCanvasContext('myCanvas'); ctx.rect(0, 0, 370, 507) ctx.setFillStyle('#fff') ctx.fill() ctx.save() ctx.beginPath() ctx.setFillStyle('#fff') ctx.fill() ctx.arc(185, 48, 37, 0, 2 * Math.PI, false) ctx.clip();//画了圆 再剪切 原始画布中剪切任意形状和尺寸。一旦剪切了某个区域,则所有之后的绘图都会被限制在被剪切的区域内 ctx.drawImage('../../../static/groupImg/Bitmap1.png', 148, 8, 100, 100); //插入图片 ctx.restore(); //恢复之前保存的绘图上下文 恢复之前保存的绘图上下午即状态 可以继续绘制 ctx.setFontSize(20) ctx.setFillStyle('#000') ctx.fillText('喔喔', 166, 115) ctx.setFillStyle('#FF4400') ctx.fillText('郎朗读书声是世上最美的声音', 50, 138) ctx.drawImage('../../../static/groupImg/Bitmap1.png', 9, 156, 352, 145); ctx.setFontSize(18) ctx.setFillStyle('#000') ctx.fillText('一年级语文上学期', 12, 329) ctx.drawImage('../../../static/groupImg/Combined Shape.png', 11, 348, 196, 65); ctx.drawImage('../../../static/groupImg/Rectangle 41.png', 134, 358, 59, 20); ctx.setFontSize(14) ctx.setFillStyle('#fff') ctx.fillText('五人团', 149, 373) ctx.setFontSize(16) ctx.setFillStyle('#A95A00') ctx.fillText('原价', 24, 373) ctx.setStrokeStyle('red') ctx.moveTo(64, 368) ctx.lineTo(114, 368) ctx.stroke() ctx.fillText('¥99元', 64, 373) ctx.setFontSize(18) ctx.fillText('团购价仅需', 20, 403) ctx.fillText('元', 144, 403) ctx.setFontSize(20) ctx.setFillStyle('red') ctx.fillText('¥1', 109, 403) ctx.drawImage('../../../static/groupImg/share_bottom.png', 3, 419, 370, 192); ctx.setFontSize(20) ctx.setFillStyle('red') ctx.fillText('名额有限,售完截止', 9, 467) ctx.setFontSize(18) ctx.setFillStyle('#000') ctx.fillText('长按识别二维码参加团购', 9, 493) ctx.drawImage('../../../static/groupImg/code.png', 217, 374, 135, 135); ctx.draw(true, function (res) { wx.canvasToTempFilePath({ x: 0, y: 0, width: 370, height: 507, destWidth: 370, destHeight: 507, canvasId: 'myCanvas', success:(res) => { console.log(res.tempFilePath) // wx.saveImageToPhotosAlbum({ // filePath: res.path, // success(res) { // console.log(res); // } // }) that.setData({ imgUrls: res.tempFilePath }) } }) }) }, share: function () { this.setData({ shareFlag: !this.data.shareFlag }) }, PreservationImg: function () { wx.saveImageToPhotosAlbum({ filePath: this.data.imgUrls, success(res) { console.log('保存成功') } }) }, shareFriend: function () { this.triggerEvent('customevent', {}) } } })