大学生之家,大学生资讯发布平台
大学生之家

小程序画布创建一个线性的渐变颜色CanvasContext.createLinearGradient

    发布时间:2025-04-12    阅读:
    来源:大学生之家
CanvasGradient CanvasContext.createLinearGradient(number x0, number y0, number x1, number y1)
小程序插件:支持
创建一个线性的渐变颜色。返回的CanvasGradient对象需要使用 CanvasGradient.addColorStop() 来指定渐变点,至少要两个。

参数
number x0
起点的 x 坐标

number y0
起点的 y 坐标

number x1
终点的 x 坐标

number y1
终点的 y 坐标

返回值
CanvasGradient
示例代码

const ctx = wx.createCanvasContext('myCanvas')
 
// Create linear gradient
const grd = ctx.createLinearGradient(0, 0, 200, 0)
grd.addColorStop(0, 'red')
grd.addColorStop(1, 'white')
 
// Fill with gradient
ctx.setFillStyle(grd)
ctx.fillRect(10, 10, 150, 80)
ctx.draw()
计算机学习推荐
  • 扫一扫 分享悦读 ➤
  • 扫码可以分享到微信 qq朋友圈
计算机学习热点