CanvasContext.clip()

基础库 1.6.0 开始支持,低版本需做兼容处理

从原始画布中剪切任意形状和尺寸。一旦剪切了某个区域,则所有之后的绘图都会被限制在被剪切的区域内(不能访问画布上的其他区域)。可以在使用 clip 方法前通过使用 save 方法对当前画布区域进行保存,并在以后的任意时间通过restore方法对其进行恢复。

示例代码

  1. const ctx = wx.createCanvasContext('myCanvas')
  2. wx.downloadFile({
  3. url: 'http://is5.mzstatic.com/image/thumb/Purple128/v4/75/3b/90/753b907c-b7fb-5877-215a-759bd73691a4/source/50x50bb.jpg',
  4. success: function(res) {
  5. ctx.save()
  6. ctx.beginPath()
  7. ctx.arc(50, 50, 25, 0, 2*Math.PI)
  8. ctx.clip()
  9. ctx.drawImage(res.tempFilePath, 25, 25)
  10. ctx.restore()
  11. ctx.draw()
  12. }
  13. })

CanvasContext.clip - 图1