开发文档首页
- 网络
- 媒体
- 文件
- wx.saveFile
- wx.getFileInfo
- wx.getSavedFileList
- wx.getSavedFileInfo
- wx.removeSavedFile
- wx.openDocument
- 文件管理器
- FileSystemManager
- wx.getFileSystemManager
- FileSystemManager.appendFile
- FileSystemManager.access
- FileSystemManager.accessSync
- FileSystemManager.appendFileSync
- FileSystemManager.copyFile
- FileSystemManager.copyFileSync
- FileSystemManager.getSavedFileList
- FileSystemManager.getFileInfo
- FileSystemManager.mkdir
- FileSystemManager.mkdirSync
- FileSystemManager.removeSavedFile
- FileSystemManager.readFileSync
- FileSystemManager.renameSync
- FileSystemManager.rmdirSync
- FileSystemManager.readdir
- FileSystemManager.rename
- FileSystemManager.readFile
- FileSystemManager.rmdir
- FileSystemManager.readdirSync
- FileSystemManager.saveFile
- FileSystemManager.saveFileSync
- FileSystemManager.stat
- FileSystemManager.statSync
- Stats
- Stats.isDirectory
- Stats.isFile
- FileSystemManager.unlink
- FileSystemManager.unzip
- FileSystemManager.unlinkSync
- FileSystemManager.writeFile
- FileSystemManager.writeFileSync
- 数据缓存
- 位置
- 设备
- 系统信息
- 内存
- 网络状态
- 加速度计
- 罗盘
- 拨打电话
- 扫码
- 剪贴板
- 蓝牙
- wx.openBluetoothAdapter
- wx.closeBluetoothAdapter
- wx.getBluetoothAdapterState
- wx.onBluetoothAdapterStateChange
- wx.startBluetoothDevicesDiscovery
- wx.stopBluetoothDevicesDiscovery
- wx.getBluetoothDevices
- wx.getConnectedBluetoothDevices
- wx.onBluetoothDeviceFound
- wx.createBLEConnection
- wx.closeBLEConnection
- wx.getBLEDeviceServices
- wx.getBLEDeviceCharacteristics
- wx.readBLECharacteristicValue
- wx.writeBLECharacteristicValue
- wx.notifyBLECharacteristicValueChange
- wx.onBLEConnectionStateChange
- wx.onBLECharacteristicValueChange
- 错误码
- iBeacon
- 屏幕亮度
- 用户截屏事件
- 振动
- 手机联系人
- NFC
- Wi-Fi
- 界面
- 交互反馈
- 设置导航条
- 设置tabBar
- 设置窗口背景
- 设置置顶信息
- 导航
- 动画
- 位置
- 绘图
- intro
- coordinates
- gradient
- reference
- color
- wx.createCanvasContext
- wx.createContext
- wx.drawCanvas
- wx.canvasToTempFilePath
- wx.canvasGetImageData
- wx.canvasPutImageData
- setFillStyle
- setStrokeStyle
- setShadow
- createLinearGradient
- createCircularGradient
- addColorStop
- setLineWidth
- setLineCap
- setLineJoin
- setLineDash
- setMiterLimit
- rect
- fillRect
- strokeRect
- clearRect
- fill
- stroke
- beginPath
- closePath
- moveTo
- lineTo
- arc
- bezierCurveTo
- quadraticCurveTo
- scale
- rotate
- translate
- clip
- setFontSize
- fillText
- setTextAlign
- setTextBaseline
- drawImage
- setGlobalAlpha
- save
- restore
- draw
- getActions
- clearActions
- measureText
- globalCompositeOperation
- arcTo
- strokeText
- lineDashOffset
- createPattern
- shadowBlur
- shadowColor
- shadowOffsetX
- shadowOffsetY
- font
- transform
- setTransform
- 下拉刷新
- WXML节点信息
- WXML节点布局相交状态
- 自定义组件
- 第三方平台
- 开放接口
- 数据
- 更新
- 多线程
- 监控
- 调试接口
- 日志
本页面已暂停更新,请查看[最新文档](https://developers.weixin.qq.com/miniprogram/dev/api/canvas/CanvasContext.createLinearGradient.html)
创建一个线性的渐变颜色。
Tip: 需要使用 addColorStop() 来指定渐变点,至少要两个。
| 参数 | 类型 | 定义 |
|---|---|---|
| x0 | Number | 起点的x坐标 |
| y0 | Number | 起点的y坐标 |
| x1 | Number | 终点的x坐标 |
| y1 | Number | 终点的y坐标 |
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()
