fix: canvas fill style 支持的颜色定义错误

README.md

@@ -23,6 +23,9 @@ Fixed 错误定义
 * [x] fix component 定义
 * [x] fix page 定义错误
 * [x] fix wx.OnStopCallbackResult (RecorderManager)
+* [x] fix wx.Color 定义错误
+* [x] fix 支持 canvasContext.setFillStyle() 传入 wx.CanvasGradient 类型
+* [x] fix canvasContext.drawImage() 可选 3/5/9 个参数
 
 > [English version](./README-en.md)
 

test/canvas.test.ts

@@ -0,0 +1,34 @@
+
+Page({
+  data: {},
+  getImage() {
+    const canvasWidth = 420
+    const ctx = wx.createCanvasContext('share-canvas')
+    ctx.setFontSize(20)
+    ctx.setFillStyle('rgb(179,179,179)')
+    ctx.fillText('test', 0, 20, canvasWidth)
+    ctx.drawImage('img', 0, 50, canvasWidth, 210)
+    const gradient = ctx.createLinearGradient(0, 50, 0, 210)
+    gradient.addColorStop(0, 'Black')
+    gradient.addColorStop(0.5, '#abcdef')
+    gradient.addColorStop(1, 'rgba(0,0,0,0.4)')
+    ctx.setFillStyle(gradient)
+    ctx.fillRect(0, 50, canvasWidth, 210)
+
+    ctx.setStrokeStyle('#fff')
+    ctx.setLineJoin('round')
+    ctx.setLineWidth(6)
+    ctx.strokeRect(20, 198, 76, 76)
+    ctx.drawImage('abc', 20, 198, 76, 76)
+
+    ctx.draw(false, () => {
+      wx.canvasToTempFilePath({
+        canvasId: 'share-canvas',
+        quality: 1,
+        success: ({ tempFilePath }) => {
+          this.setData({ shareImage: tempFilePath })
+        },
+      })
+    })
+  },
+})

types/wx/lib.wx.api.d.ts

@@ -822,6 +822,8 @@ backgroundAudioManager.src = 'http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb
     /** 接口调用成功的回调函数 */
     success?: CloseSocketSuccessCallback;
   }
+  /** 16进制颜色 或 `rgba(0, 0, 0, 0.1)` */
+  type HexColor = string & { hexish?: any }
   /** 颜色。可以用以下几种方式来表示 canvas 中使用的颜色：
    *
    * - RGB 颜色： 如 `'rgb(255, 0, 0)'`
@@ -983,7 +985,8 @@ backgroundAudioManager.src = 'http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb
    * | Yellow               | #FFFF00 |
    * | YellowGreen          | #9ACD32 | */
   type Color =
-    |'AliceBlue'
+    | HexColor
+    | 'AliceBlue'
     | 'AntiqueWhite'
     | 'Aqua'
     | 'Aquamarine'
@@ -5308,6 +5311,18 @@ wx.chooseImage({
 
 ```
 * ![] */
+    drawImage(
+      imageResource: string,
+      sx: number,
+      sy: number
+    ): void;
+    drawImage(
+      imageResource: string,
+      sx: number,
+      sy: number,
+      sWidth: number,
+      sHeight: number,
+    ): void;
     drawImage(
       /** 所要绘制的图片资源 */
       imageResource: string,
@@ -5674,7 +5689,7 @@ ctx.draw()
       /** [Color]
        *
        * 填充的颜色，默认颜色为 black。 */
-      color: Color,
+      color: Color | wx.CanvasGradient,
     ): void;
     /** [CanvasContext.setFontSize(number fontSize)](CanvasContext.setFontSize.md)
 * 
@@ -5978,7 +5993,7 @@ ctx.draw()
       /** [Color]
        *
        * 描边的颜色，默认颜色为 black。 */
-      color: Color,
+      color: Color | wx.CanvasGradient,
     ): void;
     /** [CanvasContext.setTextAlign(string align)](CanvasContext.setTextAlign.md)
 * 
@@ -6305,7 +6320,7 @@ ctx.draw()
       /** [Color]
        *
        * 渐变点的颜色。 */
-      color: Color,
+      color: Color
     ): void;
   }
   interface Console {