// 创建画板
this.mycanvas = wx.createCanvasContext("canvas");
// 设置线的样式
this.mycanvas.setLineCap("round");
this.mycanvas.setLineJoin("round");
// 初始化颜色
const grd = this.mycanvas.createCircularGradient(75,50,50);
grd.addColorStop(0, 'red')
grd.addColorStop(1, 'white')
this.mycanvas.setStrokeStyle(grd)
按照官方文档写,这是直接在画板上绘制了渐变的圆形
但是我是想要画笔的线条颜色为渐变色,请问一下大家应该怎样实现
题主要的代码如下,有帮助麻烦点个采纳【本回答右上角】,谢谢~~
demo.wxml
<canvas style="width: 100%; height: 200px;" canvas-id="firstCanvas"></canvas>
demo.js
Page({
onReady: function (e) {
const ctx = wx.createCanvasContext('firstCanvas');
const grd = ctx.createLinearGradient(0, 0, 250, 0);
grd.addColorStop(0, 'red');
grd.addColorStop(1, 'white');
ctx.setStrokeStyle(grd);
ctx.moveTo(10, 10);
ctx.lineTo(260, 10);
ctx.stroke();
ctx.draw();
}
})