CanvasContext.beginPath

2020-09-14 15:16 更新

简介

CanvasContext.beginPath 是开始创建一个路径,需要调用 fill 或者 stroke 才会使用路径进行填充或描边。 在创建路径最开始时,相当于调用了一次 beginPath(),同一个路径内的多次 setFillStyle()setStrokeStyle()setLineWidth() 等设置,以最后一次设置为准。

扫码体验

img

效果示例

img

示例代码

  1. //.js
  2. const ctx = my.createCanvasContext('canvas')
  3. ctx.rect(20, 20, 150, 50)
  4. ctx.setFillStyle('blue')
  5. ctx.fill();
  6. ctx.beginPath();
  7. ctx.rect(20, 50, 150, 40)
  8. ctx.setFillStyle('yellow')
  9. ctx.fillRect(20, 170, 150, 40)
  10. ctx.rect(10, 100, 100, 30)
  11. ctx.setFillStyle('red')
  12. ctx.fill()
  13. ctx.draw()

显示效果如下图所示: ctx.beginpath.png

以上内容是否对您有帮助:
在线笔记
App下载
App下载

扫描二维码

下载编程狮App

公众号
微信公众号

编程狮公众号