首页 > 其他分享 >CanvasContext.beginPath

CanvasContext.beginPath

时间:2025-01-05 11:34:06浏览次数:1  
标签:10 CanvasContext ctx path 100 beginPath fill

CanvasContext.beginPath()

CanvasContext 是旧版的接口,新版 Canvas 2D 接口与 Web 一致

从基础库 2.9.0 开始,本接口停止维护,请使用 RenderingContext 代替

小程序插件:支持

相关文档: 旧版画布迁移指南canvas 组件介绍

功能描述

开始创建一个路径。需要调用 fill 或者 stroke 才会使用路径进行填充或描边

  • 在最开始的时候相当于调用了一次 beginPath
  • 同一个路径内的多次 setFillStylesetStrokeStylesetLineWidth等设置,以最后一次设置为准。

示例代码

const ctx = wx.createCanvasContext('myCanvas')
// begin path
ctx.rect(10, 10, 100, 30)
ctx.setFillStyle('yellow')
ctx.fill()

// begin another path
ctx.beginPath()
ctx.rect(10, 40, 100, 30)

// only fill this rect, not in current path
ctx.setFillStyle('blue')
ctx.fillRect(10, 70, 100, 30)

ctx.rect(10, 100, 100, 30)

// it will fill current path
ctx.setFillStyle('red')
ctx.fill()
ctx.draw()

img

标签:10,CanvasContext,ctx,path,100,beginPath,fill
From: https://www.cnblogs.com/AtlasLapetos/p/18630564

相关文章

  • wx.createCanvasContext
    CanvasContextwx.createCanvasContext(stringcanvasId,Objectthis)从基础库2.9.0开始,本接口停止维护,请使用Canvas代替小程序插件:支持,需要小程序基础库版本不低于1.9.6微信Windows版:支持微信Mac版:支持微信鸿蒙OS版:支持相关文档:旧版画布迁移指南、canvas......
  • Canvas的context.beginPath()很重要
    在开发一个小画板,用到canvas,做了一个油漆桶工具,每次填色,都会填到几个不同的图案里,而我想要的只是一个一个的填色,点哪个给哪个填色,找了半天,原因原来是画图时没......