From 44d317b98ad1531d7398170938b742b5cf05d49d Mon Sep 17 00:00:00 2001
From: lanyill <lanyi3@huawei.com>
Date: Fri, 24 Feb 2023 17:32:03 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9canvas=E6=96=87=E6=A1=A3clip?=
 =?UTF-8?q?=E6=96=B9=E6=B3=95=E7=A4=BA=E4=BE=8B=E5=9B=BE=E7=89=87-3.1relea?=
 =?UTF-8?q?se?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: lanyill <lanyi3@huawei.com>
---
 .../figures/zh-cn_image_000000127777779.png   | Bin 190640 -> 3873 bytes
 .../arkui-ts/ts-canvasrenderingcontext2d.md   |  11 ++++++++---
 .../ts-offscreencanvasrenderingcontext2d.md   |  13 +++++++++----
 3 files changed, 17 insertions(+), 7 deletions(-)

diff --git a/zh-cn/application-dev/reference/arkui-ts/figures/zh-cn_image_000000127777779.png b/zh-cn/application-dev/reference/arkui-ts/figures/zh-cn_image_000000127777779.png
index 4558b332925757d97d70ee57182c260804629346..24edbed60b52947c5effbba951a6523582603f30 100644
GIT binary patch
literal 3873
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
MNNdwtgjeGK05}0RvH$=8

literal 190640
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

diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-canvasrenderingcontext2d.md b/zh-cn/application-dev/reference/arkui-ts/ts-canvasrenderingcontext2d.md
index 4b6f3b10dc..aed1687f00 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-canvasrenderingcontext2d.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-canvasrenderingcontext2d.md
@@ -1663,10 +1663,15 @@ struct Clip {
         .backgroundColor('#ffff00')
         .onReady(() =>{
           let region = new Path2D()
-          region.rect(80,10,20,130)
-          region.rect(40,50,100,50)
+          region.moveTo(30, 90)
+          region.lineTo(110, 20)
+          region.lineTo(240, 130)
+          region.lineTo(60, 130)
+          region.lineTo(190, 20)
+          region.lineTo(270, 90)
+          region.closePath()
           this.context.clip(region,"evenodd")
-          this.context.fillStyle = "rgb(255,0,0)"
+          this.context.fillStyle = "rgb(0,255,0)"
           this.context.fillRect(0, 0, this.context.width, this.context.height)
         })
     }
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-offscreencanvasrenderingcontext2d.md b/zh-cn/application-dev/reference/arkui-ts/ts-offscreencanvasrenderingcontext2d.md
index 3848d963cf..386dff9981 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-offscreencanvasrenderingcontext2d.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-offscreencanvasrenderingcontext2d.md
@@ -1766,11 +1766,16 @@ struct Clip {
         .height('100%')
         .backgroundColor('#ffff00')
         .onReady(() =>{
-          let region = new Path2D();
-          region.rect(80,10,20,130);
-          region.rect(40,50,100,50);
+          let region = new Path2D()
+          region.moveTo(30, 90)
+          region.lineTo(110, 20)
+          region.lineTo(240, 130)
+          region.lineTo(60, 130)
+          region.lineTo(190, 20)
+          region.lineTo(270, 90)
+          region.closePath()
           this.offContext.clip(region,"evenodd")
-          this.offContext.fillStyle = "rgb(255,0,0)"
+          this.offContext.fillStyle = "rgb(0,255,0)"
           this.offContext.fillRect(0, 0, 600, 600)
           var image = this.offContext.transferToImageBitmap()
           this.context.transferFromImageBitmap(image)
-- 
GitLab