收藏
回答

真机上使用CanvasContext.clip( path2d )无效

框架类型 问题类型 API/组件名称 终端类型 微信版本 基础库版本
小程序 Bug Canvas.createPath2D; CanvasContext.clip 微信安卓客户端 8.0.6.1900 2.17.0
test() {//这是path2d裁剪
    const that = this,
      path = that.can.createPath2D()
    that.ctx.save()
    path.moveTo(3030);
    path.lineTo(12020);
    path.lineTo(20080);
    path.lineTo(110150);
    that.ctx.clearRect(00, that.windowWidth, that.windowWidth)
    that.ctx.clip(path)
    that.ctx.drawImage(that.img, 00, that.windowWidth, that.windowWidth)
    that.ctx.restore()
  }


test1() {//这是路径裁剪
    const that = this
    that.ctx.save()
    that.ctx.beginPath()
    that.ctx.moveTo(2020);
    that.ctx.lineTo(20080);
    that.ctx.lineTo(110150);
    that.ctx.clearRect(00, that.windowWidth, that.windowWidth)
    that.ctx.clip()
    that.ctx.drawImage(that.img, 00, that.windowWidth, that.windowWidth)
    that.ctx.restore()
  }


这是模拟器中,点击裁剪后会这样

path2d和直接使用lineTo

真机上却无效,但真机上不使用path2D直接使用lineTo却没问题

但使用路径之后再用path2D似乎还有save和restore无效的情况,具体请使用代码片段尝试

真机:红米k30pro;安卓11;miui12.5.2稳定版

最后一次编辑于  2021-06-05
回答关注问题邀请回答
收藏

1 个回答

  • 小程序技术专员-binnie
    小程序技术专员-binnie
    2021-06-08

    2d canvas 暂时还不支持传递path2d对象,可以先使用路径裁剪实现,后续我们再补齐。

    2021-06-08
    有用 1
    回复 1
    •     
          
      2021-06-08
      终于回复了,感动😪
      2021-06-08
      回复
登录 后发表内容