- 当前 Bug 的表现(可附上截图)
从上往下多次执行save和restore,但每次执行,都有可能出现 save和restore之间设置的样式,被下一个区间的的绘图所继承。
下面这个是执行正常的画图:
下面这个是执行不正常的画图,“苏打绿”的字体大小不知道继承的哪的:
- 提供一个最简复现 Demo
const ctx = wx.createCanvasContext('myCanvas')
// 背景图片
ctx.save()
ctx.drawImage(res[0].path, 0, 0, 750, 1334)
ctx.restore()
// 日期
ctx.save()
ctx.setTextBaseline('top')
ctx.fillStyle = '#FFFFFF'
ctx.font = 'normal normal bold normal 120px "DIN Alternate"'
ctx.fillText(poster.time.day, 59, 67)
ctx.restore()
// 月份和年份
ctx.save()
ctx.setTextBaseline('top')
ctx.fillStyle = '#FFFFFF'
ctx.font = 'normal normal normal normal 24px "DIN Alternate"'
ctx.fillText(poster.time.month + ' ' + poster.time.year, 69, 198)
ctx.restore()
// 一句话
ctx.save()
ctx.setTextBaseline('top')
ctx.fillStyle = '#FFFFFF'
ctx.font = 'normal normal bold normal 32px "PingFang SC"'
ctx.fillText(poster.text.str, 64, 257)
ctx.restore()
// 一句话下面的横线
ctx.save()
ctx.setStrokeStyle('#ffffff')
ctx.setLineWidth(4)
ctx.beginPath()
ctx.moveTo(64, 346)
ctx.lineTo(120, 346)
ctx.stroke()
ctx.restore()
// 一句话来源
ctx.save()
ctx.setTextBaseline('top')
ctx.fillStyle = 'rgba(255,255,255,.64)'
ctx.font = 'normal normal bold normal 24px "PingFang SC"'
ctx.fillText(poster.text.source, 64, 386)
ctx.restore()
//绘图
ctx.draw()
你要是设置了字体的大小就不会这样了
setFontSize