canvasrenderingcontext2d.stroke(path2d path)
基础库 或更高版本； 若版本较低，建议采取 兼容处理 。
支小宝客户端 支持
安诊儿客户端 支持
小程序开发者工具： 支持。path2d 于 3.8.2 及以上版本支持。
主体： 企业支付宝小程序 、 个人支付宝小程序
为当前路径或指定 path2d 路径中所有子路径绘制描边。
使用非零环绕规则绘制。
效果示例
代码示例执行效果
默认标题0
path2d path
指定描边的 path2d 路径。可选。不传入将会描边当前路径。ide 于 3.8.2 及以上版本支持。
描边当前路径
描边指定 path2d 路径
.js
.axml
page({
oncanvasready() {
my.createselectorquery().select('#canvas').node().exec((res) => {
const canvas = res[0].node
const ctx = canvas.getcontext('2d')
// 路径 1
let p1 = ctx.createpath2d()
// 创建未闭合的子路径
p1.moveto(10, 10)
p1.lineto(10, 50)
p1.lineto(50, 50)
p1.moveto(70, 50)
p1.lineto(120, 50)
p1.lineto(120, 100)
// 路径 2
let p2 = ctx.createpath2d()
// 创建闭合的矩形子路径
p2.rect(10, 70, 50, 30)
ctx.stroke(p1)
ctx.stroke(p2)
})
}
})
<canvas id="canvas" type="2d" onready="oncanvasready">canvas>
.js
.axml
page({
oncanvasready() {
my.createselectorquery().select('#canvas').node().exec((res) => {
const canvas = res[0].node
const ctx = canvas.getcontext('2d')
// 路径 1
let p1 = ctx.createpath2d()
// 创建未闭合的子路径
p1.moveto(10, 10)
p1.lineto(10, 50)
p1.lineto(50, 50)
p1.moveto(70, 50)
p1.lineto(120, 50)
p1.lineto(120, 100)
// 路径 2
let p2 = ctx.createpath2d()
// 创建闭合的矩形子路径
p2.rect(10, 70, 50, 30)
ctx.stroke(p1)
ctx.stroke(p2)
})
}
})
<canvas id="canvas" type="2d" onready="oncanvasready">canvas>