收藏
回答

canvas中ctx.setLineWidth()这个方法真机失效

业务需要在canvas中画不同粗细的线条,多次调用setLineWidth这个接口改变线条直径,第一次之后设置全部无效,颜色等其他参数则没问题。 小程序电脑调试工具上预览也没问题,上传到iphone7 最新ios最新微信上预览则出现问题。

var context = wx.createCanvasContext('ringBar')

// 底部填充环


context.setLineWidth(8)


context.arc(150, 79, 70, 0.2*Math.PI, 0.8*Math.PI, true)
context.setStrokeStyle("#E87500")
context.setLineCap('round')
context.stroke()
 
// 进度环
var startAng = -1.2*Math.PI
var allAng = 0.2*Math.PI
var curEndAng = (this.data.curQuitDay/this.data.totalQuitDay)*1.4*Math.PI-1.2*Math.PI
 
if (this.data.curAng < curEndAng) {
  this.setData({
    curAng: this.data.curAng + Math.PI * 0.01
  })
} else {
  clearInterval(this.barInterval)
}
context.beginPath()
context.arc(150, 79, 70, this.data.curAng, 0.8*Math.PI, true)
var grd = context.createLinearGradient(80, 70, 220, 70)
grd.addColorStop(0, '#C986FF')
grd.addColorStop(1, "#A0FBFF")

context.setStrokeStyle(grd)


context.setLineWidth(8)


context.stroke()


回答关注问题邀请回答
收藏
登录 后发表内容