• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1# @ohos.graphics.drawing (绘制模块)
2
3应用在开发中,经常需要针对不同的元素内容进行绘制,开发者通常可以选择直接使用ArkUI组件来绘制想要的元素或效果,但有些自定义图形或效果无法满足,此时可以选择使用Drawing来实现灵活的自定义绘制效果。Drawing模块提供基本的绘制能力,如绘制矩形、圆形、点、直线、自定义Path和字体等。
4
5> **说明:**
6>
7> - 本模块首批接口从API version 11开始支持。后续版本的新增接口,采用上角标单独标记接口的起始版本。
8>
9> - 本模块使用屏幕物理像素单位px。
10>
11> - 本模块为单线程模型策略,需要调用方自行管理线程安全和上下文状态的切换。
12
13## 导入模块
14
15```ts
16import { drawing } from '@kit.ArkGraphics2D';
17```
18
19## BlendMode
20
21混合模式枚举。混合模式会将两种颜色(源色、目标色)以特定的方式混合生成一种新的颜色,通常用于叠加、滤镜和遮罩等图形操作场景。混合操作会分别作用于红、绿、蓝三个颜色通道,采用相同的混合逻辑,而透明度(Alpha通道)则根据各模式的定义另行处理。
22
23为简洁起见,我们使用以下缩写:
24
25s : source 源的缩写。 d : destination 目标的缩写。 sa : source alpha 源透明度的缩写。 da : destination alpha 目标透明度的缩写。
26
27计算结果用如下缩写表示:
28
29r : 如果4个通道(透明度、红、绿、蓝)的计算方式相同,用r表示。 ra : 如果只操作透明度通道,用ra表示。 rc : 如果操作3个颜色通道,用rc表示。
30
31以黄色矩形为源图像,蓝色圆形为目标图像,各混合模式枚举生成的效果示意图请参考下表。
32
33**系统能力:** SystemCapability.Graphics.Drawing
34
35| 名称        | 值   | 说明                                                         | 示意图   |
36| ----------- | ---- | ------------------------------------------------------------ | -------- |
37| CLEAR       | 0    | 清除模式,r = 0,设置为全透明。                                | ![CLEAR](./figures/zh-ch_image_BlendMode_Clear.png) |
38| SRC         | 1    | r = s(result的4个通道,都等于source的4个通道,即结果等于源。),使用源像素替换目标像素。 | ![SRC](./figures/zh-ch_image_BlendMode_Src.png) |
39| DST         | 2    | r = d(result的4个通道,都等于destination的4个通道,即结果等于目标。),保持目标像素不变。 | ![DST](./figures/zh-ch_image_BlendMode_Dst.png) |
40| SRC_OVER    | 3    | r = s + (1 - sa) * d,在目标像素上方绘制源像素,考虑源像素的透明度。 | ![SRC_OVER](./figures/zh-ch_image_BlendMode_SrcOver.png) |
41| DST_OVER    | 4    | r = d + (1 - da) * s,在源像素上方绘制目标像素,考虑目标像素的透明度。 | ![DST_OVER](./figures/zh-ch_image_BlendMode_DstOver.png) |
42| SRC_IN      | 5    | r = s * da,仅保留源像素与目标不透明部分的交集。 | ![SRC_IN](./figures/zh-ch_image_BlendMode_SrcIn.png) |
43| DST_IN      | 6    | r = d * sa,仅保留目标像素与源不透明部分的交集。 | ![DST_IN](./figures/zh-ch_image_BlendMode_DstIn.png) |
44| SRC_OUT     | 7    | r = s * (1 - da),保留源像素中不与目标重叠的部分。 | ![SRC_OUT](./figures/zh-ch_image_BlendMode_SrcOut.png) |
45| DST_OUT     | 8    | r = d * (1 - sa),保留目标像素中不与源重叠的部分。 | ![DST_OUT](./figures/zh-ch_image_BlendMode_DstOut.png) |
46| SRC_ATOP    | 9    | r = s * da + d * (1 - sa),源像素覆盖在目标像素上,仅在目标不透明部分显示源像素。 | ![SRC_ATOP](./figures/zh-ch_image_BlendMode_SrcATop.png) |
47| DST_ATOP    | 10   | r = d * sa + s * (1 - da),目标像素覆盖在源像素上,仅在源不透明部分显示目标像素。 | ![DST_ATOP](./figures/zh-ch_image_BlendMode_DstATop.png) |
48| XOR         | 11   | r = s * (1 - da) + d * (1 - sa),仅显示源像素和目标像素中不重叠的部分。 | ![XOR](./figures/zh-ch_image_BlendMode_Xor.png) |
49| PLUS        | 12   | r = min(s + d, 1),源和目标像素的颜色值相加。                   | ![PLUS](./figures/zh-ch_image_BlendMode_Plus.png) |
50| MODULATE    | 13   | r = s * d,源和目标像素的颜色值相乘。                           | ![MODULATE](./figures/zh-ch_image_BlendMode_Modulate.png) |
51| SCREEN      | 14   | 滤色模式,r = s + d - s * d,反转源和目标像素的颜色值,相乘后再反转,结果通常更亮。 | ![SCREEN](./figures/zh-ch_image_BlendMode_Screen.png) |
52| OVERLAY     | 15   | 叠加模式,根据目标像素的亮度,选择性地应用MULTIPLY或SCREEN模式,增强对比度。 | ![OVERLAY](./figures/zh-ch_image_BlendMode_Overlay.png) |
53| DARKEN      | 16   | 变暗模式,rc = s + d - max(s * da, d * sa), ra = s + (1 - sa) * d,取源和目标像素中较暗的颜色值。 | ![DARKEN](./figures/zh-ch_image_BlendMode_Darken.png) |
54| LIGHTEN     | 17   | 变亮模式,rc = s + d - min(s * da, d * sa), ra = s + (1 - sa) * d,取源和目标像素中较亮的颜色值。 | ![LIGHTEN](./figures/zh-ch_image_BlendMode_Lighten.png) |
55| COLOR_DODGE | 18   | 颜色减淡模式,通过减小对比度使目标像素变亮以反映源像素。           | ![COLOR_DODGE](./figures/zh-ch_image_BlendMode_ColorDodge.png) |
56| COLOR_BURN  | 19   | 颜色加深模式,通过增加对比度使目标像素变暗以反映源像素。           | ![COLOR_BURN](./figures/zh-ch_image_BlendMode_ColorBurn.png) |
57| HARD_LIGHT  | 20   | 强光模式,根据源像素的亮度,选择性地应用MULTIPLY或SCREEN模式。    | ![HARD_LIGHT](./figures/zh-ch_image_BlendMode_HardLight.png) |
58| SOFT_LIGHT  | 21   | 柔光模式,根据源像素的亮度,柔和地变亮或变暗目标像素。             | ![SOFT_LIGHT](./figures/zh-ch_image_BlendMode_SoftLight.png) |
59| DIFFERENCE  | 22   | 差值模式,rc = s + d - 2 * (min(s * da, d * sa)), ra = s + (1 - sa) * d,计算源和目标像素颜色值的差异。 | ![DIFFERENCE](./figures/zh-ch_image_BlendMode_Difference.png) |
60| EXCLUSION   | 23   | 排除模式,rc = s + d - two(s * d), ra = s + (1 - sa) * d,类似于DIFFERENCE,但对比度较低。 | ![EXCLUSION](./figures/zh-ch_image_BlendMode_Exclusion.png) |
61| MULTIPLY    | 24   | 正片叠底,r = s * (1 - da) + d * (1 - sa) + s * d,源和目标像素的颜色值相乘,结果通常更暗。 | ![MULTIPLY](./figures/zh-ch_image_BlendMode_Multiply.png) |
62| HUE         | 25   | 色相模式,使用源像素的色相,目标像素的饱和度和亮度。               | ![HUE](./figures/zh-ch_image_BlendMode_Hue.png) |
63| SATURATION  | 26   | 饱和度模式,使用源像素的饱和度,目标像素的色相和亮度。             | ![SATURATION](./figures/zh-ch_image_BlendMode_Saturation.png) |
64| COLOR       | 27   | 颜色模式,使用源像素的色相和饱和度,目标像素的亮度。               | ![COLOR](./figures/zh-ch_image_BlendMode_Color.png) |
65| LUMINOSITY  | 28   | 亮度模式,使用源像素的亮度,目标像素的色相和饱和度。               | ![LUMINOSITY](./figures/zh-ch_image_BlendMode_Luminosity.png) |
66
67## PathMeasureMatrixFlags<sup>12+</sup>
68
69路径测量中的矩阵信息维度枚举,常用于控制物体沿路径移动的动画场景。
70
71**系统能力:** SystemCapability.Graphics.Drawing
72
73| 名称        | 值   | 说明                                                         |
74| ----------- | ---- | ------------------------------------------------------------ |
75| GET_POSITION_MATRIX        | 0    | 获取位置信息对应的矩阵。                                            |
76| GET_TANGENT_MATRIX          | 1    | 获取切线信息对应的矩阵。 |
77| GET_POSITION_AND_TANGENT_MATRIX    | 2     | 获取位置和切线信息对应的矩阵。 |
78
79## SrcRectConstraint<sup>12+</sup>
80
81源矩形区域约束类型枚举,用于在画布绘制图像时指定是否将采样范围限制在源矩形区域内。
82
83**系统能力:** SystemCapability.Graphics.Drawing
84
85| 名称        | 值   | 说明                                                         |
86| ----------- | ---- | ------------------------------------------------------------ |
87| STRICT         | 0    | 严格限制采样范围在源矩形区域内,速度较慢。                                            |
88| FAST           | 1    | 允许采样范围超出源矩形范围,速度较快。 |
89
90## ShadowFlag<sup>12+</sup>
91
92控制阴影绘制行为的枚举。
93
94**系统能力:** SystemCapability.Graphics.Drawing
95
96| 名称                         | 值    | 说明                 |
97| -------------------------- | ---- | ------------------ |
98| NONE      | 0    | 不使用任何阴影处理选项。        |
99| TRANSPARENT_OCCLUDER | 1    | 遮挡物是半透明的。         |
100| GEOMETRIC_ONLY    | 2    | 仅使用几何阴影效果。        |
101| ALL           | 3    | 使用所有可用的阴影处理选项,以生成组合阴影效果,包括半透明遮挡和几何阴影效果。 |
102
103## PathOp<sup>12+</sup>
104
105路径操作类型枚举,可用于合并或裁剪路径等功能。
106
107**系统能力:** SystemCapability.Graphics.Drawing
108
109| 名称                   | 值   | 说明                           |
110| ---------------------- | ---- | ------------------------------ |
111| DIFFERENCE     | 0    | 差集操作。 |
112| INTERSECT    | 1    | 交集操作。 |
113| UNION    | 2    | 并集操作。 |
114| XOR     | 3    | 异或操作。 |
115| REVERSE_DIFFERENCE     | 4    | 反向差集操作。 |
116
117## PathIteratorVerb<sup>18+</sup>
118
119迭代器包含的路径操作类型枚举,可用于读取path的操作指令。
120
121**系统能力:** SystemCapability.Graphics.Drawing
122
123| 名称  | 值   | 说明                           |
124| ----- | ---- | ------------------------------ |
125| MOVE  | 0    | 设置起始点。 |
126| LINE  | 1    | 添加线段。 |
127| QUAD  | 2    | 添加二阶贝塞尔圆滑曲线。 |
128| CONIC | 3    | 添加圆锥曲线。 |
129| CUBIC | 4    | 添加三阶贝塞尔圆滑曲线。 |
130| CLOSE | 5    | 路径闭合。 |
131| DONE  | CLOSE + 1    | 路径设置完成。 |
132
133## PathIterator<sup>18+</sup>
134
135表示路径操作迭代器,可通过遍历迭代器读取path的操作指令。
136
137### constructor<sup>18+</sup>
138
139constructor(path: Path)
140
141构造迭代器并绑定路径。
142
143**系统能力:** SystemCapability.Graphics.Drawing
144
145**参数:**
146
147| 参数名   | 类型                                         | 必填 | 说明                            |
148| -------- | -------------------------------------------- | ---- | ------------------------------- |
149| path | [Path](#path) | 是   | 迭代器绑定的路径对象。                 |
150
151**示例:**
152
153```ts
154import { drawing } from '@kit.ArkGraphics2D';
155
156let path: drawing.Path = new drawing.Path();
157let iter: drawing.PathIterator = new drawing.PathIterator(path);
158```
159
160### next<sup>18+</sup>
161
162next(points: Array<common2D.Point>, offset?: number): PathIteratorVerb
163
164返回当前路径的下一个操作,并将迭代器置于该操作。
165
166**系统能力:** SystemCapability.Graphics.Drawing
167
168**参数:**
169
170| 参数名   | 类型                                         | 必填 | 说明                            |
171| -------- | -------------------------------------------- | ---- | ------------------------------- |
172| points | Array\<[common2D.Point](js-apis-graphics-common2D.md#point12)>   | 是   | 坐标点数组,长度必须至少为偏移量加4,以确保能容纳所有类型的路径数据。操作执行后,该数组会被覆盖。填入的坐标点数量取决于操作类型,其中,MOVE填入1个坐标点,LINE填入2个坐标点,QUAD填入3个坐标点,CONIC填入3个坐标点 + 1个权重值(共3.5组),CUBIC填入4个坐标点,CLOSE和DONE不填入任何点。 |
173| offset | number   | 否   | 数组中写入位置相对起始点的偏移量,默认为0,取值范围为[0, size-4],size是指坐标点数组长度。 |
174
175**返回值:**
176
177| 类型                  | 说明           |
178| --------------------- | -------------- |
179| [PathIteratorVerb](#pathiteratorverb18) | 迭代器包含的路径操作类型。 |
180
181**错误码:**
182
183以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
184
185| 错误码ID | 错误信息 |
186| ------- | --------------------------------------------|
187| 401 | Parameter error.Possible causes:1. Mandatory parameters are left unspecified;2. Incorrect parameter types; 3. Parameter verification failed. |
188
189**示例:**
190
191```ts
192import { common2D, drawing } from '@kit.ArkGraphics2D';
193
194let path: drawing.Path = new drawing.Path();
195path.moveTo(10, 20);
196let iter: drawing.PathIterator = new drawing.PathIterator(path);
197let verbStr: Array<string> = ["MOVE", "LINE", "QUAD", "CONIC", "CUBIC", "CLOSE", "DONE"];
198let pointCount: Array<number> = [1,2,3,4,4,0,0]; //1,2,3,3.5,4,0,0
199let points: Array<common2D.Point> = [{x: 0, y: 0}, {x: 0, y: 0}, {x: 0, y: 0}, {x: 0, y: 0}];
200let offset = 0;
201let verb = iter.next(points, offset);
202let outputMessage: string = "pathIteratorNext: ";
203outputMessage += "verb =" + verbStr[verb] + "; has " + pointCount[verb] + " pairs: ";
204for (let j = 0; j < pointCount[verb] + offset; j++) {
205  outputMessage += "[" + points[j].x + ", " + points[j].y + "]";
206}
207console.info(outputMessage);
208```
209
210### peek<sup>18+</sup>
211
212peek(): PathIteratorVerb
213
214返回当前路径的下一个操作,迭代器保持在原操作。
215
216**系统能力:** SystemCapability.Graphics.Drawing
217
218**返回值:**
219
220| 类型                  | 说明           |
221| --------------------- | -------------- |
222| [PathIteratorVerb](#pathiteratorverb18) | 迭代器包含的路径操作类型。 |
223
224**示例:**
225
226```ts
227import { drawing } from '@kit.ArkGraphics2D';
228
229let path: drawing.Path = new drawing.Path();
230let iter: drawing.PathIterator = new drawing.PathIterator(path);
231let res = iter.peek();
232```
233
234### hasNext<sup>18+</sup>
235
236hasNext(): boolean
237
238判断路径操作迭代器中是否还有下一个操作。
239
240**系统能力:** SystemCapability.Graphics.Drawing
241
242**返回值:**
243
244| 类型    | 说明           |
245| ------- | -------------- |
246| boolean | 判断路径操作迭代器中是否还有下一个操作。true表示有,false表示没有。 |
247
248**示例:**
249
250```ts
251import { drawing } from '@kit.ArkGraphics2D';
252
253let path: drawing.Path = new drawing.Path();
254let iter: drawing.PathIterator = new drawing.PathIterator(path);
255let res = iter.hasNext();
256```
257
258## Path
259
260由直线、圆弧、二阶贝塞尔、三阶贝塞尔组成的复合几何路径。
261
262### constructor<sup>12+</sup>
263
264constructor()
265
266构造一个路径。
267
268**系统能力:** SystemCapability.Graphics.Drawing
269
270**示例:**
271
272```ts
273import { drawing } from '@kit.ArkGraphics2D';
274
275let path: drawing.Path = new drawing.Path();
276```
277
278### constructor<sup>12+</sup>
279
280constructor(path: Path)
281
282构造一个已有路径的副本。
283
284**系统能力:** SystemCapability.Graphics.Drawing
285
286**参数:**
287
288| 参数名   | 类型                                         | 必填 | 说明                            |
289| -------- | -------------------------------------------- | ---- | ------------------------------- |
290| path | [Path](#path) | 是   | 待复制的路径对象。                 |
291
292**示例:**
293
294```ts
295import { drawing } from '@kit.ArkGraphics2D';
296
297let path: drawing.Path = new drawing.Path();
298path.moveTo(0, 0);
299path.lineTo(0, 700);
300path.lineTo(700, 0);
301path.close();
302let path1: drawing.Path =  new drawing.Path(path);
303```
304
305### set<sup>20+</sup>
306
307set(src: Path): void
308
309使用另一个路径对当前路径进行更新。
310
311**系统能力:** SystemCapability.Graphics.Drawing
312
313**参数:**
314
315| 参数名   | 类型                                         | 必填 | 说明                            |
316| -------- | -------------------------------------------- | ---- | ------------------------------- |
317| src | [Path](#path) | 是   | 用于更新的路径。                 |
318
319**示例:**
320
321```ts
322import { drawing } from '@kit.ArkGraphics2D';
323let path: drawing.Path = new drawing.Path();
324path.moveTo(0, 0);
325path.lineTo(0, 700);
326path.lineTo(700, 0);
327path.close();
328let path1: drawing.Path = new drawing.Path();
329path1.set(path);
330```
331
332### moveTo
333
334moveTo(x: number, y: number) : void
335
336设置自定义路径的起始点位置。
337
338**系统能力:** SystemCapability.Graphics.Drawing
339
340**参数:**
341
342| 参数名 | 类型   | 必填 | 说明                    |
343| ------ | ------ | ---- | ----------------------- |
344| x      | number | 是   | 起始点的x轴坐标,该参数为浮点数。 |
345| y      | number | 是   | 起始点的y轴坐标,该参数为浮点数。 |
346
347**错误码:**
348
349以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
350
351| 错误码ID | 错误信息 |
352| ------- | --------------------------------------------|
353| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
354
355**示例:**
356
357```ts
358import { drawing } from '@kit.ArkGraphics2D';
359
360let path = new drawing.Path();
361path.moveTo(10,10);
362```
363
364### lineTo
365
366lineTo(x: number, y: number) : void
367
368添加一条从路径的最后点位置(若路径没有内容则默认为 (0, 0))到目标点位置的线段。
369
370**系统能力:** SystemCapability.Graphics.Drawing
371
372**参数:**
373
374| 参数名 | 类型   | 必填 | 说明                    |
375| ------ | ------ | ---- | ----------------------- |
376| x      | number | 是   | 目标点的x轴坐标,该参数为浮点数。 |
377| y      | number | 是   | 目标点的y轴坐标,该参数为浮点数。 |
378
379**错误码:**
380
381以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
382
383| 错误码ID | 错误信息 |
384| ------- | --------------------------------------------|
385| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
386
387**示例:**
388
389```ts
390import { drawing } from '@kit.ArkGraphics2D';
391
392let path = new drawing.Path();
393path.moveTo(10,10);
394path.lineTo(10, 15);
395```
396
397### arcTo
398
399arcTo(x1: number, y1: number, x2: number, y2: number, startDeg: number, sweepDeg: number): void
400
401给路径添加一段弧线,绘制弧线的方式为角度弧,该方式首先会指定一个矩形边框,取其内切椭圆,然后会指定一个起始角度和扫描度数,从起始角度扫描截取的椭圆周长一部分即为绘制的弧线。另外会默认添加一条从路径的最后点位置到弧线起始点位置的线段。
402
403**系统能力:** SystemCapability.Graphics.Drawing
404
405**参数:**
406
407| 参数名   | 类型   | 必填 | 说明                       |
408| -------- | ------ | ---- | -------------------------- |
409| x1       | number | 是   | 矩形左上角的x坐标,该参数为浮点数。 |
410| y1       | number | 是   | 矩形左上角的y坐标,该参数为浮点数。 |
411| x2       | number | 是   | 矩形右下角的x坐标,该参数为浮点数。 |
412| y2       | number | 是   | 矩形右下角的y坐标,该参数为浮点数。 |
413| startDeg | number | 是   | 起始的角度。角度的起始方向(0°)为x轴正方向。 |
414| sweepDeg | number | 是   | 扫描的度数,为正数时顺时针扫描,为负数时逆时针扫描。实际扫描的度数为该入参对360取模的结果。 |
415
416**错误码:**
417
418以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
419
420| 错误码ID | 错误信息 |
421| ------- | --------------------------------------------|
422| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
423
424**示例:**
425
426```ts
427import { drawing } from '@kit.ArkGraphics2D';
428
429let path = new drawing.Path();
430path.moveTo(10,10);
431path.arcTo(10, 15, 10, 10, 10, 10);
432```
433
434### quadTo
435
436quadTo(ctrlX: number, ctrlY: number, endX: number, endY: number): void
437
438添加从路径最后点位置(若路径没有内容则为 (0, 0))到目标点位置的二阶贝塞尔曲线。
439
440**系统能力:** SystemCapability.Graphics.Drawing
441
442**参数:**
443
444| 参数名 | 类型   | 必填 | 说明                  |
445| ------ | ------ | ---- | --------------------- |
446| ctrlX  | number | 是   | 控制点的x坐标,该参数为浮点数。 |
447| ctrlY  | number | 是   | 控制点的y坐标,该参数为浮点数。 |
448| endX   | number | 是   | 目标点的x坐标,该参数为浮点数。 |
449| endY   | number | 是   | 目标点的y坐标,该参数为浮点数。 |
450
451**错误码:**
452
453以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
454
455| 错误码ID | 错误信息 |
456| ------- | --------------------------------------------|
457| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
458
459**示例:**
460
461```ts
462import { drawing } from '@kit.ArkGraphics2D';
463
464let path = new drawing.Path();
465path.moveTo(10,10);
466path.quadTo(10, 15, 10, 10);
467```
468
469### conicTo<sup>12+</sup>
470
471conicTo(ctrlX: number, ctrlY: number, endX: number, endY: number, weight: number): void
472
473在当前路径上添加一条路径最后点位置(若路径没有内容则默认为 (0, 0))到目标点位置的圆锥曲线,其控制点为 (ctrlX, ctrlY),结束点为 (endX, endY)。
474
475**系统能力:** SystemCapability.Graphics.Drawing
476
477**参数:**
478
479| 参数名 | 类型   | 必填 | 说明                  |
480| ------ | ------ | ---- | --------------------- |
481| ctrlX  | number | 是   | 控制点的x坐标,该参数为浮点数。 |
482| ctrlY  | number | 是   | 控制点的y坐标,该参数为浮点数。 |
483| endX   | number | 是   | 目标点的x坐标,该参数为浮点数。 |
484| endY   | number | 是   | 目标点的y坐标,该参数为浮点数。 |
485| weight | number | 是   | 表示曲线权重,决定了曲线的形状。值越大,曲线越接近控制点。小于等于0时,效果与[lineTo](#lineto)相同;值为1时,效果与[quadTo](#quadto)相同。该参数为浮点数。 |
486
487**错误码:**
488
489以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
490
491| 错误码ID | 错误信息 |
492| ------- | --------------------------------------------|
493| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
494
495**示例:**
496
497```ts
498import { drawing } from '@kit.ArkGraphics2D';
499
500const path = new drawing.Path();
501path.conicTo(200, 400, 100, 200, 0);
502```
503
504### cubicTo
505
506cubicTo(ctrlX1: number, ctrlY1: number, ctrlX2: number, ctrlY2: number, endX: number, endY: number): void
507
508添加一条从路径最后点位置(若路径没有内容则默认为 (0, 0))到目标点位置的三阶贝塞尔圆滑曲线。
509
510**系统能力:** SystemCapability.Graphics.Drawing
511
512**参数:**
513
514| 参数名 | 类型   | 必填 | 说明                        |
515| ------ | ------ | ---- | --------------------------- |
516| ctrlX1 | number | 是   | 第一个控制点的x坐标,该参数为浮点数。 |
517| ctrlY1 | number | 是   | 第一个控制点的y坐标,该参数为浮点数。 |
518| ctrlX2 | number | 是   | 第二个控制点的x坐标,该参数为浮点数。 |
519| ctrlY2 | number | 是   | 第二个控制点的y坐标,该参数为浮点数。 |
520| endX   | number | 是   | 目标点的x坐标,该参数为浮点数。 |
521| endY   | number | 是   | 目标点的y坐标,该参数为浮点数。 |
522
523**错误码:**
524
525以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
526
527| 错误码ID | 错误信息 |
528| ------- | --------------------------------------------|
529| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
530
531**示例:**
532
533```ts
534import { drawing } from '@kit.ArkGraphics2D';
535
536let path = new drawing.Path();
537path.moveTo(10,10);
538path.cubicTo(100, 100, 80, 150, 300, 150);
539```
540
541### rMoveTo<sup>12+</sup>
542
543rMoveTo(dx: number, dy: number): void
544
545设置一个相对于当前路径终点(若路径没有内容则默认为 (0, 0))的路径起始点位置。
546
547**系统能力:** SystemCapability.Graphics.Drawing
548
549**参数:**
550
551| 参数名 | 类型   | 必填 | 说明                    |
552| ------ | ------ | ---- | ----------------------- |
553| dx     | number | 是   | 路径新起始点相对于当前路径终点的x轴偏移量,正数往x轴正方向偏移,负数往x轴负方向偏移,该参数为浮点数。 |
554| dy     | number | 是   | 路径新起始点相对于当前路径终点的y轴偏移量,正数往y轴正方向偏移,负数往y轴负方向偏移,该参数为浮点数。 |
555
556**错误码:**
557
558以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
559
560| 错误码ID | 错误信息 |
561| ------- | --------------------------------------------|
562| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
563
564**示例:**
565
566```ts
567import { drawing } from '@kit.ArkGraphics2D';
568
569const path = new drawing.Path();
570path.rMoveTo(10, 10);
571```
572
573### rLineTo<sup>12+</sup>
574
575rLineTo(dx: number, dy: number): void
576
577使用相对位置在当前路径上添加一条当前路径终点(若路径没有内容则默认为 (0, 0))到目标点位置的线段。
578
579**系统能力:** SystemCapability.Graphics.Drawing
580
581**参数:**
582
583| 参数名 | 类型   | 必填 | 说明                    |
584| ------ | ------ | ---- | ----------------------- |
585| dx     | number | 是   | 目标点相对于当前路径终点的x轴偏移量,正数往x轴正方向偏移,负数往x轴负方向偏移,该参数为浮点数。 |
586| dy     | number | 是   | 目标点相对于当前路径终点的y轴偏移量,正数往y轴正方向偏移,负数往y轴负方向偏移,该参数为浮点数。 |
587
588**错误码:**
589
590以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
591
592| 错误码ID | 错误信息 |
593| ------- | --------------------------------------------|
594| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
595
596**示例:**
597
598```ts
599import { drawing } from '@kit.ArkGraphics2D';
600
601const path = new drawing.Path();
602path.rLineTo(400, 200);
603```
604
605### rQuadTo<sup>12+</sup>
606
607rQuadTo(dx1: number, dy1: number, dx2: number, dy2: number): void
608
609使用相对位置在当前路径上添加一条当前路径终点(若路径没有内容则默认为 (0, 0))到目标点位置的二阶贝塞尔曲线。
610
611**系统能力:** SystemCapability.Graphics.Drawing
612
613**参数:**
614
615| 参数名 | 类型   | 必填 | 说明                  |
616| ------ | ------ | ---- | --------------------- |
617| dx1  | number | 是   | 控制点相对于路径终点的x轴偏移量,正数往x轴正方向偏移,负数往x轴负方向偏移,该参数为浮点数。 |
618| dy1  | number | 是   | 控制点相对于路径终点的y轴偏移量,正数往y轴正方向偏移,负数往y轴负方向偏移,该参数为浮点数。 |
619| dx2   | number | 是   | 目标点相对于路径终点的x轴偏移量,正数往x轴正方向偏移,负数往x轴负方向偏移,该参数为浮点数。 |
620| dy2   | number | 是   | 目标点相对于路径终点的y轴偏移量,正数往y轴正方向偏移,负数往y轴负方向偏移,该参数为浮点数。 |
621
622**错误码:**
623
624以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
625
626| 错误码ID | 错误信息 |
627| ------- | --------------------------------------------|
628| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
629
630**示例:**
631
632```ts
633import { drawing } from '@kit.ArkGraphics2D';
634
635const path = new drawing.Path();
636path.rQuadTo(100, 0, 0, 200);
637```
638
639### rConicTo<sup>12+</sup>
640
641rConicTo(ctrlX: number, ctrlY: number, endX: number, endY: number, weight: number): void
642
643使用相对位置在当前路径上添加一条路径终点(若路径没有内容则默认为 (0, 0))到目标点位置的圆锥曲线。
644
645**系统能力:** SystemCapability.Graphics.Drawing
646
647**参数:**
648
649| 参数名 | 类型   | 必填 | 说明                  |
650| ------ | ------ | ---- | --------------------- |
651| ctrlX  | number | 是   | 控制点相对于路径终点的x轴偏移量,正数往x轴正方向偏移,负数往x轴负方向偏移,该参数为浮点数。 |
652| ctrlY  | number | 是   | 控制点相对于路径终点的y轴偏移量,正数往y轴正方向偏移,负数往y轴负方向偏移,该参数为浮点数。 |
653| endX   | number | 是   | 目标点相对于路径终点的x轴偏移量,正数往x轴正方向偏移,负数往x轴负方向偏移,该参数为浮点数。 |
654| endY   | number | 是   | 目标点相对于路径终点的y轴偏移量,正数往y轴正方向偏移,负数往y轴负方向偏移,该参数为浮点数。 |
655| weight | number | 是   | 表示曲线的权重,决定了曲线的形状,越大越接近控制点。若小于等于0则等同于使用[rLineTo](#rlineto12)添加一条到结束点的线段,若为1则等同于[rQuadTo](#rquadto12),该参数为浮点数。 |
656
657**错误码:**
658
659以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
660
661| 错误码ID | 错误信息 |
662| ------- | --------------------------------------------|
663| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
664
665**示例:**
666
667```ts
668import { drawing } from '@kit.ArkGraphics2D';
669
670const path = new drawing.Path();
671path.rConicTo(200, 400, 100, 200, 0);
672```
673
674### rCubicTo<sup>12+</sup>
675
676rCubicTo(ctrlX1: number, ctrlY1: number, ctrlX2: number, ctrlY2: number, endX: number, endY: number): void
677
678使用相对位置在当前路径上添加一条当前路径终点(若路径没有内容则默认为 (0, 0))到目标点位置的三阶贝塞尔曲线。
679
680**系统能力:** SystemCapability.Graphics.Drawing
681
682**参数:**
683
684| 参数名 | 类型   | 必填 | 说明                        |
685| ------ | ------ | ---- | --------------------------- |
686| ctrlX1 | number | 是   | 第一个控制点相对于路径终点的x轴偏移量,正数往x轴正方向偏移,负数往x轴负方向偏移,该参数为浮点数。 |
687| ctrlY1 | number | 是   | 第一个控制点相对于路径终点的y轴偏移量,正数往y轴正方向偏移,负数往y轴负方向偏移,该参数为浮点数。 |
688| ctrlX2 | number | 是   | 第二个控制点相对于路径终点的x轴偏移量,正数往x轴正方向偏移,负数往x轴负方向偏移,该参数为浮点数。 |
689| ctrlY2 | number | 是   | 第二个控制点相对于路径终点的y轴偏移量,正数往y轴正方向偏移,负数往y轴负方向偏移,该参数为浮点数。 |
690| endX   | number | 是   | 目标点相对于路径终点的x轴偏移量,正数往x轴正方向偏移,负数往x轴负方向偏移,该参数为浮点数。 |
691| endY   | number | 是   | 目标点相对于路径终点的y轴偏移量,正数往y轴正方向偏移,负数往y轴负方向偏移,该参数为浮点数。 |
692
693**错误码:**
694
695以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
696
697| 错误码ID | 错误信息 |
698| ------- | --------------------------------------------|
699| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
700
701**示例:**
702
703```ts
704import { drawing } from '@kit.ArkGraphics2D';
705
706const path = new drawing.Path();
707path.rCubicTo(200, 0, 0, 200, -20, 0);
708```
709
710### addArc<sup>12+</sup>
711
712addArc(rect: common2D.Rect, startAngle: number, sweepAngle: number): void
713
714向路径添加一段圆弧。
715当startAngle和sweepAngle同时满足以下两种情况时,添加整个椭圆而不是圆弧:
7161.startAngle对90取余接近于0;
7172.sweepAngle不在(-360, 360)区间内。
718其余情况sweepAngle会对360取余后添加圆弧。
719
720**系统能力:** SystemCapability.Graphics.Drawing
721
722**参数:**
723
724| 参数名         | 类型                                       | 必填   | 说明                  |
725| ----------- | ---------------------------------------- | ---- | ------------------- |
726| rect        | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是    | 包含弧的椭圆的矩形边界。      |
727| startAngle   | number | 是   | 弧的起始角度,单位为度,0度为x轴正方向,该参数为浮点数。 |
728| sweepAngle   | number | 是   | 扫描角度,单位为度。正数表示顺时针方向,负数表示逆时针方向,该参数为浮点数。 |
729
730**错误码:**
731
732以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
733
734| 错误码ID | 错误信息 |
735| ------- | --------------------------------------------|
736| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
737
738**示例:**
739
740```ts
741import { common2D, drawing } from '@kit.ArkGraphics2D';
742
743let path = new drawing.Path();
744const rect: common2D.Rect = {left:100, top:100, right:500, bottom:500};
745path.addArc(rect, 90, 180);
746```
747
748### addCircle<sup>12+</sup>
749
750addCircle(x: number, y: number, radius: number, pathDirection?: PathDirection): void
751
752按指定方向,向路径添加圆形,圆的起点位于(x + radius, y)。
753
754**系统能力:** SystemCapability.Graphics.Drawing
755
756**参数:**
757
758| 参数名         | 类型                                       | 必填   | 说明                  |
759| ----------- | ---------------------------------------- | ---- | ------------------- |
760| x   | number | 是   | 表示圆心的x轴坐标,该参数为浮点数。 |
761| y   | number | 是   | 表示圆心的y轴坐标,该参数为浮点数。 |
762| radius   | number | 是   | 表示圆形的半径,该参数为浮点数,小于等于0时不会有任何效果。 |
763| pathDirection   | [PathDirection](#pathdirection12)  | 否   | 表示路径方向,默认为顺时针方向。 |
764
765**错误码:**
766
767以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
768
769| 错误码ID | 错误信息 |
770| ------- | --------------------------------------------|
771| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types; 3. Parameter verification failed. |
772
773**示例:**
774
775```ts
776
777import { drawing } from '@kit.ArkGraphics2D';
778
779let path = new drawing.Path();
780path.addCircle(100, 200, 50, drawing.PathDirection.CLOCKWISE);
781```
782
783### addOval<sup>12+</sup>
784
785addOval(rect: common2D.Rect, start: number, pathDirection?: PathDirection): void
786
787按指定方向,将矩形的内切椭圆添加到路径中。
788
789**系统能力:** SystemCapability.Graphics.Drawing
790
791**参数:**
792
793| 参数名         | 类型                                       | 必填   | 说明                  |
794| ----------- | ---------------------------------------- | ---- | ------------------- |
795| rect        | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是    | 椭圆的矩形边界。      |
796| start   | number | 是   | 表示椭圆初始点的索引,0,1,2,3分别对应椭圆的上端点,右端点,下端点,左端点,该参数为不小于0的整数,大于等于4时会对4取余。 |
797| pathDirection   | [PathDirection](#pathdirection12)  | 否   | 表示路径方向,默认为顺时针方向。 |
798
799**错误码:**
800
801以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
802
803| 错误码ID | 错误信息 |
804| ------- | --------------------------------------------|
805| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types; 3. Parameter verification failed.|
806
807**示例:**
808
809```ts
810import { common2D, drawing } from '@kit.ArkGraphics2D';
811
812let path = new drawing.Path();
813const rect: common2D.Rect = {left:100, top:100, right:500, bottom:500};
814path.addOval(rect, 5, drawing.PathDirection.CLOCKWISE);
815```
816
817### addRect<sup>12+</sup>
818
819addRect(rect: common2D.Rect, pathDirection?: PathDirection): void
820
821按指定方向,将矩形添加到路径中,添加的路径的起始点为矩形左上角。
822
823**系统能力:** SystemCapability.Graphics.Drawing
824
825**参数:**
826
827| 参数名         | 类型                                       | 必填   | 说明                  |
828| ----------- | ---------------------------------------- | ---- | ------------------- |
829| rect        | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是    | 向路径中添加的矩形轮廓。      |
830| pathDirection   | [PathDirection](#pathdirection12)  | 否   | 表示路径方向,默认为顺时针方向。 |
831
832**错误码:**
833
834以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
835
836| 错误码ID | 错误信息 |
837| ------- | --------------------------------------------|
838| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types; 3. Parameter verification failed.|
839
840**示例:**
841
842```ts
843import { common2D, drawing } from '@kit.ArkGraphics2D';
844
845let path = new drawing.Path();
846const rect: common2D.Rect = {left:100, top:100, right:500, bottom:500};
847path.addRect(rect, drawing.PathDirection.CLOCKWISE);
848```
849
850### addRoundRect<sup>12+</sup>
851
852addRoundRect(roundRect: RoundRect, pathDirection?: PathDirection): void
853
854按指定方向,向路径添加圆角矩形轮廓。路径添加方向为顺时针时,起始点位于圆角矩形左下方圆角与左边界的交点;路径添加方向为逆时针时,起始点位于圆角矩形左上方圆角与左边界的交点。
855
856**系统能力:** SystemCapability.Graphics.Drawing
857
858**参数:**
859
860| 参数名         | 类型                                       | 必填   | 说明                  |
861| ----------- | ---------------------------------------- | ---- | ------------------- |
862| roundRect        | [RoundRect](#roundrect12) | 是    | 圆角矩形对象。      |
863| pathDirection   | [PathDirection](#pathdirection12)  | 否   | 表示路径方向,默认为顺时针方向。 |
864
865**错误码:**
866
867以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
868
869| 错误码ID | 错误信息 |
870| ------- | --------------------------------------------|
871| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types; 3. Parameter verification failed.|
872
873**示例:**
874
875```ts
876import { common2D, drawing } from '@kit.ArkGraphics2D';
877
878let path = new drawing.Path();
879const rect: common2D.Rect = {left:100, top:100, right:500, bottom:500};
880let roundRect = new drawing.RoundRect(rect, 50, 50);
881path.addRoundRect(roundRect, drawing.PathDirection.CLOCKWISE);
882```
883
884### addPath<sup>12+</sup>
885
886addPath(path: Path, matrix?: Matrix | null): void
887
888对源路径进行矩阵变换后,将其添加到当前路径中。
889
890**系统能力:** SystemCapability.Graphics.Drawing
891
892**参数:**
893
894| 参数名         | 类型                                       | 必填   | 说明                  |
895| ----------- | ---------------------------------------- | ---- | ------------------- |
896| path        | [Path](#path) | 是    | 表示源路径对象。      |
897| matrix   | [Matrix](#matrix12)\|null  | 否   | 表示矩阵对象,默认为单位矩阵。 |
898
899**错误码:**
900
901以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
902
903| 错误码ID | 错误信息 |
904| ------- | --------------------------------------------|
905| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
906
907**示例:**
908
909```ts
910import { common2D, drawing } from '@kit.ArkGraphics2D';
911
912let path = new drawing.Path();
913let matrix = new drawing.Matrix();
914const rect: common2D.Rect = {left:100, top:100, right:500, bottom:500};
915let roundRect = new drawing.RoundRect(rect, 50, 50);
916path.addRoundRect(roundRect, drawing.PathDirection.CLOCKWISE);
917let dstPath = new drawing.Path();
918dstPath.addPath(path, matrix);
919```
920
921### transform<sup>12+</sup>
922
923transform(matrix: Matrix): void
924
925对路径进行矩阵变换。
926
927**系统能力:** SystemCapability.Graphics.Drawing
928
929**参数:**
930
931| 参数名         | 类型                                       | 必填   | 说明                  |
932| ----------- | ---------------------------------------- | ---- | ------------------- |
933| matrix   | [Matrix](#matrix12)  | 是   | 表示矩阵对象。 |
934
935**错误码:**
936
937以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
938
939| 错误码ID | 错误信息 |
940| ------- | --------------------------------------------|
941| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
942
943**示例:**
944
945```ts
946import { common2D, drawing } from '@kit.ArkGraphics2D';
947
948let path = new drawing.Path();
949let matrix = new drawing.Matrix();
950matrix.setScale(1.5, 1.5, 10, 10);
951const rect: common2D.Rect = {left:100, top:100, right:500, bottom:500};
952let roundRect = new drawing.RoundRect(rect, 50, 50);
953path.addRoundRect(roundRect, drawing.PathDirection.CLOCKWISE);
954path.transform(matrix);
955```
956
957### contains<sup>12+</sup>
958
959contains(x: number, y: number): boolean
960
961判断指定坐标点是否被路径包含,判定是否被路径包含的规则参考[PathFillType](#pathfilltype12)。
962
963**系统能力:** SystemCapability.Graphics.Drawing
964
965**参数:**
966
967| 参数名 | 类型   | 必填 | 说明                    |
968| ------ | ------ | ---- | ----------------------- |
969| x      | number | 是   | x轴上坐标点,该参数必须为浮点数。 |
970| y      | number | 是   | y轴上坐标点,该参数必须为浮点数。 |
971
972**返回值:**
973
974| 类型    | 说明           |
975| ------- | -------------- |
976| boolean | 返回指定坐标点是否在路径内。true表示点在路径内,false表示点不在路径内。 |
977
978**错误码:**
979
980以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
981
982| 错误码ID | 错误信息 |
983| ------- | --------------------------------------------|
984| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
985
986**示例:**
987
988```ts
989import { common2D, drawing } from '@kit.ArkGraphics2D';
990
991const path = new drawing.Path();
992let rect : common2D.Rect = {left: 50, top: 50, right: 250, bottom: 250};
993path.addRect(rect, drawing.PathDirection.CLOCKWISE);
994console.info("test contains: " + path.contains(0, 0));
995console.info("test contains: " + path.contains(60, 60));
996```
997
998### setLastPoint<sup>20+</sup>
999
1000setLastPoint(x: number, y: number): void
1001
1002修改路径的最后一个点。
1003
1004**系统能力:** SystemCapability.Graphics.Drawing
1005
1006**参数:**
1007
1008| 参数名 | 类型   | 必填 | 说明                    |
1009| ------ | ------ | ---- | ----------------------- |
1010| x      | number | 是   | 指定点的x轴坐标,该参数为浮点数。0表示坐标原点,负数表示位于坐标原点左侧,正数表示位于坐标原点右侧。 |
1011| y      | number | 是   | 指定点的y轴坐标,该参数为浮点数。0表示坐标原点,负数表示位于坐标原点上侧,正数表示位于坐标原点下侧。 |
1012
1013**示例:**
1014
1015```ts
1016import { drawing } from '@kit.ArkGraphics2D';
1017const path = new drawing.Path();
1018path.moveTo(0, 0);
1019path.lineTo(0, 700);
1020let isEmpty = path.isEmpty();
1021console.info('isEmpty:', isEmpty);
1022path.reset();
1023isEmpty = path.isEmpty();
1024console.info('isEmpty:', isEmpty);
1025path.setLastPoint(50, 50);
1026console.info('isEmpty:', isEmpty);
1027```
1028
1029### setFillType<sup>12+</sup>
1030
1031setFillType(pathFillType: PathFillType): void
1032
1033设置路径的填充类型,决定路径内部区域的定义方式。例如,使用Winding填充类型时,路径内部区域由路径环绕的次数决定,而使用EvenOdd填充类型时,路径内部区域由路径环绕的次数是否为奇数决定。
1034
1035**系统能力:** SystemCapability.Graphics.Drawing
1036
1037**参数:**
1038
1039| 参数名         | 类型                                       | 必填   | 说明                  |
1040| ----------- | ---------------------------------------- | ---- | ------------------- |
1041| pathFillType   | [PathFillType](#pathfilltype12)  | 是   | 表示路径填充规则。 |
1042
1043**错误码:**
1044
1045以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
1046
1047| 错误码ID | 错误信息 |
1048| ------- | --------------------------------------------|
1049| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types; 3. Parameter verification failed.|
1050
1051**示例:**
1052
1053```ts
1054import { drawing } from '@kit.ArkGraphics2D';
1055
1056const path = new drawing.Path();
1057path.setFillType(drawing.PathFillType.WINDING);
1058```
1059
1060### getFillType<sup>20+</sup>
1061
1062getFillType(): PathFillType
1063
1064获取路径的填充类型。
1065
1066**系统能力:** SystemCapability.Graphics.Drawing
1067
1068**返回值:**
1069
1070| 类型                                               | 说明                   |
1071| -------------------------------------------------- | ---------------------- |
1072| [PathFillType](#pathfilltype12) | 路径填充类型。 |
1073
1074**示例:**
1075
1076```ts
1077import { drawing } from '@kit.ArkGraphics2D';
1078const path = new drawing.Path();
1079path.setFillType(drawing.PathFillType.WINDING);
1080let type = path.getFillType();
1081console.info("type :" + type);
1082```
1083
1084### getBounds<sup>12+</sup>
1085
1086getBounds(): common2D.Rect
1087
1088获取包含路径的最小矩形边界。
1089
1090**系统能力:** SystemCapability.Graphics.Drawing
1091
1092**返回值:**
1093
1094| 类型                                               | 说明                   |
1095| -------------------------------------------------- | ---------------------- |
1096| [common2D.Rect](js-apis-graphics-common2D.md#rect) | 包含路径的最小矩形区域。 |
1097
1098**示例:**
1099
1100```ts
1101import { common2D, drawing } from '@kit.ArkGraphics2D';
1102
1103const path = new drawing.Path();
1104path.lineTo(50, 40)
1105let rect : common2D.Rect = {left: 0, top: 0, right: 0, bottom: 0};
1106rect = path.getBounds();
1107console.info("test rect.left: " + rect.left);
1108console.info("test rect.top: " + rect.top);
1109console.info("test rect.right: " + rect.right);
1110console.info("test rect.bottom: " + rect.bottom);
1111```
1112
1113### addPolygon<sup>12+</sup>
1114
1115addPolygon(points: Array\<common2D.Point>, close: boolean): void
1116
1117通过坐标点列表添加多条连续的线段。
1118
1119**系统能力:** SystemCapability.Graphics.Drawing
1120
1121**参数:**
1122
1123| 参数名 | 类型   | 必填 | 说明                    |
1124| ------ | ------ | ---- | ----------------------- |
1125| points | Array\<[common2D.Point](js-apis-graphics-common2D.md#point12)>   | 是   | 坐标点数组。 |
1126| close  | boolean                                                        | 是   | 表示是否将路径闭合,即是否添加路径起始点到终点的连线。true表示将路径闭合,false表示不将路径闭合。 |
1127
1128**错误码:**
1129
1130以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
1131
1132| 错误码ID | 错误信息 |
1133| ------- | --------------------------------------------|
1134| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
1135
1136**示例:**
1137
1138```ts
1139import { common2D, drawing } from '@kit.ArkGraphics2D';
1140
1141let pointsArray = new Array<common2D.Point>();
1142const point1: common2D.Point = { x: 200, y: 200 };
1143const point2: common2D.Point = { x: 400, y: 200 };
1144const point3: common2D.Point = { x: 100, y: 400 };
1145const point4: common2D.Point = { x: 300, y: 400 };
1146pointsArray.push(point1);
1147pointsArray.push(point2);
1148pointsArray.push(point3);
1149pointsArray.push(point4);
1150const path = new drawing.Path();
1151path.addPolygon(pointsArray, false);
1152```
1153
1154### offset<sup>12+</sup>
1155
1156offset(dx: number, dy: number): Path
1157
1158将路径沿着x轴和y轴方向偏移一定距离并保存在返回的路径对象中。
1159
1160**系统能力:** SystemCapability.Graphics.Drawing
1161
1162**参数:**
1163
1164| 参数名 | 类型   | 必填 | 说明                    |
1165| ------ | ------ | ---- | ----------------------- |
1166| dx     | number        | 是   | x轴方向偏移量,正数往x轴正方向偏移,负数往x轴负方向偏移,该参数为浮点数。 |
1167| dy     | number        | 是   | y轴方向偏移量,正数往y轴正方向偏移,负数往y轴负方向偏移,该参数为浮点数。 |
1168
1169**返回值:**
1170
1171| 类型   | 说明                |
1172| ------ | ------------------ |
1173| [Path](#path) | 返回当前路径偏移(dx,dy)后生成的新路径对象。 |
1174
1175**错误码:**
1176
1177以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
1178
1179| 错误码ID | 错误信息 |
1180| ------- | --------------------------------------------|
1181| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
1182
1183**示例:**
1184
1185```ts
1186import { drawing } from '@kit.ArkGraphics2D';
1187
1188const path = new drawing.Path();
1189path.moveTo(200, 200);
1190path.lineTo(300, 300);
1191const dst = path.offset(200, 200);
1192```
1193
1194### op<sup>12+</sup>
1195
1196op(path: Path, pathOp: PathOp): boolean
1197
1198将当前路径置为和path按照指定的路径操作类型合并后的结果。
1199
1200**系统能力:** SystemCapability.Graphics.Drawing
1201
1202**参数:**
1203
1204| 参数名 | 类型   | 必填 | 说明                    |
1205| ------ | ------ | ---- | ----------------------- |
1206| path    | [Path](#path) | 是   | 路径对象,用于与当前路径合并。 |
1207| pathOp  | [PathOp](#pathop12)   | 是    | 路径操作类型枚举。    |
1208
1209**返回值:**
1210
1211| 类型   | 说明                |
1212| ------ | ------------------ |
1213| boolean | 返回路径合并是否成功的结果。true表示合并成功,false表示合并失败。 |
1214
1215**错误码:**
1216
1217以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
1218
1219| 错误码ID | 错误信息 |
1220| ------- | --------------------------------------------|
1221| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
1222
1223**示例:**
1224
1225```ts
1226import { drawing } from '@kit.ArkGraphics2D';
1227
1228const path = new drawing.Path();
1229const path2 = new drawing.Path();
1230path.addCircle(100, 200, 100, drawing.PathDirection.CLOCKWISE);
1231console.info("get pathOp: ", path2.op(path, drawing.PathOp.DIFFERENCE));
1232```
1233
1234### close
1235
1236close(): void
1237
1238闭合路径,会添加一条从路径起点位置到最后点位置的线段。
1239
1240**系统能力:** SystemCapability.Graphics.Drawing
1241
1242**示例:**
1243
1244```ts
1245import { drawing } from '@kit.ArkGraphics2D';
1246
1247let path = new drawing.Path();
1248path.moveTo(10,10);
1249path.cubicTo(10, 10, 10, 10, 15, 15);
1250path.close();
1251```
1252
1253### reset
1254
1255reset(): void
1256
1257重置自定义路径数据。
1258
1259**系统能力:** SystemCapability.Graphics.Drawing
1260
1261**示例:**
1262
1263```ts
1264import { drawing } from '@kit.ArkGraphics2D';
1265
1266let path = new drawing.Path();
1267path.moveTo(10,10);
1268path.cubicTo(10, 10, 10, 10, 15, 15);
1269path.reset();
1270```
1271
1272### rewind<sup>20+</sup>
1273
1274rewind(): void
1275
1276将路径内添加的各类点/线清空,但是保留内存空间。
1277
1278**系统能力:** SystemCapability.Graphics.Drawing
1279
1280**示例:**
1281
1282```ts
1283import { drawing } from '@kit.ArkGraphics2D';
1284let path = new drawing.Path();
1285path.moveTo(10,10);
1286path.lineTo(20,20);
1287path.rewind();
1288let empty = path.isEmpty();
1289console.info('empty : ', empty);
1290```
1291
1292### isEmpty<sup>20+</sup>
1293
1294isEmpty(): boolean
1295
1296判断路径是否为空。
1297
1298**系统能力:** SystemCapability.Graphics.Drawing
1299
1300**返回值:**
1301
1302| 类型  | 说明 |
1303| ------ | ---- |
1304| boolean | 路径是否为空。true表示当前路径为空,false表示路径不为空。|
1305
1306**示例:**
1307
1308```ts
1309import { drawing } from '@kit.ArkGraphics2D';
1310let path = new drawing.Path();
1311path.moveTo(10,10);
1312path.lineTo(20,20);
1313let isEmpty = path.isEmpty();
1314console.info('isEmpty:', isEmpty);
1315```
1316
1317### isRect<sup>20+</sup>
1318
1319isRect(rect: common2D.Rect | null): boolean
1320
1321判断路径是否构成矩形。
1322
1323**系统能力:** SystemCapability.Graphics.Drawing
1324
1325**参数:**
1326
1327| 参数名 | 类型   | 必填 | 说明                    |
1328| ------ | ------ | ---- | ----------------------- |
1329| rect   | [common2D.Rect](js-apis-graphics-common2D.md#rect)\| null | 是   | 矩形对象,作为出参使用,路径构成矩形时,会被改写为路径表示的矩形,否则不会改变。可以为null,表示无需获取路径表示的矩形。 |
1330
1331**返回值:**
1332
1333| 类型  | 说明 |
1334| ------ | ---- |
1335| boolean | 返回路径是否构成矩形。true表示路径构成矩形,false表示路径不构成矩形。|
1336
1337**示例:**
1338
1339```ts
1340import { common2D, drawing } from '@kit.ArkGraphics2D';
1341
1342let path = new drawing.Path();
1343path.moveTo(10,10);
1344path.lineTo(20,10);
1345let isRect = path.isRect(null);
1346console.info("isRect: ", isRect);
1347let rect: common2D.Rect = { left : 100, top : 100, right : 400, bottom : 500 };
1348path.lineTo(20, 20);
1349path.lineTo(10, 20);
1350path.lineTo(10, 10);
1351isRect = path.isRect(rect);
1352console.info('isRect: ', isRect);
1353```
1354
1355### getLength<sup>12+</sup>
1356
1357getLength(forceClosed: boolean): number
1358
1359获取路径长度。
1360
1361**系统能力:** SystemCapability.Graphics.Drawing
1362
1363**参数:**
1364
1365| 参数名| 类型  | 必填| 说明     |
1366| ----- | ------ | ---- | --------- |
1367| forceClosed  | boolean | 是  | 表示是否按照闭合路径测量,true表示测量时路径会被强制视为已闭合,false表示会根据路径的实际闭合状态测量。|
1368
1369**返回值:**
1370
1371| 类型  | 说明 |
1372| ------ | ---- |
1373| number | 路径长度。|
1374
1375**示例:**
1376
1377```ts
1378import { drawing } from '@kit.ArkGraphics2D';
1379
1380let path = new drawing.Path();
1381path.arcTo(20, 20, 180, 180, 180, 90);
1382let len = path.getLength(false);
1383console.info("path length = " + len);
1384```
1385
1386### getPositionAndTangent<sup>12+</sup>
1387
1388getPositionAndTangent(forceClosed: boolean, distance: number, position: common2D.Point, tangent: common2D.Point): boolean
1389
1390获取路径起始点指定距离处的坐标点和切线值。
1391
1392**系统能力:** SystemCapability.Graphics.Drawing
1393
1394**参数:**
1395
1396| 参数名   | 类型                                         | 必填 | 说明                            |
1397| -------- | -------------------------------------------- | ---- | ------------------------------- |
1398| forceClosed | boolean | 是   | 表示是否按照闭合路径测量,true表示测量时路径会被强制视为已闭合,false表示会根据路径的实际闭合状态测量。                 |
1399| distance | number | 是   | 表示与路径起始点的距离,小于0时会被视作0,大于路径长度时会被视作路径长度。该参数为浮点数。               |
1400| position | [common2D.Point](js-apis-graphics-common2D.md#point12) | 是   | 存储获取到的距离路径起始点distance处的点的坐标。                  |
1401| tangent | [common2D.Point](js-apis-graphics-common2D.md#point12) | 是   | 存储获取到的距离路径起始点distance处的点的切线值,tangent.x表示该点切线的余弦值,tangent.y表示该点切线的正弦值。                 |
1402
1403**返回值:**
1404
1405| 类型                  | 说明           |
1406| --------------------- | -------------- |
1407| boolean |表示是否成功获取距离路径起始点distance处的点的坐标和正切值的结果。true表示获取成功,false表示获取失败,position和tangent不会被改变。 |
1408
1409**错误码:**
1410
1411以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
1412
1413| 错误码ID | 错误信息 |
1414| ------- | --------------------------------------------|
1415| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
1416
1417**示例:**
1418
1419```ts
1420import { common2D, drawing } from '@kit.ArkGraphics2D';
1421
1422let path: drawing.Path = new drawing.Path();
1423path.moveTo(0, 0);
1424path.lineTo(0, 700);
1425path.lineTo(700, 0);
1426let position: common2D.Point = { x: 0.0, y: 0.0 };
1427let tangent: common2D.Point = { x: 0.0, y: 0.0 };
1428if (path.getPositionAndTangent(false, 0.1, position, tangent)) {
1429  console.info("getPositionAndTangent-----position:  "+ position.x);
1430  console.info("getPositionAndTangent-----position:  "+ position.y);
1431  console.info("getPositionAndTangent-----tangent:  "+ tangent.x);
1432  console.info("getPositionAndTangent-----tangent:  "+ tangent.y);
1433}
1434```
1435
1436### getSegment<sup>18+</sup>
1437
1438getSegment(forceClosed: boolean, start: number, stop: number, startWithMoveTo: boolean, dst: Path): boolean
1439
1440截取路径的片段并追加到目标路径上。
1441
1442**系统能力:** SystemCapability.Graphics.Drawing
1443
1444**参数:**
1445
1446| 参数名   | 类型                                         | 必填 | 说明                            |
1447| -------- | -------------------------------------------- | ---- | ------------------------------- |
1448| forceClosed | boolean | 是   | 表示是否按照闭合路径测量,true表示测量时路径会被强制视为已闭合,false表示会根据路径的实际闭合状态测量。                 |
1449| start | number | 是   | 表示与路径起始点的距离,距离路径起始点start距离的位置即为截取路径片段的起始点,小于0时会被视作0,大于等于stop时会截取失败。该参数为浮点数。               |
1450| stop | number | 是   | 表示与路径起始点的距离,距离路径起始点stop距离的位置即为截取路径片段的终点,小于等于start时会截取失败,大于路径长度时会被视作路径长度。该参数为浮点数。                  |
1451| startWithMoveTo | boolean | 是   | 表示是否在目标路径执行[moveTo](#moveto)移动到截取路径片段的起始点位置。true表示执行,false表示不执行。                |
1452| dst | [Path](#path) | 是   | 目标路径,截取成功时会将得到的路径片段追加到目标路径上,截取失败时不做改变。               |
1453
1454**返回值:**
1455
1456| 类型                  | 说明           |
1457| --------------------- | -------------- |
1458| boolean |表示是否成功截取路径片段。true表示截取成功,false表示截取失败。 |
1459
1460**示例:**
1461
1462```ts
1463import { drawing } from '@kit.ArkGraphics2D';
1464
1465let path: drawing.Path = new drawing.Path();
1466path.moveTo(0, 0);
1467path.lineTo(0, 700);
1468path.lineTo(700, 0);
1469let dstPath: drawing.Path = new drawing.Path();
1470console.info("getSegment-----result:  "+ path.getSegment(true, 10.0, 20.0, true, dstPath));
1471```
1472
1473### isClosed<sup>12+</sup>
1474
1475isClosed(): boolean
1476
1477获取路径是否闭合。
1478
1479**系统能力:** SystemCapability.Graphics.Drawing
1480
1481**返回值:**
1482
1483| 类型                  | 说明           |
1484| --------------------- | -------------- |
1485| boolean | 表示当前路径是否闭合,true表示闭合,false表示不闭合。 |
1486
1487**示例:**
1488
1489```ts
1490import { drawing } from '@kit.ArkGraphics2D';
1491
1492let path: drawing.Path = new drawing.Path();
1493path.moveTo(0, 0);
1494path.lineTo(0, 700);
1495if (path.isClosed()) {
1496  console.info("path is closed.");
1497} else {
1498  console.info("path is not closed.");
1499}
1500```
1501
1502### getMatrix<sup>12+</sup>
1503
1504getMatrix(forceClosed: boolean, distance: number, matrix: Matrix, flags: PathMeasureMatrixFlags): boolean
1505
1506在路径上的某个位置,获取一个变换矩阵,用于表示该点的坐标和朝向。
1507
1508**系统能力:** SystemCapability.Graphics.Drawing
1509
1510**参数:**
1511
1512| 参数名   | 类型                                         | 必填 | 说明                            |
1513| -------- | -------------------------------------------- | ---- | ------------------------------- |
1514| forceClosed | boolean | 是   | 表示是否按照闭合路径测量,true表示测量时路径会被强制视为已闭合,false表示会根据路径的实际闭合状态测量。                  |
1515| distance | number | 是   | 表示与路径起始点的距离,小于0时会被视作0,大于路径长度时会被视作路径长度。该参数为浮点数。                  |
1516| matrix | [Matrix](#matrix12) | 是   | 矩阵对象,用于存储得到的矩阵。                  |
1517| flags | [PathMeasureMatrixFlags](#pathmeasurematrixflags12) | 是   | 矩阵信息维度枚举。                  |
1518
1519**返回值:**
1520
1521| 类型                  | 说明           |
1522| --------------------- | -------------- |
1523| boolean | 返回是否成功获取变换矩阵的结果。true表示成功,false表示失败。 |
1524
1525**错误码:**
1526
1527以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
1528
1529| 错误码ID | 错误信息 |
1530| ------- | --------------------------------------------|
1531| 401 | Parameter error. Possible causes: Mandatory parameters are left unspecified. |
1532
1533**示例:**
1534
1535```ts
1536import { drawing } from '@kit.ArkGraphics2D';
1537
1538let path: drawing.Path = new drawing.Path();
1539let matrix = new drawing.Matrix();
1540if(path.getMatrix(false, 10, matrix, drawing.PathMeasureMatrixFlags.GET_TANGENT_MATRIX)) {
1541  console.info("path.getMatrix return true");
1542} else {
1543  console.info("path.getMatrix return false");
1544}
1545```
1546
1547### buildFromSvgString<sup>12+</sup>
1548
1549buildFromSvgString(str: string): boolean
1550
1551解析SVG字符串表示的路径。
1552
1553**系统能力:** SystemCapability.Graphics.Drawing
1554
1555**参数:**
1556
1557| 参数名   | 类型                                         | 必填 | 说明                            |
1558| -------- | -------------------------------------------- | ---- | ------------------------------- |
1559| str | string | 是   | SVG格式的字符串,用于描述绘制路径。                 |
1560
1561**返回值:**
1562
1563| 类型                  | 说明           |
1564| --------------------- | -------------- |
1565| boolean | 返回是否成功解析SVG字符串的结果。true表示解析成功,false表示解析失败。 |
1566
1567**错误码:**
1568
1569以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
1570
1571| 错误码ID | 错误信息 |
1572| ------- | --------------------------------------------|
1573| 401 | Parameter error. Possible causes: Mandatory parameters are left unspecified. |
1574
1575**示例:**
1576
1577```ts
1578import { drawing } from '@kit.ArkGraphics2D';
1579
1580let path: drawing.Path = new drawing.Path();
1581let svgStr: string =  "M150 100 L75 300 L225 300 Z";
1582if(path.buildFromSvgString(svgStr)) {
1583  console.info("buildFromSvgString return true");
1584} else {
1585  console.info("buildFromSvgString return false");
1586}
1587```
1588
1589### getPathIterator<sup>18+</sup>
1590
1591getPathIterator(): PathIterator
1592
1593返回该路径的操作迭代器。
1594
1595**系统能力:** SystemCapability.Graphics.Drawing
1596
1597**返回值:**
1598
1599| 类型                  | 说明           |
1600| --------------------- | -------------- |
1601| [PathIterator](#pathiterator18) | 该路径的迭代器对象。 |
1602
1603**示例:**
1604
1605```ts
1606import { drawing } from '@kit.ArkGraphics2D';
1607
1608let path: drawing.Path = new drawing.Path();
1609let iter = path.getPathIterator();
1610```
1611
1612### approximate<sup>20+</sup>
1613
1614approximate(acceptableError: number): Array\<number>
1615
1616将当前路径转化为由连续直线段构成的近似路径。
1617
1618> **说明:**
1619>
1620> - 当acceptableError为0时,曲线路径被极度细分,会严重影响性能和内存消耗,不建议设置误差值为0。
1621> - 当acceptableError特别大时,路径会极度简化,保留少量关键点,可能会丢失原有形状。
1622> - 对于椭圆等曲线,当acceptableError过大时,拟合结果通常只包含椭圆的分段贝塞尔曲线的起止点,椭圆形会被极度简化为多边形。
1623
1624**系统能力:** SystemCapability.Graphics.Drawing
1625
1626**参数:**
1627
1628| 参数名   | 类型                                         | 必填 | 说明                            |
1629| -------- | -------------------------------------------- | ---- | ------------------------------- |
1630| acceptableError | number | 是 | 表示路径上每条线段的可接受误差。该参数为浮点数,不应小于0,当参数小于0时报错。 |
1631
1632**返回值:**
1633
1634| 类型                  | 说明           |
1635| --------------------- | -------------- |
1636| Array\<number> | 返回包含近似路径的点的数组,至少包含两个点。每个点由三个值组成:<br>1. 该点所在的位置距离路径起点的长度比例值,范围为[0.0, 1.0]。<br>2. 点的x坐标。<br>3. 点的y坐标。 |
1637
1638**错误码:**
1639
1640以下错误码的详细介绍请参见[图形绘制与显示错误码](../apis-arkgraphics2d/errorcode-drawing.md)。
1641
1642| 错误码ID | 错误信息 |
1643| ------- | --------------------------------------------|
1644| 25900001 | Parameter error.Possible causes: Incorrect parameter range. |
1645
1646**示例:**
1647
1648```ts
1649import { drawing } from '@kit.ArkGraphics2D';
1650
1651let path: drawing.Path = new drawing.Path();
1652path.moveTo(100, 100);
1653path.lineTo(500, 500);
1654let points: number[] = path.approximate(0.5);
1655for (let i = 0; i < points.length; i += 3) {
1656  console.info("PathApproximate Fraction =" + points[i] + ", X =" + points[i + 1] + ", Y =" + points[i + 2] + "\n");
1657}
1658```
1659
1660### interpolate<sup>20+</sup>
1661
1662interpolate(other: Path, weight: number, interpolatedPath: Path): boolean
1663
1664根据给定的权重,在当前路径和另一条路径之间进行插值,并将结果存储在目标路径对象中。两条路径点数相同即可插值成功,目标路径按照当前路径的结构进行创建。
1665
1666**系统能力:** SystemCapability.Graphics.Drawing
1667
1668**参数:**
1669
1670| 参数名   | 类型                                         | 必填 | 说明                            |
1671| -------- | -------------------------------------------- | ---- | ------------------------------- |
1672| other | [Path](#path) | 是 | 表示另一条路径对象。 |
1673| weight | number | 是 | 表示插值权重,必须在[0.0, 1.0]范围内。该参数为浮点数。 |
1674| interpolatedPath | [Path](#path) | 是 | 表示用于存储插值结果的目标路径对象。 |
1675
1676**返回值:**
1677
1678| 类型                  | 说明           |
1679| --------------------- | -------------- |
1680| boolean | 返回插值操作是否成功的结果。true表示插值成功,false表示插值失败。 |
1681
1682**错误码:**
1683
1684以下错误码的详细介绍请参见[图形绘制与显示错误码](../apis-arkgraphics2d/errorcode-drawing.md)。
1685
1686| 错误码ID | 错误信息 |
1687| ------- | --------------------------------------------|
1688| 25900001 | Parameter error.Possible causes: Incorrect parameter range. |
1689
1690**示例:**
1691
1692```ts
1693import { drawing } from '@kit.ArkGraphics2D';
1694
1695let path: drawing.Path = new drawing.Path();
1696path.moveTo(50, 50);
1697path.lineTo(100, 100);
1698path.lineTo(200, 200);
1699let other: drawing.Path = new drawing.Path();
1700other.moveTo(80, 80);
1701other.lineTo(300, 300);
1702let interpolatedPath: drawing.Path = new drawing.Path();
1703if (path.interpolate(other, 0.0, interpolatedPath)) {
1704  console.info('interpolate return true');
1705} else {
1706  console.info('interpolate return false');
1707}
1708```
1709
1710### isInterpolate<sup>20+</sup>
1711
1712isInterpolate(other: Path): boolean
1713
1714判断当前路径与另一条路径在结构和操作顺序上是否完全一致,以确定两条路径是否兼容插值。若路径中包含圆锥曲线(Conic)操作,则对应操作的权重值也必须一致,才能视为兼容插值。
1715
1716**系统能力:** SystemCapability.Graphics.Drawing
1717
1718**参数:**
1719
1720| 参数名   | 类型                                         | 必填 | 说明                            |
1721| -------- | -------------------------------------------- | ---- | ------------------------------- |
1722| other | [Path](#path) | 是 | 表示另一条路径对象。 |
1723
1724**返回值:**
1725
1726| 类型                  | 说明           |
1727| --------------------- | -------------- |
1728| boolean | 返回当前路径与另一条路径是否兼容插值的结果。true表示兼容插值,false表示不兼容插值。 |
1729
1730**示例:**
1731
1732```ts
1733import { drawing } from '@kit.ArkGraphics2D';
1734
1735let path: drawing.Path = new drawing.Path();
1736path.moveTo(0, 0);
1737path.lineTo(100, 100);
1738let other: drawing.Path = new drawing.Path();
1739other.moveTo(0, 1);
1740other.lineTo(200, 200);
1741if (path.isInterpolate(other)) {
1742  console.info('isInterpolate return true');
1743} else {
1744  console.info('isInterpolate return false');
1745}
1746```
1747
1748## Canvas
1749
1750承载绘制内容与绘制状态的载体。
1751
1752> **说明:**
1753>
1754> 画布自带一个默认画刷,该画刷为黑色,开启反走样,不具备其他任何样式效果。当画布中没有主动设置画刷和画笔时,该默认画刷生效。
1755
1756### constructor
1757
1758constructor(pixelmap: image.PixelMap)
1759
1760创建一个以PixelMap作为绘制目标的Canvas对象。
1761
1762**系统能力:** SystemCapability.Graphics.Drawing
1763
1764**参数:**
1765
1766| 参数名   | 类型                                         | 必填 | 说明           |
1767| -------- | -------------------------------------------- | ---- | -------------- |
1768| pixelmap | [image.PixelMap](../apis-image-kit/arkts-apis-image-PixelMap.md) | 是   | 构造函数入参。 |
1769
1770**错误码:**
1771
1772以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
1773
1774| 错误码ID | 错误信息 |
1775| ------- | --------------------------------------------|
1776| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
1777
1778**示例:**
1779
1780```ts
1781import { drawing } from '@kit.ArkGraphics2D';
1782import { image } from '@kit.ImageKit';
1783
1784const color = new ArrayBuffer(96);
1785let opts : image.InitializationOptions = {
1786  editable: true,
1787  pixelFormat: 3,
1788  size: {
1789    height: 4,
1790    width: 6
1791  }
1792}
1793image.createPixelMap(color, opts).then((pixelMap) => {
1794  const canvas = new drawing.Canvas(pixelMap);
1795})
1796```
1797
1798### drawRect
1799
1800drawRect(rect: common2D.Rect): void
1801
1802绘制一个矩形,默认使用黑色填充。
1803
1804**系统能力:** SystemCapability.Graphics.Drawing
1805
1806**参数:**
1807
1808| 参数名 | 类型                                               | 必填 | 说明           |
1809| ------ | -------------------------------------------------- | ---- | -------------- |
1810| rect   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 绘制的矩形区域。 |
1811
1812**错误码:**
1813
1814以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
1815
1816| 错误码ID | 错误信息 |
1817| ------- | --------------------------------------------|
1818| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
1819
1820**示例:**
1821
1822```ts
1823import { RenderNode } from '@kit.ArkUI';
1824import { common2D, drawing } from '@kit.ArkGraphics2D';
1825
1826class DrawingRenderNode extends RenderNode {
1827  draw(context : DrawContext) {
1828    const canvas = context.canvas;
1829    const pen = new drawing.Pen();
1830    pen.setStrokeWidth(5);
1831    pen.setColor({alpha: 255, red: 255, green: 0, blue: 0});
1832    canvas.attachPen(pen);
1833    canvas.drawRect({ left : 0, right : 10, top : 0, bottom : 10 });
1834    canvas.detachPen();
1835  }
1836}
1837```
1838
1839### drawRect<sup>12+</sup>
1840
1841drawRect(left: number, top: number, right: number, bottom: number): void
1842
1843绘制一个矩形,默认使用黑色填充。性能优于[drawRect](#drawrect)接口,推荐使用本接口。
1844
1845**系统能力:** SystemCapability.Graphics.Drawing
1846
1847**参数:**
1848
1849| 参数名 | 类型    | 必填 | 说明           |
1850| ------ | ------ | ---- | -------------- |
1851| left   | number | 是   | 矩形的左上角x轴坐标,该参数为浮点数。 |
1852| top    | number | 是   | 矩形的左上角y轴坐标,该参数为浮点数。 |
1853| right  | number | 是   | 矩形的右下角x轴坐标,该参数为浮点数。 |
1854| bottom | number | 是   | 矩形的右下角y轴坐标,该参数为浮点数。 |
1855
1856**错误码:**
1857
1858以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
1859
1860| 错误码ID | 错误信息 |
1861| ------- | --------------------------------------------|
1862| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
1863
1864**示例:**
1865
1866```ts
1867import { RenderNode } from '@kit.ArkUI';
1868import { drawing } from '@kit.ArkGraphics2D';
1869
1870class DrawingRenderNode extends RenderNode {
1871
1872  draw(context : DrawContext) {
1873    const canvas = context.canvas;
1874    const pen = new drawing.Pen();
1875    pen.setStrokeWidth(5);
1876    pen.setColor({alpha: 255, red: 255, green: 0, blue: 0});
1877    canvas.attachPen(pen);
1878    canvas.drawRect(0, 0, 10, 10);
1879    canvas.detachPen();
1880  }
1881}
1882```
1883
1884### drawRoundRect<sup>12+</sup>
1885
1886drawRoundRect(roundRect: RoundRect): void
1887
1888画一个圆角矩形。
1889
1890**系统能力:** SystemCapability.Graphics.Drawing
1891
1892**参数**
1893
1894| 参数名     | 类型                    | 必填 | 说明       |
1895| ---------- | ----------------------- | ---- | ------------ |
1896| roundRect  | [RoundRect](#roundrect12) | 是   | 圆角矩形对象。|
1897
1898**错误码:**
1899
1900以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
1901
1902| 错误码ID | 错误信息 |
1903| ------- | --------------------------------------------|
1904| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
1905
1906**示例:**
1907
1908```ts
1909import { RenderNode } from '@kit.ArkUI';
1910import { common2D, drawing } from '@kit.ArkGraphics2D';
1911
1912class DrawingRenderNode extends RenderNode {
1913  draw(context : DrawContext) {
1914    const canvas = context.canvas;
1915    let rect: common2D.Rect = { left : 100, top : 100, right : 400, bottom : 500 };
1916    let roundRect = new drawing.RoundRect(rect, 10, 10);
1917    canvas.drawRoundRect(roundRect);
1918  }
1919}
1920```
1921
1922### drawNestedRoundRect<sup>12+</sup>
1923
1924drawNestedRoundRect(outer: RoundRect, inner: RoundRect): void
1925
1926绘制两个嵌套的圆角矩形,外部矩形边界必须包含内部矩形边界,否则无绘制效果。
1927
1928**系统能力:** SystemCapability.Graphics.Drawing
1929
1930**参数**
1931
1932| 参数名  | 类型                    | 必填 | 说明       |
1933| ------ | ----------------------- | ---- | ------------ |
1934| outer  | [RoundRect](#roundrect12) | 是   | 圆角矩形对象,表示外部圆角矩形边界。|
1935| inner  | [RoundRect](#roundrect12) | 是   | 圆角矩形对象,表示内部圆角矩形边界。|
1936
1937**错误码:**
1938
1939以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
1940
1941| 错误码ID | 错误信息 |
1942| ------- | --------------------------------------------|
1943| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
1944
1945**示例:**
1946
1947```ts
1948import { RenderNode } from '@kit.ArkUI';
1949import { common2D, drawing } from '@kit.ArkGraphics2D';
1950
1951class DrawingRenderNode extends RenderNode {
1952  draw(context : DrawContext) {
1953    const canvas = context.canvas;
1954    let inRect: common2D.Rect = { left : 200, top : 200, right : 400, bottom : 500 };
1955    let outRect: common2D.Rect = { left : 100, top : 100, right : 400, bottom : 500 };
1956    let outRoundRect = new drawing.RoundRect(outRect, 10, 10);
1957    let inRoundRect = new drawing.RoundRect(inRect, 10, 10);
1958    canvas.drawNestedRoundRect(outRoundRect, inRoundRect);
1959    canvas.drawRoundRect(outRoundRect);
1960  }
1961}
1962```
1963
1964### drawBackground<sup>12+</sup>
1965
1966drawBackground(brush: Brush): void
1967
1968使用画刷填充画布的可绘制区域。
1969
1970**系统能力:** SystemCapability.Graphics.Drawing
1971
1972**参数**
1973
1974| 参数名 | 类型            | 必填 | 说明       |
1975| ------ | --------------- | ---- | ---------- |
1976| brush  | [Brush](#brush) | 是   | 画刷对象。 |
1977
1978**错误码:**
1979
1980以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
1981
1982| 错误码ID | 错误信息 |
1983| ------- | --------------------------------------------|
1984| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
1985
1986**示例:**
1987
1988```ts
1989import { RenderNode } from '@kit.ArkUI';
1990import { common2D, drawing } from '@kit.ArkGraphics2D';
1991
1992class DrawingRenderNode extends RenderNode {
1993  draw(context : DrawContext) {
1994    const canvas = context.canvas;
1995    const brush = new drawing.Brush();
1996    const color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 };
1997    brush.setColor(color);
1998    canvas.drawBackground(brush);
1999  }
2000}
2001```
2002
2003### drawShadow<sup>12+</sup>
2004
2005drawShadow(path: Path, planeParams: common2D.Point3d, devLightPos: common2D.Point3d, lightRadius: number, ambientColor: common2D.Color, spotColor: common2D.Color, flag: ShadowFlag) : void
2006
2007绘制射灯类型阴影,使用路径描述环境光阴影的轮廓。
2008
2009**系统能力:** SystemCapability.Graphics.Drawing
2010
2011**参数:**
2012
2013| 参数名          | 类型                                       | 必填   | 说明         |
2014| ------------ | ---------------------------------------- | ---- | ---------- |
2015| path | [Path](#path)                | 是    | 路径对象,可生成阴影。 |
2016| planeParams  | [common2D.Point3d](js-apis-graphics-common2D.md#point3d12) | 是    | 表示一个三维向量,用于计算遮挡物相对于画布在z轴上的偏移量,其值取决于x与y坐标。 |
2017| devLightPos  | [common2D.Point3d](js-apis-graphics-common2D.md#point3d12) | 是    | 光线相对于画布的位置。 |
2018| lightRadius   | number           | 是    | 圆形灯半径,该参数为浮点数。      |
2019| ambientColor  | [common2D.Color](js-apis-graphics-common2D.md#color) | 是    | 环境阴影颜色。 |
2020| spotColor  | [common2D.Color](js-apis-graphics-common2D.md#color) | 是    | 点阴影颜色。 |
2021| flag         | [ShadowFlag](#shadowflag12)                  | 是    | 阴影标志枚举。    |
2022
2023**错误码:**
2024
2025以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
2026
2027| 错误码ID | 错误信息 |
2028| ------- | --------------------------------------------|
2029| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
2030
2031**示例:**
2032
2033```ts
2034import { RenderNode } from '@kit.ArkUI';
2035import { common2D, drawing } from '@kit.ArkGraphics2D';
2036
2037class DrawingRenderNode extends RenderNode {
2038  draw(context : DrawContext) {
2039    const canvas = context.canvas;
2040    const path = new drawing.Path();
2041    path.addCircle(100, 200, 100, drawing.PathDirection.CLOCKWISE);
2042    let pen = new drawing.Pen();
2043    pen.setAntiAlias(true);
2044    let pen_color : common2D.Color = { alpha: 0xFF, red: 0xFF, green: 0x00, blue: 0x00 };
2045    pen.setColor(pen_color);
2046    pen.setStrokeWidth(10.0);
2047    canvas.attachPen(pen);
2048    let brush = new drawing.Brush();
2049    let brush_color : common2D.Color = { alpha: 0xFF, red: 0x00, green: 0xFF, blue: 0x00 };
2050    brush.setColor(brush_color);
2051    canvas.attachBrush(brush);
2052    let point1 : common2D.Point3d = {x: 100, y: 80, z:80};
2053    let point2 : common2D.Point3d = {x: 200, y: 10, z:40};
2054    let color1 : common2D.Color = {alpha: 0xFF, red:0, green:0, blue:0xFF};
2055    let color2 : common2D.Color = {alpha: 0xFF, red:0xFF, green:0, blue:0};
2056    let shadowFlag : drawing.ShadowFlag = drawing.ShadowFlag.ALL;
2057    canvas.drawShadow(path, point1, point2, 30, color1, color2, shadowFlag);
2058  }
2059}
2060```
2061
2062### drawShadow<sup>18+</sup>
2063
2064drawShadow(path: Path, planeParams: common2D.Point3d, devLightPos: common2D.Point3d, lightRadius: number, ambientColor: common2D.Color | number, spotColor: common2D.Color | number, flag: ShadowFlag) : void
2065
2066绘制射灯类型阴影,使用路径描述环境光阴影的轮廓。
2067
2068**系统能力:** SystemCapability.Graphics.Drawing
2069
2070**参数:**
2071
2072| 参数名          | 类型                                       | 必填   | 说明         |
2073| ------------ | ---------------------------------------- | ---- | ---------- |
2074| path | [Path](#path)                | 是    | 路径对象,可生成阴影。 |
2075| planeParams  | [common2D.Point3d](js-apis-graphics-common2D.md#point3d12) | 是    | 表示一个三维向量,用于计算z轴方向的偏移量。 |
2076| devLightPos  | [common2D.Point3d](js-apis-graphics-common2D.md#point3d12) | 是    | 光线相对于画布的位置。 |
2077| lightRadius   | number           | 是    | 圆形灯半径,该参数为浮点数。      |
2078| ambientColor  |[common2D.Color](js-apis-graphics-common2D.md#color) \| number | 是    | 环境阴影颜色,可以用16进制ARGB格式的32位无符号整数表示。 |
2079| spotColor  |[common2D.Color](js-apis-graphics-common2D.md#color) \| number | 是    | 点阴影颜色,可以用16进制ARGB格式的32位无符号整数表示。 |
2080| flag         | [ShadowFlag](#shadowflag12)                  | 是    | 阴影标志枚举。    |
2081
2082**错误码:**
2083
2084以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
2085
2086| 错误码ID | 错误信息 |
2087| ------- | --------------------------------------------|
2088| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
2089
2090**示例:**
2091
2092```ts
2093import { RenderNode } from '@kit.ArkUI';
2094import { common2D, drawing } from '@kit.ArkGraphics2D';
2095
2096class DrawingRenderNode extends RenderNode {
2097  draw(context : DrawContext) {
2098    const canvas = context.canvas;
2099    const path = new drawing.Path();
2100    path.addCircle(300, 600, 100, drawing.PathDirection.CLOCKWISE);
2101    let point1 : common2D.Point3d = {x: 100, y: 80, z:80};
2102    let point2 : common2D.Point3d = {x: 200, y: 10, z:40};
2103    let shadowFlag : drawing.ShadowFlag = drawing.ShadowFlag.ALL;
2104    canvas.drawShadow(path, point1, point2, 30, 0xFF0000FF, 0xFFFF0000, shadowFlag);
2105  }
2106}
2107```
2108
2109### getLocalClipBounds<sup>12+</sup>
2110
2111getLocalClipBounds(): common2D.Rect
2112
2113获取画布裁剪区域的边界。
2114
2115**系统能力:** SystemCapability.Graphics.Drawing
2116
2117**返回值:**
2118
2119| 类型                                       | 说明       |
2120| ---------------------------------------- | -------- |
2121| [common2D.Rect](js-apis-graphics-common2D.md#rect) | 返回画布裁剪区域的矩形边界。 |
2122
2123**示例:**
2124
2125```ts
2126import { RenderNode } from '@kit.ArkUI';
2127import { common2D, drawing } from '@kit.ArkGraphics2D';
2128
2129class DrawingRenderNode extends RenderNode {
2130  draw(context : DrawContext) {
2131    const canvas = context.canvas;
2132    let clipRect: common2D.Rect = {
2133      left : 150, top : 150, right : 300, bottom : 400
2134    };
2135    canvas.clipRect(clipRect,drawing.ClipOp.DIFFERENCE, true);
2136    console.info("test rect.left: " + clipRect.left);
2137    console.info("test rect.top: " + clipRect.top);
2138    console.info("test rect.right: " + clipRect.right);
2139    console.info("test rect.bottom: " + clipRect.bottom);
2140    canvas.getLocalClipBounds();
2141  }
2142}
2143```
2144
2145### getTotalMatrix<sup>12+</sup>
2146
2147getTotalMatrix(): Matrix
2148
2149获取画布矩阵。
2150
2151**系统能力:** SystemCapability.Graphics.Drawing
2152
2153**返回值:**
2154
2155| 类型                | 说明       |
2156| ----------------- | -------- |
2157| [Matrix](#matrix12) |返回画布矩阵。 |
2158
2159**示例:**
2160
2161```ts
2162import { RenderNode } from '@kit.ArkUI';
2163import { drawing } from '@kit.ArkGraphics2D';
2164
2165class DrawingRenderNode extends RenderNode {
2166  draw(context : DrawContext) {
2167    const canvas = context.canvas;
2168    let matrix = new drawing.Matrix();
2169    matrix.setMatrix([5, 0, 0, 0, 1, 1, 0, 0, 1]);
2170    canvas.setMatrix(matrix);
2171    let matrixResult =canvas.getTotalMatrix();
2172  }
2173}
2174```
2175
2176### drawCircle
2177
2178drawCircle(x: number, y: number, radius: number): void
2179
2180绘制一个圆形。如果半径小于等于零,则不绘制。默认使用黑色填充。
2181
2182**系统能力:** SystemCapability.Graphics.Drawing
2183
2184**参数:**
2185
2186| 参数名 | 类型   | 必填 | 说明                |
2187| ------ | ------ | ---- | ------------------- |
2188| x      | number | 是   | 圆心的x坐标,该参数为浮点数。 |
2189| y      | number | 是   | 圆心的y坐标,该参数为浮点数。 |
2190| radius | number | 是   | 圆的半径,大于0的浮点数。 |
2191
2192**错误码:**
2193
2194以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
2195
2196| 错误码ID | 错误信息 |
2197| ------- | --------------------------------------------|
2198| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
2199
2200**示例:**
2201
2202```ts
2203import { RenderNode } from '@kit.ArkUI';
2204import { drawing } from '@kit.ArkGraphics2D';
2205
2206class DrawingRenderNode extends RenderNode {
2207  draw(context : DrawContext) {
2208    const canvas = context.canvas;
2209    const pen = new drawing.Pen();
2210    pen.setStrokeWidth(5);
2211    pen.setColor({alpha: 255, red: 255, green: 0, blue: 0});
2212    canvas.attachPen(pen);
2213    canvas.drawCircle(10, 10, 2);
2214    canvas.detachPen();
2215  }
2216}
2217```
2218
2219### drawImage
2220
2221drawImage(pixelmap: image.PixelMap, left: number, top: number, samplingOptions?: SamplingOptions): void
2222
2223画一张图片,图片的左上角坐标为(left, top)。
2224
2225**系统能力:** SystemCapability.Graphics.Drawing
2226
2227**参数:**
2228
2229| 参数名   | 类型                                         | 必填 | 说明                            |
2230| -------- | -------------------------------------------- | ---- | ------------------------------- |
2231| pixelmap | [image.PixelMap](../apis-image-kit/arkts-apis-image-PixelMap.md) | 是   | 图片的PixelMap。                  |
2232| left     | number                                       | 是   | 图片位置的左上角x轴坐标,该参数为浮点数。 |
2233| top      | number                                       | 是   | 图片位置的左上角y轴坐标,该参数为浮点数。 |
2234| samplingOptions<sup>12+</sup>  | [SamplingOptions](#samplingoptions12)  | 否  | 采样选项对象,默认为不使用任何参数构造的原始采样选项对象。 |
2235
2236**错误码:**
2237
2238以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
2239
2240| 错误码ID | 错误信息 |
2241| ------- | --------------------------------------------|
2242| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
2243
2244**示例:**
2245
2246```ts
2247import { RenderNode } from '@kit.ArkUI';
2248import { image } from '@kit.ImageKit';
2249import { drawing } from '@kit.ArkGraphics2D';
2250
2251class DrawingRenderNode extends RenderNode {
2252  pixelMap: image.PixelMap | null = null;
2253
2254  async draw(context : DrawContext) {
2255    const canvas = context.canvas;
2256    let options = new drawing.SamplingOptions(drawing.FilterMode.FILTER_MODE_NEAREST);
2257    if (this.pixelMap != null) {
2258      canvas.drawImage(this.pixelMap, 0, 0, options);
2259    }
2260  }
2261}
2262```
2263
2264### drawImageRect<sup>12+</sup>
2265
2266drawImageRect(pixelmap: image.PixelMap, dstRect: common2D.Rect, samplingOptions?: SamplingOptions): void
2267
2268将图片绘制到画布的指定区域上。
2269
2270**系统能力:** SystemCapability.Graphics.Drawing
2271
2272**参数:**
2273
2274| 参数名   | 类型                                         | 必填 | 说明                            |
2275| -------- | -------------------------------------------- | ---- | ------------------------------- |
2276| pixelmap | [image.PixelMap](../apis-image-kit/arkts-apis-image-PixelMap.md) | 是   | 图片的PixelMap。                 |
2277| dstRect     | [common2D.Rect](js-apis-graphics-common2D.md#rect)                               | 是   | 矩形对象,用于指定画布上图片的绘制区域。 |
2278| samplingOptions     | [SamplingOptions](#samplingoptions12)                           | 否   | 采样选项对象,默认为不使用任何参数构造的原始采样选项对象。 |
2279
2280**错误码:**
2281
2282以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
2283
2284| 错误码ID | 错误信息 |
2285| ------- | --------------------------------------------|
2286| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
2287
2288**示例:**
2289
2290```ts
2291import { RenderNode } from '@kit.ArkUI';
2292import { image } from '@kit.ImageKit';
2293import { common2D, drawing } from '@kit.ArkGraphics2D';
2294
2295class DrawingRenderNode extends RenderNode {
2296pixelMap: image.PixelMap | null = null;
2297  draw(context : DrawContext) {
2298    const canvas = context.canvas;
2299    let pen = new drawing.Pen();
2300    canvas.attachPen(pen);
2301    let rect: common2D.Rect = { left: 0, top: 0, right: 200, bottom: 200 };
2302    canvas.drawImageRect(this.pixelMap, rect);
2303    canvas.detachPen();
2304  }
2305}
2306```
2307
2308### drawImageRectWithSrc<sup>12+</sup>
2309
2310drawImageRectWithSrc(pixelmap: image.PixelMap, srcRect: common2D.Rect, dstRect: common2D.Rect, samplingOptions?: SamplingOptions, constraint?: SrcRectConstraint): void
2311
2312将图片的指定区域绘制到画布的指定区域。
2313
2314**系统能力:** SystemCapability.Graphics.Drawing
2315
2316**参数:**
2317
2318| 参数名   | 类型                                         | 必填 | 说明                            |
2319| -------- | -------------------------------------------- | ---- | ------------------------------- |
2320| pixelmap | [image.PixelMap](../apis-image-kit/arkts-apis-image-PixelMap.md) | 是   | 图片的PixelMap。                 |
2321| srcRect     | [common2D.Rect](js-apis-graphics-common2D.md#rect)                               | 是   | 矩形对象,用于指定图片的待绘制区域。 |
2322| dstRect     | [common2D.Rect](js-apis-graphics-common2D.md#rect)                               | 是   | 矩形对象,用于指定画布上图片的绘制区域。 |
2323| samplingOptions     | [SamplingOptions](#samplingoptions12)                           | 否   | 采样选项对象,默认为不使用任何参数构造的原始采样选项对象。 |
2324| constraint     | [SrcRectConstraint](#srcrectconstraint12)                        | 否   | 源矩形区域约束类型,默认为STRICT。 |
2325
2326**错误码:**
2327
2328以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
2329
2330| 错误码ID | 错误信息 |
2331| ------- | --------------------------------------------|
2332| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
2333
2334**示例:**
2335
2336```ts
2337import { RenderNode } from '@kit.ArkUI';
2338import { image } from '@kit.ImageKit';
2339import { common2D, drawing } from '@kit.ArkGraphics2D';
2340
2341class DrawingRenderNode extends RenderNode {
2342pixelMap: image.PixelMap | null = null;
2343  draw(context : DrawContext) {
2344    const canvas = context.canvas;
2345    let pen = new drawing.Pen();
2346    canvas.attachPen(pen);
2347    let srcRect: common2D.Rect = { left: 0, top: 0, right: 100, bottom: 100 };
2348    let dstRect: common2D.Rect = { left: 100, top: 100, right: 200, bottom: 200 };
2349    canvas.drawImageRectWithSrc(this.pixelMap, srcRect, dstRect);
2350    canvas.detachPen();
2351  }
2352}
2353```
2354
2355### drawColor
2356
2357drawColor(color: common2D.Color, blendMode?: BlendMode): void
2358
2359使用指定颜色并按照指定的[BlendMode](#blendmode)对画布当前可绘制区域进行填充。
2360
2361**系统能力:** SystemCapability.Graphics.Drawing
2362
2363**参数:**
2364
2365| 参数名    | 类型                                                 | 必填 | 说明                             |
2366| --------- | ---------------------------------------------------- | ---- | -------------------------------- |
2367| color     | [common2D.Color](js-apis-graphics-common2D.md#color) | 是   | ARGB格式的颜色,每个颜色通道的值是0到255之间的整数。                   |
2368| blendMode | [BlendMode](#blendmode)                              | 否   | 颜色混合模式,默认模式为SRC_OVER。 |
2369
2370**错误码:**
2371
2372以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
2373
2374| 错误码ID | 错误信息 |
2375| ------- | --------------------------------------------|
2376| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
2377
2378**示例:**
2379
2380```ts
2381import { RenderNode } from '@kit.ArkUI';
2382import { common2D, drawing } from '@kit.ArkGraphics2D';
2383
2384class DrawingRenderNode extends RenderNode {
2385  draw(context : DrawContext) {
2386    const canvas = context.canvas;
2387    let color: common2D.Color = {
2388      alpha : 255,
2389      red: 0,
2390      green: 10,
2391      blue: 10
2392    }
2393    canvas.drawColor(color, drawing.BlendMode.CLEAR);
2394  }
2395}
2396```
2397
2398### drawColor<sup>12+</sup>
2399
2400drawColor(alpha: number, red: number, green: number, blue: number, blendMode?: BlendMode): void
2401
2402使用指定颜色并按照指定的[BlendMode](#blendmode)对画布当前可绘制区域进行填充。性能优于[drawColor](#drawcolor)接口,推荐使用本接口。
2403
2404**系统能力:** SystemCapability.Graphics.Drawing
2405
2406**参数:**
2407
2408| 参数名     | 类型                    | 必填 | 说明                                               |
2409| --------- | ----------------------- | ---- | ------------------------------------------------- |
2410| alpha     | number                  | 是   | ARGB格式颜色的透明度通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。 |
2411| red       | number                  | 是   | ARGB格式颜色的红色通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。   |
2412| green     | number                  | 是   | ARGB格式颜色的绿色通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。   |
2413| blue      | number                  | 是   | ARGB格式颜色的蓝色通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。   |
2414| blendMode | [BlendMode](#blendmode) | 否   | 颜色混合模式,默认模式为SRC_OVER。                   |
2415
2416**错误码:**
2417
2418以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
2419
2420| 错误码ID | 错误信息 |
2421| ------- | --------------------------------------------|
2422| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
2423
2424**示例:**
2425
2426```ts
2427import { RenderNode } from '@kit.ArkUI';
2428import { drawing } from '@kit.ArkGraphics2D';
2429
2430class DrawingRenderNode extends RenderNode {
2431  draw(context : DrawContext) {
2432    const canvas = context.canvas;
2433    canvas.drawColor(255, 0, 10, 10, drawing.BlendMode.CLEAR);
2434  }
2435}
2436```
2437
2438### drawColor<sup>18+</sup>
2439
2440drawColor(color: number, blendMode?: BlendMode): void
2441
2442使用指定颜色并按照指定的[BlendMode](#blendmode)对画布当前可绘制区域进行填充。
2443
2444**系统能力:** SystemCapability.Graphics.Drawing
2445
2446**参数:**
2447
2448| 参数名    | 类型                                                 | 必填 | 说明                             |
2449| --------- | ---------------------------------------------------- | ---- | -------------------------------- |
2450| color     | number | 是   | 16进制ARGB格式的颜色。                   |
2451| blendMode | [BlendMode](#blendmode)                              | 否   | 颜色混合模式,默认模式为SRC_OVER。 |
2452
2453**错误码:**
2454
2455以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
2456
2457| 错误码ID | 错误信息 |
2458| ------- | --------------------------------------------|
2459| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
2460
2461**示例:**
2462
2463```ts
2464import { RenderNode } from '@kit.ArkUI';
2465import { drawing } from '@kit.ArkGraphics2D';
2466
2467class DrawingRenderNode extends RenderNode {
2468  draw(context : DrawContext) {
2469    const canvas = context.canvas;
2470    canvas.drawColor(0xff000a0a, drawing.BlendMode.CLEAR);
2471  }
2472}
2473```
2474
2475### drawPixelMapMesh<sup>12+</sup>
2476
2477drawPixelMapMesh(pixelmap: image.PixelMap, meshWidth: number, meshHeight: number, vertices: Array\<number>, vertOffset: number, colors: Array\<number>, colorOffset: number): void
2478
2479在网格上绘制像素图,网格均匀分布在像素图上。
2480
2481**系统能力:** SystemCapability.Graphics.Drawing
2482
2483**参数:**
2484
2485| 参数名      | 类型            | 必填 | 说明                            |
2486| ----------- | -------------  | ---- | ------------------------------- |
2487| pixelmap    | [image.PixelMap](../apis-image-kit/arkts-apis-image-PixelMap.md) | 是   | 用于绘制网格的像素图。 |
2488| meshWidth   | number         | 是   | 网格中的列数,大于0的整数。 |
2489| meshHeight  | number         | 是   | 网格中的行数,大于0的整数。 |
2490| vertices    | Array\<number> | 是   | 顶点数组,指定网格的绘制位置,浮点数组,大小必须为((meshWidth+1) * (meshHeight+1) + vertOffset) * 2。 |
2491| vertOffset  | number         | 是   | 绘图前要跳过的vert元素数,大于等于0的整数。 |
2492| colors      | Array\<number> | 是   | 颜色数组,在每个顶点指定一种颜色,整数数组,可为null,大小必须为(meshWidth+1) * (meshHeight+1) + colorOffset。 |
2493| colorOffset | number         | 是   | 绘制前要跳过的颜色元素数,大于等于0的整数。 |
2494
2495**错误码:**
2496
2497以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
2498
2499| 错误码ID | 错误信息 |
2500| ------- | --------------------------------------------|
2501| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
2502
2503**示例:**
2504
2505```ts
2506import { RenderNode } from '@kit.ArkUI';
2507import { image } from '@kit.ImageKit';
2508import { drawing } from '@kit.ArkGraphics2D';
2509
2510class DrawingRenderNode extends RenderNode {
2511  pixelMap: image.PixelMap | null = null;
2512
2513  async draw(context : DrawContext) {
2514    const canvas = context.canvas;
2515    if (this.pixelMap != null) {
2516      const brush = new drawing.Brush(); // 只支持brush,使用pen没有绘制效果。
2517      canvas.attachBrush(brush);
2518      let verts : Array<number> = [0, 0, 50, 0, 410, 0, 0, 180, 50, 180, 410, 180, 0, 360, 50, 360, 410, 360]; // 18
2519      canvas.drawPixelMapMesh(this.pixelMap, 2, 2, verts, 0, null, 0);
2520      canvas.detachBrush();
2521    }
2522  }
2523}
2524```
2525
2526### clear<sup>12+</sup>
2527
2528clear(color: common2D.Color): void
2529
2530使用指定颜色填充画布上的裁剪区域。效果等同于[drawColor](#drawcolor)。
2531
2532**系统能力:** SystemCapability.Graphics.Drawing
2533
2534**参数:**
2535
2536| 参数名    | 类型                                                 | 必填 | 说明                             |
2537| --------- | ---------------------------------------------------- | ---- | -------------------------------- |
2538| color     | [common2D.Color](js-apis-graphics-common2D.md#color) | 是   | ARGB格式的颜色,每个颜色通道的值是0到255之间的整数。      |
2539
2540**错误码:**
2541
2542以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
2543
2544| 错误码ID | 错误信息 |
2545| ------- | --------------------------------------------|
2546| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
2547
2548**示例:**
2549
2550```ts
2551import { RenderNode } from '@kit.ArkUI';
2552import { common2D, drawing } from '@kit.ArkGraphics2D';
2553
2554class DrawingRenderNode extends RenderNode {
2555  draw(context : DrawContext) {
2556    const canvas = context.canvas;
2557    let color: common2D.Color = {alpha: 255, red: 255, green: 0, blue: 0};
2558    canvas.clear(color);
2559  }
2560}
2561```
2562
2563### clear<sup>18+</sup>
2564
2565clear(color: common2D.Color | number): void
2566
2567使用指定颜色填充画布上的裁剪区域。
2568
2569**系统能力:** SystemCapability.Graphics.Drawing
2570
2571**参数:**
2572
2573| 参数名    | 类型                                                 | 必填 | 说明                             |
2574| --------- | ---------------------------------------------------- | ---- | -------------------------------- |
2575| color     | [common2D.Color](js-apis-graphics-common2D.md#color) \| number| 是   | 颜色,可以用16进制ARGB格式的无符号整数表示。  |
2576
2577**示例:**
2578
2579```ts
2580import { RenderNode } from '@kit.ArkUI';
2581import { drawing } from '@kit.ArkGraphics2D';
2582
2583class DrawingRenderNode extends RenderNode {
2584  draw(context : DrawContext) {
2585    const canvas = context.canvas;
2586    let color: number = 0xffff0000;
2587    canvas.clear(color);
2588  }
2589}
2590```
2591
2592### getWidth<sup>12+</sup>
2593
2594getWidth(): number
2595
2596获取画布的宽度。
2597
2598**系统能力:** SystemCapability.Graphics.Drawing
2599
2600**返回值:**
2601
2602| 类型   | 必填 | 说明           |
2603| ------ | ---- | -------------- |
2604| number | 是   | 返回画布的宽度,该参数为浮点数。 |
2605
2606**示例:**
2607
2608```ts
2609import { RenderNode } from '@kit.ArkUI';
2610import { drawing } from '@kit.ArkGraphics2D';
2611
2612class DrawingRenderNode extends RenderNode {
2613  draw(context : DrawContext) {
2614    const canvas = context.canvas;
2615    let width = canvas.getWidth();
2616    console.info('get canvas width:' + width);
2617  }
2618}
2619```
2620
2621### getHeight<sup>12+</sup>
2622
2623getHeight(): number
2624
2625获取画布的高度。
2626
2627**系统能力:** SystemCapability.Graphics.Drawing
2628
2629**返回值:**
2630
2631| 类型   | 必填 | 说明           |
2632| ------ | ---- | -------------- |
2633| number | 是   | 返回画布的高度,该参数为浮点数。 |
2634
2635**示例:**
2636
2637```ts
2638import { RenderNode } from '@kit.ArkUI';
2639import { drawing } from '@kit.ArkGraphics2D';
2640
2641class DrawingRenderNode extends RenderNode {
2642  draw(context : DrawContext) {
2643    const canvas = context.canvas;
2644    let height = canvas.getHeight();
2645    console.log('get canvas height:' + height);
2646  }
2647}
2648```
2649
2650### drawOval<sup>12+</sup>
2651
2652drawOval(oval: common2D.Rect): void
2653
2654在画布上绘制一个椭圆,椭圆的形状和位置由椭圆的外切矩形给出。
2655
2656**系统能力:** SystemCapability.Graphics.Drawing
2657
2658**参数**
2659
2660| 参数名 | 类型                                               | 必填 | 说明           |
2661| ------ | -------------------------------------------------- | ---- | -------------- |
2662| oval   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 矩形区域,该矩形的内切椭圆即为待绘制椭圆。 |
2663
2664**错误码:**
2665
2666以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
2667
2668| 错误码ID | 错误信息 |
2669| ------- | --------------------------------------------|
2670| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
2671
2672**示例:**
2673
2674```ts
2675import { RenderNode } from '@kit.ArkUI';
2676import { common2D, drawing } from '@kit.ArkGraphics2D';
2677
2678class DrawingRenderNode extends RenderNode {
2679  draw(context : DrawContext) {
2680    const canvas = context.canvas;
2681    const pen = new drawing.Pen();
2682    pen.setStrokeWidth(5);
2683    const color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 };
2684    pen.setColor(color);
2685    canvas.attachPen(pen);
2686    const rect: common2D.Rect = {left:100, top:50, right:400, bottom:500};
2687    canvas.drawOval(rect);
2688    canvas.detachPen();
2689  }
2690}
2691```
2692
2693### drawArc<sup>12+</sup>
2694
2695drawArc(arc: common2D.Rect, startAngle: number, sweepAngle: number): void
2696
2697在画布上绘制圆弧。该方法允许指定起始角度、扫描角度。当扫描角度的绝对值大于360度时,则绘制椭圆。
2698
2699**系统能力:** SystemCapability.Graphics.Drawing
2700
2701**参数**
2702
2703| 参数名 | 类型                                               | 必填 | 说明           |
2704| ------ | -------------------------------------------------- | ---- | -------------- |
2705| arc   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 包含要绘制的圆弧的椭圆的矩形边界。 |
2706| startAngle      | number | 是   | 弧的起始角度,单位为度,该参数为浮点数。0度时起始点位于椭圆的右端点,正数时以顺时针方向放置起始点,负数时以逆时针方向放置起始点。 |
2707| sweepAngle      | number | 是   | 弧的扫描角度,单位为度,该参数为浮点数。为正数时顺时针扫描,为负数时逆时针扫描。它的有效范围在-360度到360度之间,当绝对值大于360度时,该方法绘制的是一个椭圆。 |
2708
2709**错误码:**
2710
2711以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
2712
2713| 错误码ID | 错误信息 |
2714| ------- | --------------------------------------------|
2715| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
2716
2717**示例:**
2718
2719```ts
2720import { RenderNode } from '@kit.ArkUI';
2721import { common2D, drawing } from '@kit.ArkGraphics2D';
2722
2723class DrawingRenderNode extends RenderNode {
2724  draw(context : DrawContext) {
2725    const canvas = context.canvas;
2726    const pen = new drawing.Pen();
2727    pen.setStrokeWidth(5);
2728    const color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 };
2729    pen.setColor(color);
2730    canvas.attachPen(pen);
2731    const rect: common2D.Rect = {left:100, top:50, right:400, bottom:200};
2732    canvas.drawArc(rect, 90, 180);
2733    canvas.detachPen();
2734  }
2735}
2736```
2737
2738### drawPoint
2739
2740drawPoint(x: number, y: number): void
2741
2742绘制一个点。
2743
2744**系统能力:** SystemCapability.Graphics.Drawing
2745
2746**参数:**
2747
2748| 参数名 | 类型   | 必填 | 说明                |
2749| ------ | ------ | ---- | ------------------- |
2750| x      | number | 是   | 点的x轴坐标,该参数为浮点数。 |
2751| y      | number | 是   | 点的y轴坐标,该参数为浮点数。 |
2752
2753**错误码:**
2754
2755以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
2756
2757| 错误码ID | 错误信息 |
2758| ------- | --------------------------------------------|
2759| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
2760
2761**示例:**
2762
2763```ts
2764import { RenderNode } from '@kit.ArkUI';
2765import { drawing } from '@kit.ArkGraphics2D';
2766
2767class DrawingRenderNode extends RenderNode {
2768  draw(context : DrawContext) {
2769    const canvas = context.canvas;
2770    const pen = new drawing.Pen();
2771    pen.setStrokeWidth(5);
2772    pen.setColor({alpha: 255, red: 255, green: 0, blue: 0});
2773    canvas.attachPen(pen);
2774    canvas.drawPoint(10, 10);
2775    canvas.detachPen();
2776  }
2777}
2778```
2779
2780### drawPoints<sup>12+</sup>
2781
2782drawPoints(points: Array\<common2D.Point>, mode?: PointMode): void
2783
2784在画布上绘制一组点、线段或多边形。通过指定点的数组和绘制模式来决定绘制方式。
2785
2786**系统能力:** SystemCapability.Graphics.Drawing
2787
2788**参数:**
2789
2790| 参数名  | 类型                                       | 必填   | 说明        |
2791| ---- | ---------------------------------------- | ---- | --------- |
2792| points  | Array\<[common2D.Point](js-apis-graphics-common2D.md#point12)> | 是    | 要绘制的点的数组。长度不能为0。   |
2793| mode | [PointMode](#pointmode12)                  | 否    | 绘制数组中的点的方式,默认为drawing.PointMode.POINTS。 |
2794
2795**错误码:**
2796
2797以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
2798
2799| 错误码ID | 错误信息 |
2800| ------- | --------------------------------------------|
2801| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types; 3. Parameter verification failed.|
2802
2803**示例:**
2804
2805```ts
2806import { RenderNode } from '@kit.ArkUI';
2807import { common2D, drawing } from '@kit.ArkGraphics2D';
2808
2809class DrawingRenderNode extends RenderNode {
2810  draw(context : DrawContext) {
2811    const canvas = context.canvas;
2812    const pen = new drawing.Pen();
2813    pen.setStrokeWidth(30);
2814    const color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 };
2815    pen.setColor(color);
2816    canvas.attachPen(pen);
2817    canvas.drawPoints([{x: 100, y: 200}, {x: 150, y: 230}, {x: 200, y: 300}], drawing.PointMode.POINTS);
2818    canvas.detachPen();
2819  }
2820}
2821```
2822
2823### drawPath
2824
2825drawPath(path: Path): void
2826
2827绘制一个自定义路径,该路径包含了一组路径轮廓,每个路径轮廓可以是开放的或封闭的。
2828
2829**系统能力:** SystemCapability.Graphics.Drawing
2830
2831**参数:**
2832
2833| 参数名 | 类型          | 必填 | 说明               |
2834| ------ | ------------- | ---- | ------------------ |
2835| path   | [Path](#path) | 是   | 要绘制的路径对象。 |
2836
2837**错误码:**
2838
2839以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
2840
2841| 错误码ID | 错误信息 |
2842| ------- | --------------------------------------------|
2843| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
2844
2845**示例:**
2846
2847```ts
2848import { RenderNode } from '@kit.ArkUI';
2849import { drawing } from '@kit.ArkGraphics2D';
2850
2851class DrawingRenderNode extends RenderNode {
2852  draw(context : DrawContext) {
2853    const canvas = context.canvas;
2854    const pen = new drawing.Pen();
2855    pen.setStrokeWidth(5);
2856    pen.setColor({alpha: 255, red: 255, green: 0, blue: 0});
2857    let path = new drawing.Path();
2858    path.moveTo(10,10);
2859    path.cubicTo(10, 10, 10, 10, 15, 15);
2860    path.close();
2861    canvas.attachPen(pen);
2862    canvas.drawPath(path);
2863    canvas.detachPen();
2864  }
2865}
2866```
2867
2868### drawLine
2869
2870drawLine(x0: number, y0: number, x1: number, y1: number): void
2871
2872画一条直线段,从指定的起点到终点。如果直线段的起点和终点是同一个点,无法绘制。
2873
2874**系统能力:** SystemCapability.Graphics.Drawing
2875
2876**参数:**
2877
2878| 参数名 | 类型   | 必填 | 说明                    |
2879| ------ | ------ | ---- | ----------------------- |
2880| x0     | number | 是   | 线段起点的X坐标,该参数为浮点数。 |
2881| y0     | number | 是   | 线段起点的Y坐标,该参数为浮点数。 |
2882| x1     | number | 是   | 线段终点的X坐标,该参数为浮点数。 |
2883| y1     | number | 是   | 线段终点的Y坐标,该参数为浮点数。 |
2884
2885**错误码:**
2886
2887以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
2888
2889| 错误码ID | 错误信息 |
2890| ------- | --------------------------------------------|
2891| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
2892
2893**示例:**
2894
2895```ts
2896import { RenderNode } from '@kit.ArkUI';
2897import { drawing } from '@kit.ArkGraphics2D';
2898
2899class DrawingRenderNode extends RenderNode {
2900  draw(context : DrawContext) {
2901    const canvas = context.canvas;
2902    const pen = new drawing.Pen();
2903    pen.setStrokeWidth(5);
2904    pen.setColor({alpha: 255, red: 255, green: 0, blue: 0});
2905    canvas.attachPen(pen);
2906    canvas.drawLine(0, 0, 20, 20);
2907    canvas.detachPen();
2908  }
2909}
2910```
2911
2912### drawTextBlob
2913
2914drawTextBlob(blob: TextBlob, x: number, y: number): void
2915
2916绘制一段文字。若构造blob的字体不支持待绘制字符,则该部分字符无法绘制。
2917
2918**系统能力:** SystemCapability.Graphics.Drawing
2919
2920**参数:**
2921
2922| 参数名 | 类型                  | 必填 | 说明                                       |
2923| ------ | --------------------- | ---- | ------------------------------------------ |
2924| blob   | [TextBlob](#textblob) | 是   | TextBlob对象。                             |
2925| x      | number                | 是   | 所绘制出的文字基线(下图蓝线)的左端点(下图红点)的横坐标,该参数为浮点数。 |
2926| y      | number                | 是   | 所绘制出的文字基线(下图蓝线)的左端点(下图红点)的纵坐标,该参数为浮点数。 |
2927
2928![zh-ch_image_Text_Blob.png](figures/zh-ch_image_Text_Blob.png)
2929
2930**错误码:**
2931
2932以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
2933
2934| 错误码ID | 错误信息 |
2935| ------- | --------------------------------------------|
2936| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
2937
2938**示例:**
2939
2940```ts
2941import { RenderNode } from '@kit.ArkUI';
2942import { drawing } from '@kit.ArkGraphics2D';
2943
2944class DrawingRenderNode extends RenderNode {
2945  draw(context : DrawContext) {
2946    const canvas = context.canvas;
2947    const brush = new drawing.Brush();
2948    brush.setColor({alpha: 255, red: 255, green: 0, blue: 0});
2949    const font = new drawing.Font();
2950    font.setSize(20);
2951    const textBlob = drawing.TextBlob.makeFromString("Hello, drawing", font, drawing.TextEncoding.TEXT_ENCODING_UTF8);
2952    canvas.attachBrush(brush);
2953    canvas.drawTextBlob(textBlob, 20, 20);
2954    canvas.detachBrush();
2955  }
2956}
2957```
2958
2959### drawSingleCharacter<sup>12+</sup>
2960
2961drawSingleCharacter(text: string, font: Font, x: number, y: number): void
2962
2963绘制单个字符。当前字型中的字体不支持待绘制字符时,退化到使用系统字体绘制字符。
2964
2965**系统能力:** SystemCapability.Graphics.Drawing
2966
2967**参数**
2968
2969| 参数名 | 类型                | 必填 | 说明        |
2970| ------ | ------------------- | ---- | ----------- |
2971| text   | string | 是   | 待绘制的单个字符,字符串的长度必须为1。  |
2972| font   | [Font](#font) | 是   | 字型对象。  |
2973| x      | number | 是   | 所绘制出的字符基线(下图蓝线)的左端点(下图红点)的横坐标,该参数为浮点数。 |
2974| y      | number | 是   | 所绘制出的字符基线(下图蓝线)的左端点(下图红点)的纵坐标,该参数为浮点数。 |
2975
2976![zh-ch_image_Text_Blob.png](figures/zh-ch_image_Text_Blob.png)
2977
2978**错误码:**
2979
2980以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
2981
2982| 错误码ID | 错误信息 |
2983| ------- | --------------------------------------------|
2984| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
2985
2986**示例:**
2987
2988```ts
2989import { RenderNode } from '@kit.ArkUI';
2990import { drawing } from '@kit.ArkGraphics2D';
2991
2992class DrawingRenderNode extends RenderNode {
2993  draw(context : DrawContext) {
2994    const canvas = context.canvas;
2995    const brush = new drawing.Brush();
2996    brush.setColor({alpha: 255, red: 255, green: 0, blue: 0});
2997    const font = new drawing.Font();
2998    font.setSize(20);
2999    canvas.attachBrush(brush);
3000    canvas.drawSingleCharacter("你", font, 100, 100);
3001    canvas.drawSingleCharacter("好", font, 120, 100);
3002    canvas.detachBrush();
3003  }
3004}
3005```
3006
3007### drawRegion<sup>12+</sup>
3008
3009drawRegion(region: Region): void
3010
3011绘制一个区域。
3012
3013**系统能力:** SystemCapability.Graphics.Drawing
3014
3015**参数**
3016
3017| 参数名 | 类型                | 必填 | 说明        |
3018| ------ | ------------------- | ---- | ----------- |
3019| region   | [Region](#region12) | 是   | 绘制的区域。  |
3020
3021**错误码:**
3022
3023以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
3024
3025| 错误码ID | 错误信息 |
3026| ------- | --------------------------------------------|
3027| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
3028
3029**示例:**
3030
3031```ts
3032import { RenderNode } from '@kit.ArkUI';
3033import { drawing } from '@kit.ArkGraphics2D';
3034
3035class DrawingRenderNode extends RenderNode {
3036  draw(context : DrawContext) {
3037    const canvas = context.canvas;
3038    const pen = new drawing.Pen();
3039    let region = new drawing.Region();
3040    pen.setStrokeWidth(10);
3041    pen.setColor({ alpha: 255, red: 255, green: 0, blue: 0 });
3042    canvas.attachPen(pen);
3043    region.setRect(100, 100, 400, 400);
3044    canvas.drawRegion(region);
3045    canvas.detachPen();
3046  }
3047}
3048```
3049
3050### attachPen
3051
3052attachPen(pen: Pen): void
3053
3054绑定画笔到画布上,在画布上进行绘制时,将使用画笔的样式去绘制图形形状的轮廓。
3055
3056> **说明:**
3057>
3058> 执行该方法后,若pen的效果发生改变并且开发者希望该变化生效于接下来的绘制动作,需要再次执行该方法以确保变化生效。
3059
3060**系统能力:** SystemCapability.Graphics.Drawing
3061
3062**参数:**
3063
3064| 参数名 | 类型        | 必填 | 说明       |
3065| ------ | ----------- | ---- | ---------- |
3066| pen    | [Pen](#pen) | 是   | 画笔对象。 |
3067
3068**错误码:**
3069
3070以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
3071
3072| 错误码ID | 错误信息 |
3073| ------- | --------------------------------------------|
3074| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
3075
3076**示例:**
3077
3078```ts
3079import { RenderNode } from '@kit.ArkUI';
3080import { drawing } from '@kit.ArkGraphics2D';
3081
3082class DrawingRenderNode extends RenderNode {
3083  draw(context : DrawContext) {
3084    const canvas = context.canvas;
3085    const pen = new drawing.Pen();
3086    pen.setStrokeWidth(5);
3087    pen.setColor({alpha: 255, red: 255, green: 0, blue: 0});
3088    canvas.attachPen(pen);
3089    canvas.drawRect({ left : 0, right : 10, top : 0, bottom : 10 });
3090    canvas.detachPen();
3091  }
3092}
3093```
3094
3095### attachBrush
3096
3097attachBrush(brush: Brush): void
3098
3099绑定画刷到画布上,在画布上进行绘制时,将使用画刷的样式对绘制图形形状的内部进行填充。
3100
3101> **说明:**
3102>
3103> 执行该方法后,若brush的效果发生改变并且开发者希望该变化生效于接下来的绘制动作,需要再次执行该方法以确保变化生效。
3104
3105**系统能力:** SystemCapability.Graphics.Drawing
3106
3107**参数:**
3108
3109| 参数名 | 类型            | 必填 | 说明       |
3110| ------ | --------------- | ---- | ---------- |
3111| brush  | [Brush](#brush) | 是   | 画刷对象。 |
3112
3113**错误码:**
3114
3115以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
3116
3117| 错误码ID | 错误信息 |
3118| ------- | --------------------------------------------|
3119| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
3120
3121**示例:**
3122
3123```ts
3124import { RenderNode } from '@kit.ArkUI';
3125import { drawing } from '@kit.ArkGraphics2D';
3126
3127class DrawingRenderNode extends RenderNode {
3128  draw(context : DrawContext) {
3129    const canvas = context.canvas;
3130    const brush = new drawing.Brush();
3131    brush.setColor({alpha: 255, red: 255, green: 0, blue: 0});
3132    canvas.attachBrush(brush);
3133    canvas.drawRect({ left : 0, right : 10, top : 0, bottom : 10 });
3134    canvas.detachBrush();
3135  }
3136}
3137```
3138
3139### detachPen
3140
3141detachPen(): void
3142
3143将画笔与画布解绑,在画布上进行绘制时,不会再使用画笔去绘制图形形状的轮廓。
3144
3145**系统能力:** SystemCapability.Graphics.Drawing
3146
3147**示例:**
3148
3149```ts
3150import { RenderNode } from '@kit.ArkUI';
3151import { drawing } from '@kit.ArkGraphics2D';
3152
3153class DrawingRenderNode extends RenderNode {
3154  draw(context : DrawContext) {
3155    const canvas = context.canvas;
3156    const pen = new drawing.Pen();
3157    pen.setStrokeWidth(5);
3158    pen.setColor({alpha: 255, red: 255, green: 0, blue: 0});
3159    canvas.attachPen(pen);
3160    canvas.drawRect({ left : 0, right : 10, top : 0, bottom : 10 });
3161    canvas.detachPen();
3162  }
3163}
3164```
3165
3166### detachBrush
3167
3168detachBrush(): void
3169
3170将画刷与画布解绑,在画布上进行绘制时,不会再使用画刷对绘制图形形状的内部进行填充。
3171
3172**系统能力:** SystemCapability.Graphics.Drawing
3173
3174**示例:**
3175
3176```ts
3177import { RenderNode } from '@kit.ArkUI';
3178import { drawing } from '@kit.ArkGraphics2D';
3179
3180class DrawingRenderNode extends RenderNode {
3181  draw(context : DrawContext) {
3182    const canvas = context.canvas;
3183    const brush = new drawing.Brush();
3184    brush.setColor({alpha: 255, red: 255, green: 0, blue: 0});
3185    canvas.attachBrush(brush);
3186    canvas.drawRect({ left : 0, right : 10, top : 0, bottom : 10 });
3187    canvas.detachBrush();
3188  }
3189}
3190```
3191
3192### clipPath<sup>12+</sup>
3193
3194clipPath(path: Path, clipOp?: ClipOp, doAntiAlias?: boolean): void
3195
3196使用自定义路径对画布的可绘制区域进行裁剪。
3197
3198**系统能力:** SystemCapability.Graphics.Drawing
3199
3200**参数:**
3201
3202| 参数名       | 类型               | 必填 | 说明                                |
3203| ------------ | ----------------- | ---- | ------------------------------------|
3204| path         | [Path](#path)     | 是   | 路径对象。                                                 |
3205| clipOp       | [ClipOp](#clipop12) | 否   | 裁剪方式。默认为INTERSECT。                                     |
3206| doAntiAlias  | boolean           | 否   | 表示是否使能抗锯齿绘制。true表示使能,false表示不使能。默认为false。 |
3207
3208**错误码:**
3209
3210以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
3211
3212| 错误码ID | 错误信息 |
3213| ------- | --------------------------------------------|
3214| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
3215
3216**示例:**
3217
3218```ts
3219import { RenderNode } from '@kit.ArkUI';
3220import { common2D, drawing } from '@kit.ArkGraphics2D';
3221
3222class DrawingRenderNode extends RenderNode {
3223  draw(context : DrawContext) {
3224    const canvas = context.canvas;
3225    let path = new drawing.Path();
3226    path.moveTo(10, 10);
3227    path.cubicTo(100, 100, 80, 150, 300, 150);
3228    path.close();
3229    canvas.clipPath(path, drawing.ClipOp.INTERSECT, true);
3230    canvas.clear({alpha: 255, red: 255, green: 0, blue: 0});
3231  }
3232}
3233```
3234
3235### clipRect<sup>12+</sup>
3236
3237clipRect(rect: common2D.Rect, clipOp?: ClipOp, doAntiAlias?: boolean): void
3238
3239使用矩形对画布的可绘制区域进行裁剪。
3240
3241**系统能力:** SystemCapability.Graphics.Drawing
3242
3243**参数:**
3244
3245| 参数名         | 类型                                       | 必填   | 说明                  |
3246| ----------- | ---------------------------------------- | ---- | ------------------- |
3247| rect        | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是    | 需要裁剪的矩形区域。      |
3248| clipOp      | [ClipOp](#clipop12)                  | 否    | 裁剪方式。默认为INTERSECT。     |
3249| doAntiAlias | boolean           | 否   | 表示是否使能抗锯齿绘制。true表示使能,false表示不使能。默认为false。 |
3250
3251**错误码:**
3252
3253以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
3254
3255| 错误码ID | 错误信息 |
3256| ------- | --------------------------------------------|
3257| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
3258
3259**示例:**
3260
3261```ts
3262import { RenderNode } from '@kit.ArkUI';
3263import { common2D, drawing } from '@kit.ArkGraphics2D';
3264
3265class DrawingRenderNode extends RenderNode {
3266  draw(context : DrawContext) {
3267    const canvas = context.canvas;
3268    canvas.clipRect({left : 10, right : 500, top : 300, bottom : 900}, drawing.ClipOp.DIFFERENCE, true);
3269    canvas.clear({alpha: 255, red: 255, green: 0, blue: 0});
3270  }
3271}
3272```
3273
3274### save<sup>12+</sup>
3275
3276save(): number
3277
3278保存当前画布状态(画布矩阵和可绘制区域)到栈顶。需要与恢复接口[restore](#restore12)配合使用。
3279
3280**系统能力:** SystemCapability.Graphics.Drawing
3281
3282**返回值:**
3283
3284| 类型   | 说明                |
3285| ------ | ------------------ |
3286| number | 画布状态个数,该参数为正整数。 |
3287
3288**示例:**
3289
3290```ts
3291import { RenderNode } from '@kit.ArkUI';
3292import { common2D, drawing } from '@kit.ArkGraphics2D';
3293
3294class DrawingRenderNode extends RenderNode {
3295  draw(context : DrawContext) {
3296    const canvas = context.canvas;
3297    let rect: common2D.Rect = {left: 10, right: 200, top: 100, bottom: 300};
3298    canvas.drawRect(rect);
3299    let saveCount = canvas.save();
3300  }
3301}
3302```
3303
3304### saveLayer<sup>12+</sup>
3305
3306saveLayer(rect?: common2D.Rect | null, brush?: Brush | null): number
3307
3308保存当前画布的矩阵和裁剪区域,并为后续绘制分配位图。调用恢复接口[restore](#restore12)将会舍弃对矩阵和裁剪区域做的更改,并绘制位图。
3309
3310**系统能力:** SystemCapability.Graphics.Drawing
3311
3312**参数:**
3313
3314| 参数名  | 类型     | 必填   | 说明         |
3315| ---- | ------ | ---- | ----------------- |
3316| rect   | [common2D.Rect](js-apis-graphics-common2D.md#rect)\|null | 否   | 矩形对象,用于限制图层大小,默认为当前画布大小。 |
3317| brush  | [Brush](#brush)\|null | 否   | 画刷对象,绘制位图时会应用画刷对象的透明度,颜色滤波器效果和混合模式,默认不设置额外效果。 |
3318
3319**返回值:**
3320
3321| 类型   | 说明                |
3322| ------ | ------------------ |
3323| number | 返回调用前保存的画布状态数,该参数为正整数。 |
3324
3325**错误码:**
3326
3327以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
3328
3329| 错误码ID | 错误信息 |
3330| ------- | --------------------------------------------|
3331| 401 | Parameter error. Possible causes: Mandatory parameters are left unspecified. |
3332
3333**示例:**
3334
3335```ts
3336import { RenderNode } from '@kit.ArkUI';
3337import { common2D, drawing } from '@kit.ArkGraphics2D';
3338
3339class DrawingRenderNode extends RenderNode {
3340  draw(context : DrawContext) {
3341    const canvas = context.canvas;
3342    canvas.saveLayer(null, null);
3343    const brushRect = new drawing.Brush();
3344    const colorRect: common2D.Color = {alpha: 255, red: 255, green: 255, blue: 0};
3345    brushRect.setColor(colorRect);
3346    canvas.attachBrush(brushRect);
3347    const rect: common2D.Rect = {left:100, top:100, right:500, bottom:500};
3348    canvas.drawRect(rect);
3349
3350    const brush = new drawing.Brush();
3351    brush.setBlendMode(drawing.BlendMode.DST_OUT);
3352    canvas.saveLayer(rect, brush);
3353
3354    const brushCircle = new drawing.Brush();
3355    const colorCircle: common2D.Color = {alpha: 255, red: 0, green: 0, blue: 255};
3356    brushCircle.setColor(colorCircle);
3357    canvas.attachBrush(brushCircle);
3358    canvas.drawCircle(500, 500, 200);
3359    canvas.restore();
3360    canvas.restore();
3361    canvas.detachBrush();
3362  }
3363}
3364```
3365
3366### scale<sup>12+</sup>
3367
3368scale(sx: number, sy: number): void
3369
3370在当前画布矩阵(默认是单位矩阵)的基础上再叠加一个缩放矩阵,后续绘制操作和裁剪操作的形状和位置都会自动叠加一个缩放效果。
3371
3372**系统能力:** SystemCapability.Graphics.Drawing
3373
3374**参数:**
3375
3376| 参数名  | 类型     | 必填   | 说明         |
3377| ---- | ------ | ---- | ----------------- |
3378| sx   | number | 是   | x轴方向的缩放比例,该参数为浮点数。 |
3379| sy   | number | 是   | y轴方向的缩放比例,该参数为浮点数。 |
3380
3381**错误码:**
3382
3383以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
3384
3385| 错误码ID | 错误信息 |
3386| ------- | --------------------------------------------|
3387| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
3388
3389**示例:**
3390
3391```ts
3392import { RenderNode } from '@kit.ArkUI';
3393import { common2D, drawing } from '@kit.ArkGraphics2D';
3394
3395class DrawingRenderNode extends RenderNode {
3396  draw(context : DrawContext) {
3397    const canvas = context.canvas;
3398    const pen = new drawing.Pen();
3399    pen.setStrokeWidth(5);
3400    pen.setColor({alpha: 255, red: 255, green: 0, blue: 0});
3401    canvas.attachPen(pen);
3402    canvas.scale(2, 0.5);
3403    canvas.drawRect({left : 10, right : 500, top : 300, bottom : 900});
3404    canvas.detachPen();
3405  }
3406}
3407```
3408
3409### skew<sup>12+</sup>
3410
3411skew(sx: number, sy: number) : void
3412
3413在当前画布矩阵(默认是单位矩阵)的基础上再叠加一个倾斜矩阵,后续绘制操作和裁剪操作的形状和位置都会自动叠加一个倾斜效果。
3414
3415**系统能力:** SystemCapability.Graphics.Drawing
3416
3417**参数:**
3418
3419| 参数名  | 类型     | 必填   | 说明         |
3420| ---- | ------ | ---- | ----------------- |
3421| sx   | number | 是   | x轴上的倾斜量,该参数为浮点数。正值会使绘制沿y轴增量方向向右倾斜;负值会使绘制沿y轴增量方向向左倾斜。    |
3422| sy   | number | 是   | y轴上的倾斜量,该参数为浮点数。正值会使绘制沿x轴增量方向向下倾斜;负值会使绘制沿x轴增量方向向上倾斜。    |
3423
3424**错误码:**
3425
3426以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
3427
3428| 错误码ID | 错误信息 |
3429| ------- | --------------------------------------------|
3430| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
3431
3432**示例:**
3433
3434```ts
3435import { RenderNode } from '@kit.ArkUI';
3436import { common2D, drawing } from '@kit.ArkGraphics2D';
3437
3438class DrawingRenderNode extends RenderNode {
3439  draw(context : DrawContext) {
3440    const canvas = context.canvas;
3441    const pen = new drawing.Pen();
3442    pen.setStrokeWidth(5);
3443    pen.setColor({alpha: 255, red: 255, green: 0, blue: 0});
3444    canvas.attachPen(pen);
3445    canvas.skew(0.1, 0.1);
3446    canvas.drawRect({left : 10, right : 500, top : 300, bottom : 900});
3447    canvas.detachPen();
3448  }
3449}
3450```
3451
3452### rotate<sup>12+</sup>
3453
3454rotate(degrees: number, sx: number, sy: number) : void
3455
3456在当前画布矩阵(默认是单位矩阵)的基础上再叠加一个旋转矩阵,后续绘制操作和裁剪操作的形状和位置都会自动叠加一个旋转效果。
3457
3458**系统能力:** SystemCapability.Graphics.Drawing
3459
3460**参数:**
3461
3462| 参数名  | 类型     | 必填   | 说明         |
3463| ---- | ------ | ------ | ------------------------ |
3464| degrees       | number | 是    | 旋转角度,单位为度,该参数为浮点数,正数为顺时针旋转,负数为逆时针旋转。  |
3465| sx            | number | 是    | 旋转中心的横坐标,该参数为浮点数。 |
3466| sy            | number | 是    | 旋转中心的纵坐标,该参数为浮点数。 |
3467
3468**错误码:**
3469
3470以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
3471
3472| 错误码ID | 错误信息 |
3473| ------- | --------------------------------------------|
3474| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
3475
3476**示例:**
3477
3478```ts
3479import { RenderNode } from '@kit.ArkUI';
3480import { common2D, drawing } from '@kit.ArkGraphics2D';
3481
3482class DrawingRenderNode extends RenderNode {
3483  draw(context : DrawContext) {
3484    const canvas = context.canvas;
3485    const pen = new drawing.Pen();
3486    pen.setStrokeWidth(5);
3487    pen.setColor({alpha: 255, red: 255, green: 0, blue: 0});
3488    canvas.attachPen(pen);
3489    canvas.rotate(30, 100, 100);
3490    canvas.drawRect({left : 10, right : 500, top : 300, bottom : 900});
3491    canvas.detachPen();
3492  }
3493}
3494```
3495
3496### translate<sup>12+</sup>
3497
3498translate(dx: number, dy: number): void
3499
3500在当前画布矩阵(默认是单位矩阵)的基础上再叠加一个平移矩阵,后续绘制操作和裁剪操作的形状和位置都会自动叠加一个平移效果。
3501
3502**系统能力:** SystemCapability.Graphics.Drawing
3503
3504**参数:**
3505
3506| 参数名 | 类型   | 必填 | 说明                |
3507| ----- | ------ | ---- | ------------------- |
3508| dx    | number | 是   | x轴方向的移动距离,该参数为浮点数。   |
3509| dy    | number | 是   | y轴方向的移动距离,该参数为浮点数。   |
3510
3511**错误码:**
3512
3513以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
3514
3515| 错误码ID | 错误信息 |
3516| ------- | --------------------------------------------|
3517| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
3518
3519**示例:**
3520
3521```ts
3522import { RenderNode } from '@kit.ArkUI';
3523import { common2D, drawing } from '@kit.ArkGraphics2D';
3524
3525class DrawingRenderNode extends RenderNode {
3526  draw(context : DrawContext) {
3527    const canvas = context.canvas;
3528    const pen = new drawing.Pen();
3529    pen.setStrokeWidth(5);
3530    pen.setColor({alpha: 255, red: 255, green: 0, blue: 0});
3531    canvas.attachPen(pen);
3532    canvas.translate(10, 10);
3533    canvas.drawRect({left : 10, right : 500, top : 300, bottom : 900});
3534    canvas.detachPen();
3535  }
3536}
3537```
3538
3539### getSaveCount<sup>12+</sup>
3540
3541getSaveCount(): number
3542
3543获取栈中保存的画布状态(画布矩阵和裁剪区域)的数量。
3544
3545**系统能力:** SystemCapability.Graphics.Drawing
3546
3547**返回值:**
3548
3549| 类型    | 说明                                 |
3550| ------ | ------------------------------------ |
3551| number | 已保存的画布状态的数量,该参数为正整数。 |
3552
3553**示例:**
3554
3555```ts
3556import { RenderNode } from '@kit.ArkUI';
3557import { common2D, drawing } from '@kit.ArkGraphics2D';
3558
3559class DrawingRenderNode extends RenderNode {
3560  draw(context : DrawContext) {
3561    const canvas = context.canvas;
3562    const pen = new drawing.Pen();
3563    pen.setStrokeWidth(5);
3564    pen.setColor({alpha: 255, red: 255, green: 0, blue: 0});
3565    canvas.attachPen(pen);
3566    canvas.drawRect({left: 10, right: 200, top: 100, bottom: 300});
3567    canvas.save();
3568    canvas.drawRect({left : 10, right : 500, top : 300, bottom : 900});
3569    canvas.getSaveCount();
3570    canvas.detachPen();
3571  }
3572}
3573```
3574
3575### restoreToCount<sup>12+</sup>
3576
3577restoreToCount(count: number): void
3578
3579恢复到指定数量的画布状态(画布矩阵和裁剪区域)。
3580
3581**系统能力:** SystemCapability.Graphics.Drawing
3582
3583**参数:**
3584
3585| 参数名   | 类型     | 必填   | 说明                    |
3586| ----- | ------ | ---- | ----------------------------- |
3587| count | number | 是   | 要恢复的画布状态深度,该参数为整数。小于等于1时,恢复为初始状态;大于已保存的画布状态数量时,不执行任何操作。 |
3588
3589**错误码:**
3590
3591以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
3592
3593| 错误码ID | 错误信息 |
3594| ------- | --------------------------------------------|
3595| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
3596
3597**示例:**
3598
3599```ts
3600import { RenderNode } from '@kit.ArkUI';
3601import { common2D, drawing } from '@kit.ArkGraphics2D';
3602
3603class DrawingRenderNode extends RenderNode {
3604  draw(context : DrawContext) {
3605    const canvas = context.canvas;
3606    const pen = new drawing.Pen();
3607    pen.setStrokeWidth(5);
3608    pen.setColor({alpha: 255, red: 255, green: 0, blue: 0});
3609    canvas.attachPen(pen);
3610    canvas.drawRect({left: 10, right: 200, top: 100, bottom: 300});
3611    canvas.save();
3612    canvas.drawRect({left: 10, right: 200, top: 100, bottom: 500});
3613    canvas.save();
3614    canvas.drawRect({left: 100, right: 300, top: 100, bottom: 500});
3615    canvas.save();
3616    canvas.restoreToCount(2);
3617    canvas.drawRect({left : 10, right : 500, top : 300, bottom : 900});
3618    canvas.detachPen();
3619  }
3620}
3621```
3622
3623### restore<sup>12+</sup>
3624
3625restore(): void
3626
3627恢复保存在栈顶的画布状态(画布矩阵和裁剪区域)。
3628
3629**系统能力:** SystemCapability.Graphics.Drawing
3630
3631**示例:**
3632
3633```ts
3634import { RenderNode } from '@kit.ArkUI';
3635import { common2D, drawing } from '@kit.ArkGraphics2D';
3636
3637class DrawingRenderNode extends RenderNode {
3638  draw(context : DrawContext) {
3639    const canvas = context.canvas;
3640    const pen = new drawing.Pen();
3641    pen.setStrokeWidth(5);
3642    pen.setColor({alpha: 255, red: 255, green: 0, blue: 0});
3643    canvas.attachPen(pen);
3644    canvas.restore();
3645    canvas.detachPen();
3646  }
3647}
3648```
3649
3650### concatMatrix<sup>12+</sup>
3651
3652concatMatrix(matrix: Matrix): void
3653
3654画布现有矩阵左乘传入矩阵,不影响之前的绘制操作,后续绘制操作和裁剪操作的形状和位置都会受到该矩阵的影响。
3655
3656**系统能力:** SystemCapability.Graphics.Drawing
3657
3658**参数:**
3659
3660| 参数名    | 类型                | 必填   | 说明    |
3661| ------ | ----------------- | ---- | ----- |
3662| matrix | [Matrix](#matrix12) | 是    | 矩阵对象。 |
3663
3664**错误码:**
3665
3666以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
3667
3668| 错误码ID | 错误信息 |
3669| ------- | --------------------------------------------|
3670| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
3671
3672**示例:**
3673
3674```ts
3675import { RenderNode } from '@kit.ArkUI';
3676import { drawing } from '@kit.ArkGraphics2D';
3677
3678class DrawingRenderNode extends RenderNode {
3679  draw(context : DrawContext) {
3680    const canvas = context.canvas;
3681    let matrix = new drawing.Matrix();
3682    matrix.setMatrix([5, 0, 0, 0, 1, 2, 0, 0, 1]);
3683    canvas.concatMatrix(matrix);
3684    canvas.drawRect({left: 10, right: 200, top: 100, bottom: 500});
3685  }
3686}
3687```
3688
3689### setMatrix<sup>12+</sup>
3690
3691setMatrix(matrix: Matrix): void
3692
3693设置画布的矩阵,后续绘制操作和裁剪操作的形状和位置都会受到该矩阵的影响。
3694
3695**系统能力:** SystemCapability.Graphics.Drawing
3696
3697**参数:**
3698
3699| 参数名    | 类型                | 必填   | 说明    |
3700| ------ | ----------------- | ---- | ----- |
3701| matrix | [Matrix](#matrix12) | 是    | 矩阵对象。 |
3702
3703**错误码:**
3704
3705以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
3706
3707| 错误码ID | 错误信息 |
3708| ------- | --------------------------------------------|
3709| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
3710
3711**示例:**
3712
3713```ts
3714import { RenderNode } from '@kit.ArkUI';
3715import { drawing } from '@kit.ArkGraphics2D';
3716
3717class DrawingRenderNode extends RenderNode {
3718  draw(context : DrawContext) {
3719    const canvas = context.canvas;
3720    let matrix = new drawing.Matrix()
3721    matrix.setMatrix([5, 0, 0, 0, 1, 1, 0, 0, 1]);
3722    canvas.setMatrix(matrix);
3723    canvas.drawRect({left: 10, right: 200, top: 100, bottom: 500});
3724  }
3725}
3726```
3727
3728### isClipEmpty<sup>12+</sup>
3729
3730isClipEmpty(): boolean
3731
3732判断裁剪后的可绘制区域是否为空。
3733
3734**系统能力:** SystemCapability.Graphics.Drawing
3735
3736**返回值:**
3737
3738| 类型                  | 说明           |
3739| --------------------- | -------------- |
3740| boolean | 返回画布的可绘制区域是否为空的结果,true表示为空,false表示不为空。 |
3741
3742**示例:**
3743
3744```ts
3745import { RenderNode } from '@kit.ArkUI';
3746import { drawing } from '@kit.ArkGraphics2D';
3747
3748class DrawingRenderNode extends RenderNode {
3749  draw(context : DrawContext) {
3750    const canvas = context.canvas;
3751    if (canvas.isClipEmpty()) {
3752      console.info("canvas.isClipEmpty() returned true");
3753    } else {
3754      console.info("canvas.isClipEmpty() returned false");
3755    }
3756  }
3757}
3758```
3759
3760### clipRegion<sup>12+</sup>
3761
3762clipRegion(region: Region, clipOp?: ClipOp): void
3763
3764在画布上裁剪一个区域。
3765
3766**系统能力:** SystemCapability.Graphics.Drawing
3767
3768**参数:**
3769
3770| 参数名          | 类型    | 必填 | 说明                                                        |
3771| --------------- | ------- | ---- | ----------------------------------------------------------- |
3772| region | [Region](#region12) | 是   | 区域对象,表示裁剪范围。 |
3773| clipOp | [ClipOp](#clipop12)   | 否   | 裁剪方式,默认为INTERSECT。 |
3774
3775**错误码:**
3776
3777以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
3778
3779| 错误码ID | 错误信息 |
3780| ------- | --------------------------------------------|
3781| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
3782
3783**示例:**
3784
3785```ts
3786import { RenderNode } from '@kit.ArkUI';
3787import { common2D, drawing } from '@kit.ArkGraphics2D';
3788
3789class DrawingRenderNode extends RenderNode {
3790  draw(context : DrawContext) {
3791    const canvas = context.canvas;
3792    let region : drawing.Region = new drawing.Region();
3793    region.setRect(0, 0, 500, 500);
3794    canvas.clipRegion(region);
3795    let color: common2D.Color = {alpha: 255, red: 255, green: 0, blue: 0};
3796    canvas.clear(color);
3797  }
3798}
3799```
3800
3801### clipRoundRect<sup>12+</sup>
3802
3803clipRoundRect(roundRect: RoundRect, clipOp?: ClipOp, doAntiAlias?: boolean): void
3804
3805在画布上裁剪一个圆角矩形。
3806
3807**系统能力:** SystemCapability.Graphics.Drawing
3808
3809**参数:**
3810
3811| 参数名          | 类型    | 必填 | 说明                                                        |
3812| --------------- | ------- | ---- | ----------------------------------------------------------- |
3813| roundRect | [RoundRect](#roundrect12) | 是   | 圆角矩形对象,表示裁剪范围。 |
3814| clipOp | [ClipOp](#clipop12)   | 否   | 裁剪方式,默认为INTERSECT。 |
3815| doAntiAlias | boolean | 否   | 表示是否使能抗锯齿。true表示使能,false表示不使能。默认为false。 |
3816
3817**错误码:**
3818
3819以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
3820
3821| 错误码ID | 错误信息 |
3822| ------- | --------------------------------------------|
3823| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
3824
3825**示例:**
3826
3827```ts
3828import { RenderNode } from '@kit.ArkUI';
3829import { common2D, drawing } from '@kit.ArkGraphics2D';
3830
3831class DrawingRenderNode extends RenderNode {
3832  draw(context : DrawContext) {
3833    const canvas = context.canvas;
3834    let rect: common2D.Rect = { left: 10, top: 100, right: 200, bottom: 300 };
3835    let roundRect = new drawing.RoundRect(rect, 10, 10);
3836    canvas.clipRoundRect(roundRect);
3837    let color: common2D.Color = {alpha: 255, red: 255, green: 0, blue: 0};
3838    canvas.clear(color);
3839  }
3840}
3841```
3842
3843### resetMatrix<sup>12+</sup>
3844
3845resetMatrix(): void
3846
3847将当前画布的矩阵重置为单位矩阵。
3848
3849**系统能力:** SystemCapability.Graphics.Drawing
3850
3851**示例:**
3852
3853```ts
3854import { RenderNode } from '@kit.ArkUI';
3855import { drawing } from '@kit.ArkGraphics2D';
3856
3857class DrawingRenderNode extends RenderNode {
3858  draw(context : DrawContext) {
3859    const canvas = context.canvas;
3860    canvas.scale(4, 6);
3861    canvas.resetMatrix();
3862  }
3863}
3864```
3865
3866### quickRejectPath<sup>18+</sup>
3867
3868quickRejectPath(path: Path): boolean
3869
3870判断路径与画布区域是否不相交。画布区域包含边界。
3871
3872**系统能力:** SystemCapability.Graphics.Drawing
3873
3874**参数:**
3875
3876| 参数名 | 类型          | 必填 | 说明               |
3877| ------ | ------------- | ---- | ------------------ |
3878| path   | [Path](#path) | 是   | 路径对象。 |
3879
3880**返回值:**
3881
3882| 类型                  | 说明           |
3883| --------------------- | -------------- |
3884| boolean | 返回路径是否与画布区域不相交的结果。true表示路径与画布区域不相交,false表示路径与画布区域相交。 |
3885
3886**示例:**
3887
3888```ts
3889import { RenderNode } from '@kit.ArkUI';
3890import { drawing } from '@kit.ArkGraphics2D';
3891
3892class DrawingRenderNode extends RenderNode {
3893  draw(context : DrawContext) {
3894    const canvas = context.canvas;
3895    let path = new drawing.Path();
3896    path.moveTo(10, 10);
3897    path.cubicTo(10, 10, 10, 10, 15, 15);
3898    path.close();
3899    if (canvas.quickRejectPath(path)) {
3900      console.info("canvas and path do not intersect.");
3901    } else {
3902      console.info("canvas and path intersect.");
3903    }
3904  }
3905}
3906```
3907
3908### quickRejectRect<sup>18+</sup>
3909
3910quickRejectRect(rect: common2D.Rect): boolean
3911
3912判断矩形和画布区域是否不相交。画布区域包含边界。
3913
3914**系统能力:** SystemCapability.Graphics.Drawing
3915
3916**参数:**
3917
3918| 参数名 | 类型                                               | 必填 | 说明           |
3919| ------ | -------------------------------------------------- | ---- | -------------- |
3920| rect   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 矩形区域。 |
3921
3922**返回值:**
3923
3924| 类型                  | 说明           |
3925| --------------------- | -------------- |
3926| boolean | 返回矩形是否与画布区域不相交的结果。true表示矩形与画布区域不相交,false表示矩形与画布区域相交。 |
3927
3928**示例:**
3929
3930```ts
3931import { RenderNode } from '@kit.ArkUI';
3932import { common2D, drawing } from '@kit.ArkGraphics2D';
3933
3934class DrawingRenderNode extends RenderNode {
3935  draw(context : DrawContext) {
3936    const canvas = context.canvas;
3937    let rect: common2D.Rect = { left : 10, top : 20, right : 50, bottom : 30 };
3938    if (canvas.quickRejectRect(rect)) {
3939      console.info("canvas and rect do not intersect.");
3940    } else {
3941      console.info("canvas and rect intersect.");
3942    }
3943  }
3944}
3945```
3946
3947### drawArcWithCenter<sup>18+</sup>
3948
3949drawArcWithCenter(arc: common2D.Rect, startAngle: number, sweepAngle: number, useCenter: boolean): void
3950
3951在画布上绘制圆弧。该方法允许指定圆弧的起始角度、扫描角度以及圆弧的起点和终点是否连接圆弧的中心点。
3952
3953**系统能力:** SystemCapability.Graphics.Drawing
3954
3955**参数**
3956
3957| 参数名 | 类型                                               | 必填 | 说明           |
3958| ------ | -------------------------------------------------- | ---- | -------------- |
3959| arc   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 包含要绘制的圆弧的椭圆的矩形边界。 |
3960| startAngle      | number | 是   | 弧的起始角度,单位为度,该参数为浮点数。0度时起始点位于椭圆的右端点,为正数时以顺时针方向放置起始点,为负数时以逆时针方向放置起始点。 |
3961| sweepAngle      | number | 是   | 弧的扫描角度,单位为度,该参数为浮点数。为正数时顺时针扫描,为负数时逆时针扫描。扫描角度可以超过360度,将绘制一个完整的椭圆。 |
3962| useCenter       | boolean | 是   | 绘制时弧形的起点和终点是否连接弧形的中心点。true表示连接,false表示不连接。 |
3963
3964**示例:**
3965
3966```ts
3967import { RenderNode } from '@kit.ArkUI';
3968import { common2D, drawing } from '@kit.ArkGraphics2D';
3969
3970class DrawingRenderNode extends RenderNode {
3971  draw(context : DrawContext) {
3972    const canvas = context.canvas;
3973    const pen = new drawing.Pen();
3974    pen.setStrokeWidth(5);
3975    const color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 };
3976    pen.setColor(color);
3977    canvas.attachPen(pen);
3978    const rect: common2D.Rect = { left: 100, top: 50, right: 400, bottom: 200 };
3979    canvas.drawArcWithCenter(rect, 90, 180, false);
3980    canvas.detachPen();
3981  }
3982}
3983```
3984
3985### drawImageNine<sup>18+</sup>
3986
3987drawImageNine(pixelmap: image.PixelMap, center: common2D.Rect, dstRect: common2D.Rect, filterMode: FilterMode): void
3988
3989通过绘制两条水平线和两条垂直线将图像分割成9个部分:四个边,四个角和中心。<br>
3990若角落的4个区域尺寸不超过目标矩形,则会在不缩放的情况下被绘制在目标矩形,反之则会按比例缩放绘制在目标矩形;如果还有剩余空间,剩下的5个区域会通过拉伸或压缩来绘制,以便能够完全覆盖目标矩形。
3991
3992**系统能力:** SystemCapability.Graphics.Drawing
3993
3994**参数:**
3995
3996| 参数名 | 类型    | 必填 | 说明           |
3997| ------ | ------ | ---- | -------------- |
3998| pixelmap   | [image.PixelMap](../apis-image-kit/arkts-apis-image-PixelMap.md) | 是   | 用于绘制网格的像素图。 |
3999| center    | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 分割图像的中心矩形。矩形四条边所在的直线将图像分成了9个部分。 |
4000| dstRect  | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 在画布上绘制的目标矩形区域。 |
4001| filterMode | [FilterMode](#filtermode12) | 是   | 过滤模式。 |
4002
4003**错误码:**
4004
4005以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
4006
4007| 错误码ID | 错误信息 |
4008| ------- | --------------------------------------------|
4009| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
4010
4011**示例:**
4012
4013```ts
4014import { RenderNode } from '@kit.ArkUI';
4015import { common2D, drawing } from '@kit.ArkGraphics2D';
4016import { image } from '@kit.ImageKit';
4017
4018class DrawingRenderNode extends RenderNode {
4019  draw(context : DrawContext) {
4020    const canvas = context.canvas;
4021    let pixelMap: image.PixelMap = globalThis.getInstance().getPixelMap("test_2.jpg");
4022    canvas.drawImage(pixelMap, 0, 0); // 原图
4023    let center: common2D.Rect = { left: 20, top: 10, right: 50, bottom: 40 };
4024    let dst: common2D.Rect = { left: 70, top: 0, right: 100, bottom: 30 };
4025    let dst1: common2D.Rect = { left: 110, top: 0, right: 200, bottom: 90 };
4026    canvas.drawImageNine(pixelMap, center, dst, drawing.FilterMode.FILTER_MODE_NEAREST); // 示例1
4027    canvas.drawImageNine(pixelMap, center, dst1, drawing.FilterMode.FILTER_MODE_NEAREST); // 示例2
4028  }
4029}
4030```
4031![zh-ch_image_Nine.png](figures/zh-ch_image_Nine.png)
4032
4033### drawImageLattice<sup>18+</sup>
4034
4035drawImageLattice(pixelmap: image.PixelMap, lattice: Lattice, dstRect: common2D.Rect, filterMode: FilterMode): void
4036
4037将图像按照矩形网格对象的设置划分为多个网格,并把图像的每个部分按照网格对象的设置绘制到画布上的目标矩形区域。<br>
4038偶数行和列(起始计数为0)的每个交叉点都是固定的,若固定网格区域的尺寸不超过目标矩形,则会在不缩放的情况下被绘制在目标矩形,反之则会按比例缩放绘制在目标矩形;如果还有剩余空间,剩下的区域会通过拉伸或压缩来绘制,以便能够完全覆盖目标矩形。
4039
4040**系统能力:** SystemCapability.Graphics.Drawing
4041
4042**参数:**
4043
4044| 参数名 | 类型    | 必填 | 说明           |
4045| ------ | ------ | ---- | -------------- |
4046| pixelmap   | [image.PixelMap](../apis-image-kit/arkts-apis-image-PixelMap.md) | 是   | 用于绘制网格的像素图。 |
4047| lattice  | [Lattice](#lattice12) | 是   | 矩形网格对象。 |
4048| dstRect    | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 目标矩形区域。 |
4049| filterMode | [FilterMode](#filtermode12) | 是   | 过滤模式。 |
4050
4051**错误码:**
4052
4053以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
4054
4055| 错误码ID | 错误信息 |
4056| ------- | --------------------------------------------|
4057| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
4058
4059**示例:**
4060
4061```ts
4062import { RenderNode } from '@kit.ArkUI';
4063import { common2D, drawing } from '@kit.ArkGraphics2D';
4064import { image } from '@kit.ImageKit';
4065
4066class DrawingRenderNode extends RenderNode {
4067  draw(context : DrawContext) {
4068    const canvas = context.canvas;
4069    let pixelMap: image.PixelMap = globalThis.getInstance().getPixelMap("test_3.jpg");
4070    canvas.drawImage(pixelMap, 0, 0); // 原图
4071    let xDivs: Array<number> = [28, 36, 44, 52];
4072    let yDivs: Array<number> = [28, 36, 44, 52];
4073    let lattice = drawing.Lattice.createImageLattice(xDivs, yDivs, 4, 4);
4074    let dst: common2D.Rect = { left: 100, top: 0, right: 164, bottom: 64 };
4075    let dst1: common2D.Rect = { left: 200, top: 0, right: 360, bottom: 160 };
4076    canvas.drawImageLattice(pixelMap, lattice, dst, drawing.FilterMode.FILTER_MODE_NEAREST); // 示例1
4077    canvas.drawImageLattice(pixelMap, lattice, dst1, drawing.FilterMode.FILTER_MODE_NEAREST); // 示例2
4078  }
4079}
4080```
4081![zh-ch_image_Lattice.png](figures/zh-ch_image_Lattice.png)
4082
4083## ImageFilter<sup>12+</sup>
4084
4085图像滤波器。
4086
4087### createBlurImageFilter<sup>12+</sup>
4088
4089static createBlurImageFilter(sigmaX: number, sigmaY: number, tileMode: TileMode, imageFilter?: ImageFilter | null ): ImageFilter
4090
4091创建具有模糊效果的图像滤波器。
4092
4093**系统能力:** SystemCapability.Graphics.Drawing
4094
4095**参数:**
4096
4097| 参数名          | 类型    | 必填 | 说明                                                        |
4098| --------------- | ------- | ---- | ----------------------------------------------------------- |
4099| sigmaX | number | 是   | 表示沿x轴方向上高斯模糊的标准差,必须大于0,该参数为浮点数。 |
4100| sigmaY | number | 是   | 表示沿y轴方向上高斯模糊的标准差,必须大于0,该参数为浮点数。 |
4101| tileMode | [TileMode](#tilemode12)| 是   | 表示在边缘处应用的平铺模式。 |
4102| imageFilter | [ImageFilter](#imagefilter12) \| null | 否   | 要与当前图像滤波器叠加的输入滤波器,默认为null,表示直接将当前图像滤波器作用于原始图像。 |
4103
4104**返回值:**
4105
4106| 类型                  | 说明           |
4107| --------------------- | -------------- |
4108| [ImageFilter](#imagefilter12) | 返回创建的图像滤波器。 |
4109
4110**错误码:**
4111
4112以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
4113
4114| 错误码ID | 错误信息 |
4115| ------- | --------------------------------------------|
4116| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
4117
4118**示例:**
4119
4120```ts
4121import { drawing } from '@kit.ArkGraphics2D';
4122
4123let imgFilter = drawing.ImageFilter.createBlurImageFilter(5, 10, drawing.TileMode.CLAMP);
4124```
4125### createFromImage<sup>20+</sup>
4126
4127static createFromImage(pixelmap: image.PixelMap, srcRect?: common2D.Rect | null, dstRect?: common2D.Rect | null): ImageFilter
4128
4129基于给定的图像创建一个图像滤波器。此接口不建议用于录制类型的画布,会影响性能。
4130
4131**系统能力**:SystemCapability.Graphics.Drawing
4132
4133**参数:**
4134
4135| 参数名          | 类型    | 必填 | 说明                                                        |
4136| --------------- | ------- | ---- | ----------------------------------------------------------- |
4137| pixelmap | [image.PixelMap](../apis-image-kit/arkts-apis-image-PixelMap.md)  | 是   | 图片对象。 |
4138| srcRect      | [common2D.Rect](js-apis-graphics-common2D.md#rect) \| null           | 否   | 可选参数,默认为空。图片要被此滤波器使用的像素区域,如果为空,则使用pixelmap全部区域。 |
4139| dstRect      | [common2D.Rect](js-apis-graphics-common2D.md#rect) \| null           | 否   | 可选参数,默认为空。要进行渲染的区域,如果为空,则和srcRect保持一致。 |
4140
4141**返回值:**
4142
4143| 类型                  | 说明           |
4144| --------------------- | -------------- |
4145| [ImageFilter](#imagefilter12) | 返回创建的图像滤波器。 |
4146
4147**示例:**
4148
4149```ts
4150import { RenderNode } from '@kit.ArkUI';
4151import { image } from '@kit.ImageKit';
4152import { common2D, drawing } from '@kit.ArkGraphics2D';
4153class DrawingRenderNode extends RenderNode {
4154  pixelMap: image.PixelMap | null = null;
4155
4156  async draw(context : DrawContext) {
4157    const canvas = context.canvas;
4158    let srcRect: common2D.Rect = { left: 10, top: 10, right: 80, bottom: 80 };
4159    let dstRect: common2D.Rect = { left: 200, top: 200, right: 400, bottom: 400 };
4160    if (this.pixelMap != null) {
4161      let filter = drawing.ImageFilter.createFromImage(this.pixelMap, srcRect, dstRect);
4162    }
4163  }
4164}
4165```
4166### createBlendImageFilter<sup>20+</sup>
4167
4168static createBlendImageFilter(mode: BlendMode, background: ImageFilter, foreground: ImageFilter): ImageFilter
4169
4170按照指定的混合模式对两个滤波器进行叠加,生成一个新的滤波器。
4171
4172**系统能力**:SystemCapability.Graphics.Drawing
4173
4174**参数:**
4175
4176| 参数名          | 类型    | 必填 | 说明                                                        |
4177| --------------- | ------- | ---- | ----------------------------------------------------------- |
4178| mode   | [BlendMode](#blendmode)                              | 是   | 颜色混合模式。 |
4179| background | [ImageFilter](#imagefilter12) | 是   | 在混合模式中作为目标色的滤波器。|
4180| foreground | [ImageFilter](#imagefilter12) | 是   | 在混合模式中作为源色的滤波器。 |
4181
4182**返回值:**
4183
4184| 类型                  | 说明            |
4185| --------------------- | -------------- |
4186| [ImageFilter](#imagefilter12) | 返回创建的图像滤波器。 |
4187
4188**错误码:**
4189
4190以下错误码的详细介绍请参见[图形绘制与显示错误码](../apis-arkgraphics2d/errorcode-drawing.md)。
4191
4192| 错误码ID | 错误信息 |
4193| ------- | --------------------------------------------|
4194| 25900001 | Parameter error.Possible causes: Incorrect parameter range. |
4195
4196**示例:**
4197
4198```ts
4199import { drawing } from '@kit.ArkGraphics2D';
4200
4201let dx = 15.0;
4202let dy = 10.0;
4203let offsetFilter1 = drawing.ImageFilter.createOffsetImageFilter(dx, dy, null);
4204let x = 15.0;
4205let y = 30.0;
4206let offsetFilter2 = drawing.ImageFilter.createOffsetImageFilter(x, y, null);
4207let blendImageFilter = drawing.ImageFilter.createBlendImageFilter(drawing.BlendMode.SRC_IN, offsetFilter1, offsetFilter2);
4208```
4209### createComposeImageFilter<sup>20+</sup>
4210
4211static createComposeImageFilter(cOuter: ImageFilter, cInner: ImageFilter): ImageFilter
4212
4213将两个图像滤波器进行级联生成新的图像滤波器,级联时会将第一级滤波器的输出作为第二级滤波器的输入,经过第二级滤波器处理后,输出最终的滤波结果。
4214
4215**系统能力**:SystemCapability.Graphics.Drawing
4216
4217**参数:**
4218
4219| 参数名          | 类型    | 必填 | 说明                                                          |
4220| --------------- | ------- | ---- | ----------------------------------------------------------- |
4221| cOuter | [ImageFilter](#imagefilter12) | 是   | 在级联中,作为第二级的滤波器,处理第一级滤波器的输出。如果第二级滤波器为空,第一级滤波器不为空,最后输出第一级滤波器的结果。两级滤波器不能同时为空。 |
4222| cInner | [ImageFilter](#imagefilter12) | 是   | 在级联中,作为第一级的滤波器,直接处理图像的原始内容。如果第一级滤波器为空,第二级滤波器不为空,最后输出第二级滤波器的结果。两级滤波器不能同时为空。 |
4223
4224**返回值:**
4225
4226| 类型                  | 说明           |
4227| --------------------- | -------------- |
4228| [ImageFilter](#imagefilter12) | 返回创建的图像滤波器。 |
4229
4230**示例:**
4231
4232```ts
4233import { drawing } from '@kit.ArkGraphics2D';
4234
4235let blurSigmaX = 10.0;
4236let blurSigmaY = 10.0;
4237let blurFilter = drawing.ImageFilter.createBlurImageFilter(blurSigmaX, blurSigmaY, drawing.TileMode.CLAMP, null);
4238let colorMatrix:Array<number> = [
4239  0, 0, 0, 0, 0,
4240  0, 1, 0, 0, 0,
4241  0, 0, 1, 0, 0,
4242  0, 0, 0, 1, 0
4243];
4244let redRemovalFilter = drawing.ColorFilter.createMatrixColorFilter(colorMatrix);
4245let colorFilter = drawing.ImageFilter.createFromColorFilter(redRemovalFilter, null);
4246let composedImageFilter = drawing.ImageFilter.createComposeImageFilter(colorFilter, blurFilter);
4247```
4248### createFromColorFilter<sup>12+</sup>
4249
4250static createFromColorFilter(colorFilter: ColorFilter, imageFilter?: ImageFilter | null): ImageFilter
4251
4252创建一个将颜色滤波器应用于传入的图像滤波器的图像滤波器。
4253
4254**系统能力:** SystemCapability.Graphics.Drawing
4255
4256**参数:**
4257
4258| 参数名          | 类型    | 必填 | 说明                                                        |
4259| --------------- | ------- | ---- | ----------------------------------------------------------- |
4260| colorFilter | [ColorFilter](#colorfilter) | 是   | 表示颜色滤波器。 |
4261| imageFilter | [ImageFilter](#imagefilter12) \| null | 否   | 要与当前图像滤波器叠加的输入滤波器,默认为null,表示直接将当前图像滤波器作用于原始图像。 |
4262
4263**返回值:**
4264
4265| 类型                  | 说明           |
4266| --------------------- | -------------- |
4267| [ImageFilter](#imagefilter12) | 返回创建的图像滤波器。 |
4268
4269**错误码:**
4270
4271以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
4272
4273| 错误码ID | 错误信息 |
4274| ------- | --------------------------------------------|
4275| 401 | Parameter error.Possible causes: 1.Mandatory parameters are left unspecified; 2.Incorrect parameter types.|
4276
4277**示例:**
4278
4279```ts
4280import { drawing } from '@kit.ArkGraphics2D';
4281let imgFilter = drawing.ImageFilter.createBlurImageFilter(5, 10, drawing.TileMode.CLAMP);
4282let clolorfilter = drawing.ColorFilter.createSRGBGammaToLinear();
4283let imgFilter1 = drawing.ImageFilter.createFromColorFilter(clolorfilter, imgFilter);
4284```
4285### createOffsetImageFilter<sup>20+</sup>
4286
4287static createOffsetImageFilter(dx: number, dy: number, input?: ImageFilter | null): ImageFilter
4288
4289创建一个偏移滤波器,将输入的滤波器按照指定向量进行平移。
4290
4291**系统能力**:SystemCapability.Graphics.Drawing
4292
4293**参数:**
4294
4295| 参数名          | 类型    | 必填 | 说明                                                        |
4296| --------------- | ------- | ---- | ----------------------------------------------------------- |
4297| dx | number | 是   | 水平方向的平移距离, 该参数为浮点数。 |
4298| dy | number | 是   | 竖直方向的平移距离, 该参数为浮点数。 |
4299| input | [ImageFilter](#imagefilter12) \| null | 否   | 需进行平移的滤波器。默认为空,如果为空,则将无滤波效果的绘制结果进行平移。 |
4300
4301**返回值:**
4302
4303| 类型                  | 说明           |
4304| --------------------- | -------------- |
4305| [ImageFilter](#imagefilter12) | 返回创建的图像滤波器。 |
4306
4307**示例:**
4308
4309```ts
4310import { drawing } from '@kit.ArkGraphics2D';
4311
4312let dx = 15.0;
4313let dy = 10.0;
4314let offsetFilter = drawing.ImageFilter.createOffsetImageFilter(dx, dy, null);
4315```
4316
4317### createFromShaderEffect<sup>20+</sup>
4318
4319static createFromShaderEffect(shader: ShaderEffect): ImageFilter
4320
4321基于着色器创建一个图像滤波器。
4322
4323**系统能力**:SystemCapability.Graphics.Drawing
4324
4325**参数:**
4326
4327| 参数名          | 类型    | 必填 | 说明                                                        |
4328| --------------- | ------- | ---- | ----------------------------------------------------------- |
4329| shader   | [ShaderEffect](#shadereffect12) | 是   | 表示应用于图像的着色器效果。 |
4330
4331**返回值:**
4332
4333| 类型                  | 说明           |
4334| --------------------- | -------------- |
4335| [ImageFilter](#imagefilter12) | 返回创建的图像滤波器。 |
4336
4337**示例:**
4338
4339```ts
4340import { drawing } from '@kit.ArkGraphics2D';
4341
4342let shaderEffect = drawing.ShaderEffect.createColorShader(0xFF00FF00);
4343let renderEffect = drawing.ImageFilter.createFromShaderEffect(shaderEffect);
4344```
4345## TextBlobRunBuffer
4346
4347描述一行文字中具有相同属性的连续字形。
4348
4349**系统能力:** SystemCapability.Graphics.Drawing
4350
4351| 名称      | 类型   | 只读 | 可选 | 说明                      |
4352| --------- | ------ | ---- | ---- | ------------------------- |
4353| glyph     | number | 否   | 否   | 存储文字的索引,该参数为整数,传入浮点类型时向下取整。 |
4354| positionX | number | 否   | 否   | 文本的起点x轴坐标,该参数为浮点数。 |
4355| positionY | number | 否   | 否   | 文本的起点y轴坐标,该参数为浮点数。 |
4356
4357## TextEncoding
4358
4359文本的编码类型枚举。
4360
4361**系统能力:** SystemCapability.Graphics.Drawing
4362
4363| 名称                   | 值   | 说明                           |
4364| ---------------------- | ---- | ------------------------------ |
4365| TEXT_ENCODING_UTF8     | 0    | 使用1个字节表示UTF-8或ASCII。  |
4366| TEXT_ENCODING_UTF16    | 1    | 使用2个字节表示大部分unicode。 |
4367| TEXT_ENCODING_UTF32    | 2    | 使用4个字节表示全部unicode。   |
4368| TEXT_ENCODING_GLYPH_ID | 3    | 使用2个字节表示glyph index。   |
4369
4370## ClipOp<sup>12+</sup>
4371画布裁剪方式的枚举。
4372
4373
4374**系统能力:** SystemCapability.Graphics.Drawing
4375
4376| 名称                 | 值    | 说明           | 示意图   |
4377| ------------------ | ---- | ---------------- | -------- |
4378| DIFFERENCE | 0    | 将指定区域裁剪(取差集)。 | ![DIFFERENCE](./figures/zh-ch_image_ClipOp_Difference.png) |
4379| INTERSECT  | 1    | 将指定区域保留(取交集)。 | ![INTERSECT](./figures/zh-ch_image_ClipOp_Intersect.png) |
4380
4381> **说明:**
4382>
4383> 示意图展示了以INTERSECT方式裁剪一个矩形后,使用不同枚举值继续裁剪一个圆形的结果,绿色区域为最终的裁剪区域。
4384
4385## FilterMode<sup>12+</sup>
4386
4387过滤模式枚举。
4388
4389**系统能力:** SystemCapability.Graphics.Drawing
4390
4391| 名称                  | 值    | 说明      |
4392| ------------------- | ---- | ------- |
4393| FILTER_MODE_NEAREST | 0    | 邻近过滤模式。 |
4394| FILTER_MODE_LINEAR  | 1    | 线性过滤模式。 |
4395
4396## PathDirection<sup>12+</sup>
4397
4398添加闭合轮廓方向的枚举。
4399
4400**系统能力:** SystemCapability.Graphics.Drawing
4401
4402| 名称                  | 值    | 说明      |
4403| ------------------- | ---- | ------- |
4404| CLOCKWISE   | 0    | 顺时针方向添加闭合轮廓。 |
4405| COUNTER_CLOCKWISE  | 1    | 逆时针方向添加闭合轮廓。 |
4406
4407## PathFillType<sup>12+</sup>
4408
4409定义路径的填充类型枚举。
4410
4411**系统能力:** SystemCapability.Graphics.Drawing
4412
4413| 名称                  | 值    | 说明      |
4414| ------------------- | ---- | ------- |
4415| WINDING   | 0    | 绘制区域中的任意一点,向任意方向射出一条射线,对于射线和路径的所有交点,初始计数为0,遇到每个顺时针的交点(路径从射线的左边向右穿过),计数加1,遇到每个逆时针的交点(路径从射线的右边向左穿过),计数减1,若最终的计数结果不为0,则认为这个点在路径内部,需要被涂色;若计数为0则不被涂色。 |
4416| EVEN_ODD  | 1    | 绘制区域中的任意一点,向任意方向射出一条射线,若这条射线和路径相交的次数是奇数,则这个点被认为在路径内部,需要被涂色;若是偶数则不被涂色。 |
4417| INVERSE_WINDING  | 2    | WINDING涂色规则取反。 |
4418| INVERSE_EVEN_ODD  | 3    | EVEN_ODD涂色规则取反。 |
4419
4420> **说明:**<br>
4421> ![WINDING&EVEN_ODD](./figures/zh-ch_image_PathFillType_Winding_Even_Odd.png)<br>
4422> 如图所示圆环为路径,箭头指示路径的方向,p为区域内任意一点,蓝色线条为点p出发的射线,黑色箭头所指为对应填充规则下使用蓝色填充路径的结果。WINDING填充规则下,射线与路径的交点计数为2,不为0,点p被涂色;EVEN_ODD填充规则下,射线与路径的相交次数为2,是偶数,点p不被涂色。
4423
4424## PointMode<sup>12+</sup>
4425
4426绘制数组点的方式的枚举。
4427
4428**系统能力:** SystemCapability.Graphics.Drawing
4429
4430| 名称                 | 值    | 说明            |
4431| ------------------ | ---- | ------------- |
4432| POINTS  | 0    | 分别绘制每个点。      |
4433| LINES   | 1    | 将每对点绘制为线段。    |
4434| POLYGON | 2    | 将点阵列绘制为开放多边形。 |
4435
4436## FontEdging<sup>12+</sup>
4437
4438字型边缘效果类型枚举。
4439
4440**系统能力:** SystemCapability.Graphics.Drawing
4441
4442| 名称                  | 值    | 说明      |
4443| ------------------- | ---- | ------- |
4444| ALIAS | 0    | 无抗锯齿处理。 |
4445| ANTI_ALIAS  | 1    | 使用抗锯齿来平滑字型边缘。 |
4446| SUBPIXEL_ANTI_ALIAS  | 2    | 使用次像素级别的抗锯齿平滑字型边缘,可以获得更平滑的字型渲染效果。 |
4447
4448## FontHinting<sup>12+</sup>
4449
4450字型轮廓效果类型枚举。
4451
4452**系统能力:** SystemCapability.Graphics.Drawing
4453
4454| 名称                  | 值    | 说明      |
4455| ------------------- | ---- | ------- |
4456| NONE    | 0    | 不修改字型轮廓。 |
4457| SLIGHT  | 1    | 最小限度修改字型轮廓以改善对比度。 |
4458| NORMAL  | 2    | 修改字型轮廓以提高对比度。 |
4459| FULL    | 3    | 修改字型轮廓以获得最大对比度。 |
4460
4461## TextBlob
4462
4463由一个或多个具有相同字体的字符组成的字块。
4464
4465### makeFromPosText<sup>12+</sup>
4466
4467static makeFromPosText(text: string, len: number, points: common2D.Point[], font: Font): TextBlob
4468
4469使用文本创建TextBlob对象,TextBlob对象中每个字形的坐标由points中对应的坐标信息决定。
4470
4471**系统能力:** SystemCapability.Graphics.Drawing
4472
4473**参数:**
4474
4475| 参数名   | 类型                          | 必填 | 说明                                   |
4476| -------- | ----------------------------- | ---- | -------------------------------------- |
4477| text     | string             | 是   | 绘制字形的文本内容。                   |
4478| len      | number             | 是   | 字形个数,由[countText](#counttext12)获取,该参数为整数。 |
4479| points   |[common2D.Point](js-apis-graphics-common2D.md#point12)[]     | 是   |点数组,用于指定每个字形的坐标,长度必须为len。|
4480| font     | [Font](#font)      | 是   | 字型对象。 |
4481
4482**返回值:**
4483
4484| 类型                  | 说明           |
4485| --------------------- | -------------- |
4486| [TextBlob](#textblob) | TextBlob对象。 |
4487
4488
4489**错误码:**
4490
4491以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
4492
4493| 错误码ID | 错误信息 |
4494| ------- | --------------------------------------------|
4495| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types. |
4496
4497**示例:**
4498
4499```ts
4500import { RenderNode } from '@kit.ArkUI';
4501import { drawing,common2D} from '@kit.ArkGraphics2D';
4502
4503class DrawingRenderNode extends RenderNode {
4504  draw(context : DrawContext) {
4505    const canvas = context.canvas;
4506    let text : string = 'makeFromPosText';
4507    let font : drawing.Font = new drawing.Font();
4508    font.setSize(100);
4509    let length = font.countText(text);
4510    let points : common2D.Point[] = [];
4511    for (let i = 0; i !== length; ++i) {
4512      points.push({ x: i * 35, y: i * 35 });
4513    }
4514    let textblob : drawing.TextBlob =drawing.TextBlob.makeFromPosText(text, points.length, points, font);
4515    canvas.drawTextBlob(textblob, 100, 100);
4516  }
4517}
4518```
4519
4520### uniqueID<sup>12+</sup>
4521
4522uniqueID(): number
4523
4524获取该TextBlob对象的唯一的非零标识符。
4525
4526**系统能力:** SystemCapability.Graphics.Drawing
4527
4528**返回值:**
4529
4530| 类型                  | 说明           |
4531| --------------------- | -------------- |
4532| number | 返回TextBlob对象的唯一的非零标识符。 |
4533
4534**示例:**
4535
4536```ts
4537import {drawing} from "@kit.ArkGraphics2D";
4538
4539let text : string = 'TextBlobUniqueId';
4540let font : drawing.Font = new drawing.Font();
4541font.setSize(100);
4542let textBlob = drawing.TextBlob.makeFromString(text, font, 0);
4543let id = textBlob.uniqueID();
4544console.info("uniqueID---------------" +id);
4545```
4546
4547### makeFromString
4548
4549static makeFromString(text: string, font: Font, encoding?: TextEncoding): TextBlob
4550
4551将string类型的值转化成TextBlob对象。
4552
4553**系统能力:** SystemCapability.Graphics.Drawing
4554
4555**参数:**
4556
4557| 参数名   | 类型                          | 必填 | 说明                                   |
4558| -------- | ----------------------------- | ---- | -------------------------------------- |
4559| text     | string                        | 是   | 绘制字形的文本内容。                   |
4560| font     | [Font](#font)                 | 是   | 字型对象。           |
4561| encoding | [TextEncoding](#textencoding) | 否   | 编码类型,默认值为TEXT_ENCODING_UTF8。当前只有TEXT_ENCODING_UTF8生效,其余编码类型也会被视为TEXT_ENCODING_UTF8。 |
4562
4563**返回值:**
4564
4565| 类型                  | 说明           |
4566| --------------------- | -------------- |
4567| [TextBlob](#textblob) | TextBlob对象。 |
4568
4569**错误码:**
4570
4571以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
4572
4573| 错误码ID | 错误信息 |
4574| ------- | --------------------------------------------|
4575| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
4576
4577**示例:**
4578
4579```ts
4580import { RenderNode } from '@kit.ArkUI';
4581import { drawing } from '@kit.ArkGraphics2D';
4582
4583class DrawingRenderNode extends RenderNode {
4584  draw(context : DrawContext) {
4585    const canvas = context.canvas;
4586    const brush = new drawing.Brush();
4587    brush.setColor({alpha: 255, red: 255, green: 0, blue: 0});
4588    const font = new drawing.Font();
4589    font.setSize(20);
4590    const textBlob = drawing.TextBlob.makeFromString("drawing", font, drawing.TextEncoding.TEXT_ENCODING_UTF8);
4591    canvas.attachBrush(brush);
4592    canvas.drawTextBlob(textBlob, 20, 20);
4593    canvas.detachBrush();
4594  }
4595}
4596```
4597
4598### makeFromRunBuffer
4599
4600static makeFromRunBuffer(pos: Array\<TextBlobRunBuffer>, font: Font, bounds?: common2D.Rect): TextBlob
4601
4602基于RunBuffer信息创建Textblob对象。
4603
4604**系统能力:** SystemCapability.Graphics.Drawing
4605
4606**参数:**
4607
4608| 参数名 | 类型                                               | 必填 | 说明                           |
4609| ------ | -------------------------------------------------- | ---- | ------------------------------ |
4610| pos    | Array\<[TextBlobRunBuffer](#textblobrunbuffer)>    | 是   | TextBlobRunBuffer数组。        |
4611| font   | [Font](#font)                                      | 是   | 字型对象。   |
4612| bounds | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 否   | 可选,如果不设置,则无边界框。 |
4613
4614**返回值:**
4615
4616| 类型                  | 说明           |
4617| --------------------- | -------------- |
4618| [TextBlob](#textblob) | TextBlob对象。 |
4619
4620**错误码:**
4621
4622以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
4623
4624| 错误码ID | 错误信息 |
4625| ------- | --------------------------------------------|
4626| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
4627
4628**示例:**
4629
4630```ts
4631import { RenderNode } from '@kit.ArkUI';
4632import { common2D, drawing } from '@kit.ArkGraphics2D';
4633
4634class DrawingRenderNode extends RenderNode {
4635  draw(context : DrawContext) {
4636    const canvas = context.canvas;
4637    const font = new drawing.Font();
4638    font.setSize(20);
4639    let runBuffer : Array<drawing.TextBlobRunBuffer> = [
4640      { glyph: 65, positionX: 0, positionY: 0 },
4641      { glyph: 227, positionX: 14.9, positionY: 0 },
4642      { glyph: 283, positionX: 25.84, positionY: 0 },
4643      { glyph: 283, positionX: 30.62, positionY: 0 },
4644      { glyph: 299, positionX: 35.4, positionY: 0}
4645    ];
4646    const textBlob = drawing.TextBlob.makeFromRunBuffer(runBuffer, font, null);
4647    const brush = new drawing.Brush();
4648    brush.setColor({alpha: 255, red: 255, green: 0, blue: 0});
4649    canvas.attachBrush(brush);
4650    canvas.drawTextBlob(textBlob, 20, 20);
4651    canvas.detachBrush();
4652  }
4653}
4654```
4655
4656### bounds
4657
4658bounds(): common2D.Rect
4659
4660获取文字边界框的矩形区域。
4661
4662**系统能力:** SystemCapability.Graphics.Drawing
4663
4664**返回值:**
4665
4666| 类型                                               | 说明                   |
4667| -------------------------------------------------- | ---------------------- |
4668| [common2D.Rect](js-apis-graphics-common2D.md#rect) | 文字边界框的矩形区域。 |
4669
4670**示例:**
4671
4672```ts
4673import { common2D, drawing } from '@kit.ArkGraphics2D';
4674
4675const font = new drawing.Font();
4676font.setSize(20);
4677const textBlob = drawing.TextBlob.makeFromString("drawing", font, drawing.TextEncoding.TEXT_ENCODING_UTF8);
4678let bounds = textBlob.bounds();
4679```
4680
4681## TypefaceArguments<sup>20+</sup>
4682
4683提供字体属性配置的结构体。
4684
4685### constructor<sup>20+</sup>
4686
4687constructor()
4688
4689字体属性的构造函数。
4690
4691**系统能力:** SystemCapability.Graphics.Drawing
4692
4693**示例:**
4694
4695```ts
4696import { drawing } from '@kit.ArkGraphics2D';
4697let typeFaceArgument = new drawing.TypefaceArguments();
4698```
4699
4700### addVariation<sup>20+</sup>
4701
4702addVariation(axis: string, value: number)
4703
4704给字体属性设置字重值。
4705
4706**系统能力:** SystemCapability.Graphics.Drawing
4707
4708**参数:**
4709| 参数名         | 类型                                       | 必填   | 说明             |
4710| ----------- | ---------------------------------------- | ---- | -------------------   |
4711| axis  | string           | 是   | 字体属性对象可变维度字重的标签'wght'。具体是否支持的该标签取决于加载的字体文件。请打开对应的字体文件具体查看支持的属性。   |
4712| value | number           | 是   | 字体属性对象可变维度字重的标签'wght'对应的属性值,需要在字体文件支持的范围内,否则不会生效。如果属性值小于支持的最小值,则默认和最小值一致。如果属性值大于支持的最大值,则默认和最大值效果一致。请打开对应的字体文件具体查看支持的属性值。    |
4713
4714**错误码:**
4715
4716以下错误码的详细介绍请参见[图形绘制与显示错误码](../apis-arkgraphics2d/errorcode-drawing.md)。
4717
4718| 错误码ID | 错误信息 |
4719| ------- | --------------------------------------------|
4720| 25900001 | Parameter error.Possible causes: Incorrect parameter range. |
4721
4722**示例:**
4723
4724```ts
4725import { drawing } from '@kit.ArkGraphics2D';
4726
4727let typeFaceArgument = new drawing.TypefaceArguments();
4728typeFaceArgument.addVariation('wght', 10);
4729```
4730
4731## Typeface
4732
4733字体,如宋体、楷体等。
4734
4735### getFamilyName
4736
4737getFamilyName(): string
4738
4739获取字体的族名,即一套字体设计的名称。
4740
4741**系统能力:** SystemCapability.Graphics.Drawing
4742
4743**返回值:**
4744
4745| 类型   | 说明                 |
4746| ------ | -------------------- |
4747| string | 返回字体的族名。 |
4748
4749**示例:**
4750
4751```ts
4752import { drawing } from '@kit.ArkGraphics2D';
4753
4754const font = new drawing.Font();
4755let typeface = font.getTypeface();
4756let familyName = typeface.getFamilyName();
4757```
4758
4759### makeFromCurrent<sup>20+</sup>
4760
4761makeFromCurrent(typefaceArguments: TypefaceArguments): Typeface
4762
4763基于当前字体结合字体属性构造新的字体对象。
4764
4765**系统能力:** SystemCapability.Graphics.Drawing
4766
4767**参数:**
4768| 参数名         | 类型                                       | 必填   | 说明                  |
4769| ----------- | ---------------------------------------- | ---- | ------------------- |
4770| typefaceArguments | [TypefaceArguments](#typefacearguments20)           | 是   | 字体属性。 |
4771
4772**返回值:**
4773
4774| 类型   | 说明                  |
4775| ------ | -------------------- |
4776| [Typeface](#typeface) | 返回字体对象(异常情况下会返回空指针)。 |
4777
4778**示例:**
4779
4780```ts
4781import { RenderNode } from '@kit.ArkUI';
4782import { drawing } from '@kit.ArkGraphics2D';
4783
4784class TextRenderNode extends RenderNode {
4785  async draw(context: DrawContext) {
4786    const canvas = context.canvas;
4787    let typeArguments = new drawing.TypefaceArguments();
4788    typeArguments.addVariation("wght", 100);
4789    const myTypeFace = drawing.Typeface.makeFromFile("/system/fonts/HarmonyOS_Sans_SC.ttf");
4790    const typeFace1 = myTypeFace.makeFromCurrent(typeArguments);
4791    let font = new drawing.Font();
4792    font.setTypeface(typeFace1);
4793    const textBlob = drawing.TextBlob.makeFromString("Hello World", font, drawing.TextEncoding.TEXT_ENCODING_UTF8);
4794    canvas.drawTextBlob(textBlob, 60, 100);
4795  }
4796}
4797```
4798
4799### makeFromFile<sup>12+</sup>
4800
4801static makeFromFile(filePath: string): Typeface
4802
4803从指定字体文件构造字体。
4804
4805**系统能力:** SystemCapability.Graphics.Drawing
4806
4807**参数:**
4808
4809| 参数名         | 类型                                       | 必填   | 说明                  |
4810| ----------- | ---------------------------------------- | ---- | ------------------- |
4811| filePath | string           | 是   | 表示字体资源存放的路径。应用沙箱路径和真实物理路径的对应关系请参考[应用沙箱路径和真实物理路径的对应关系](../../file-management/app-sandbox-directory.md#应用沙箱路径和真实物理路径的对应关系)。 |
4812
4813**返回值:**
4814
4815| 类型   | 说明                 |
4816| ------ | -------------------- |
4817| [Typeface](#typeface) | 返回Typeface对象。 |
4818
4819**错误码:**
4820
4821以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
4822
4823| 错误码ID | 错误信息 |
4824| ------- | --------------------------------------------|
4825| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
4826
4827**示例:**
4828
4829```ts
4830import { RenderNode } from '@kit.ArkUI';
4831import { drawing } from '@kit.ArkGraphics2D';
4832
4833class TextRenderNode extends RenderNode {
4834  async draw(context: DrawContext) {
4835    const canvas = context.canvas;
4836    let font = new drawing.Font();
4837    let str = "/system/fonts/HarmonyOS_Sans_Italic.ttf";
4838    const mytypeface = drawing.Typeface.makeFromFile(str);
4839    font.setTypeface(mytypeface);
4840    const textBlob = drawing.TextBlob.makeFromString("Hello World", font, drawing.TextEncoding.TEXT_ENCODING_UTF8);
4841    canvas.drawTextBlob(textBlob, 60, 100);
4842  }
4843}
4844```
4845
4846### makeFromRawFile<sup>18+</sup>
4847
4848static makeFromRawFile(rawfile: Resource): Typeface
4849
4850使用指定的字体文件构造字体,其中要求指定的字体文件需保存在应用资源文件夹的rawfile路径下。
4851
4852**系统能力:** SystemCapability.Graphics.Drawing
4853
4854**参数:**
4855
4856| 参数名         | 类型                                       | 必填   | 说明                  |
4857| ----------- | ---------------------------------------- | ---- | ------------------- |
4858| rawfile | [Resource](../apis-arkui/arkui-ts/ts-types.md#resource)           | 是   | 指定字体文件对应的资源对象。当前只支持``$rawfile``格式引用的资源对象,对应格式写为``$rawfile('filePath')``,其中filePath为指定字体文件相对于工程中resources/rawfile目录的相对路径。如将字体文件直接存放在resources/rawfile目录下,则引用格式应写为:``$rawfile('HarmonyOS_Sans_Bold.ttf')``;也可以创建子目录,将字体文件存放在resources/rawfile/ttf下,则引用格式应写为:``$rawfile('ttf/HarmonyOS_Sans_Bold.ttf')``。 |
4859
4860**返回值:**
4861
4862| 类型   | 说明                 |
4863| ------ | -------------------- |
4864| [Typeface](#typeface) | 返回Typeface对象(异常情况下会返回空指针)。 |
4865
4866**示例:**
4867
4868```ts
4869import { RenderNode } from '@kit.ArkUI';
4870import { drawing } from '@kit.ArkGraphics2D';
4871
4872class TextRenderNode extends RenderNode {
4873  async draw(context: DrawContext) {
4874    const canvas = context.canvas;
4875    let font = new drawing.Font();
4876    const myTypeFace = drawing.Typeface.makeFromRawFile($rawfile('HarmonyOS_Sans_Bold.ttf'));
4877    font.setTypeface(myTypeFace);
4878    const textBlob = drawing.TextBlob.makeFromString("Hello World", font, drawing.TextEncoding.TEXT_ENCODING_UTF8);
4879    canvas.drawTextBlob(textBlob, 60, 100);
4880  }
4881}
4882
4883```
4884### makeFromFileWithArguments<sup>20+</sup>
4885
4886static makeFromFileWithArguments(filePath: string, typefaceArguments: TypefaceArguments): Typeface
4887
4888根据字体文件路径和字体属性构造新的字体。
4889
4890**系统能力:** SystemCapability.Graphics.Drawing
4891
4892**参数:**
4893
4894| 参数名         | 类型                                       | 必填   | 说明                  |
4895| ----------- | ---------------------------------------- | ---- | ------------------- |
4896| filePath | string           | 是   | 表示字体资源存放的路径。应用沙箱路径和真实物理路径的对应关系请参考[应用沙箱路径和真实物理路径的对应关系](../../file-management/app-sandbox-directory.md#应用沙箱路径和真实物理路径的对应关系)。 |
4897| typefaceArguments | [TypefaceArguments](#typefacearguments20) | 是  | 表示字体属性。 |
4898
4899**返回值:**
4900
4901| 类型   | 说明                  |
4902| ------ | -------------------- |
4903| [Typeface](#typeface) | 返回字体对象(异常情况下会返回空指针)。 |
4904
4905**示例:**
4906
4907```ts
4908import { RenderNode } from '@kit.ArkUI';
4909import { drawing } from '@kit.ArkGraphics2D';
4910
4911class TextRenderNode extends RenderNode {
4912  async draw(context: DrawContext) {
4913    const canvas = context.canvas;
4914    let font = new drawing.Font();
4915    let str = "/system/fonts/HarmonyOS_Sans_Italic.ttf";
4916    let typeFaceArgument = new drawing.TypefaceArguments();
4917    const myTypeFace = drawing.Typeface.makeFromFileWithArguments(str, typeFaceArgument);
4918    font.setTypeface(myTypeFace);
4919    const textBlob = drawing.TextBlob.makeFromString("Hello World", font, drawing.TextEncoding.TEXT_ENCODING_UTF8);
4920    canvas.drawTextBlob(textBlob, 60, 100);
4921  }
4922}
4923```
4924
4925### makeFromRawFileWithArguments<sup>20+</sup>
4926
4927static makeFromRawFileWithArguments(rawfile: Resource, typefaceArguments: TypefaceArguments): Typeface
4928
4929使用指定的字体文件和字体属性构造字体,其中要求指定的字体文件需保存在应用资源文件夹的rawfile路径下。
4930
4931**系统能力:** SystemCapability.Graphics.Drawing
4932
4933**参数:**
4934
4935| 参数名         | 类型                                       | 必填   | 说明                  |
4936| ----------- | ---------------------------------------- | ---- | ------------------- |
4937| rawfile | [Resource](../apis-arkui/arkui-ts/ts-types.md#resource)           | 是   | 指定字体文件对应的资源对象。当前只支持``$rawfile``格式引用的资源对象,对应格式写为``$rawfile('filePath')``,其中filePath为指定字体文件相对于工程中resources/rawfile目录的相对路径。 |
4938| typefaceArguments | [TypefaceArguments](#typefacearguments20) | 是 | 表示字体属性。 |
4939
4940**返回值:**
4941
4942| 类型   | 说明                 |
4943| ------ | ------------------- |
4944| [Typeface](#typeface) | 返回字体对象(异常情况下会返回空指针)。 |
4945
4946**示例:**
4947
4948```ts
4949import { RenderNode } from '@kit.ArkUI';
4950import { drawing } from '@kit.ArkGraphics2D';
4951
4952class TextRenderNode extends RenderNode {
4953  async draw(context: DrawContext) {
4954    const canvas = context.canvas;
4955    let font = new drawing.Font();
4956    let typeFaceArgument = new drawing.TypefaceArguments();
4957    const myTypeFace = drawing.Typeface.makeFromRawFileWithArguments($rawfile('HarmonyOS_Sans_Bold.ttf'), typeFaceArgument);
4958    font.setTypeface(myTypeFace);
4959    const textBlob = drawing.TextBlob.makeFromString("Hello World", font, drawing.TextEncoding.TEXT_ENCODING_UTF8);
4960    canvas.drawTextBlob(textBlob, 60, 100);
4961  }
4962}
4963```
4964
4965## Font
4966
4967描述字型绘制时所使用的属性,如大小、字体等。
4968
4969### isSubpixel<sup>12+</sup>
4970
4971isSubpixel(): boolean
4972
4973获取字型是否使用次像素渲染。
4974
4975**系统能力:** SystemCapability.Graphics.Drawing
4976
4977**返回值:**
4978
4979| 类型   | 说明                 |
4980| ------ | -------------------- |
4981| boolean | 返回字型是否使用次像素渲染的结果,true表示使用,false表示不使用。 |
4982
4983**示例:**
4984
4985```ts
4986import {drawing} from '@kit.ArkGraphics2D';
4987
4988let font: drawing.Font = new drawing.Font();
4989font.enableSubpixel(true)
4990console.info("values=" + font.isSubpixel());
4991```
4992
4993### isLinearMetrics<sup>12+</sup>
4994
4995isLinearMetrics(): boolean
4996
4997获取字型是否可以线性缩放。
4998
4999**系统能力:** SystemCapability.Graphics.Drawing
5000
5001**返回值:**
5002
5003| 类型   | 说明                 |
5004| ------ | -------------------- |
5005| boolean | 返回字型是否可线性缩放的结果,true表示可线性缩放,false表示不可线性缩放。 |
5006
5007**示例:**
5008
5009```ts
5010import {drawing} from '@kit.ArkGraphics2D';
5011
5012let font: drawing.Font = new drawing.Font();
5013font.enableLinearMetrics(true)
5014console.info("values=" + font.isLinearMetrics());
5015```
5016
5017### getSkewX<sup>12+</sup>
5018
5019getSkewX(): number
5020
5021获取字型在x轴方向上的倾斜度。
5022
5023**系统能力:** SystemCapability.Graphics.Drawing
5024
5025**返回值:**
5026
5027| 类型   | 说明                 |
5028| ------ | -------------------- |
5029| number | 返回字型在x轴方向上的倾斜度。 |
5030
5031**示例:**
5032
5033```ts
5034import {drawing} from '@kit.ArkGraphics2D';
5035
5036let font: drawing.Font = new drawing.Font();
5037font.setSkewX(-1)
5038console.info("values=" + font.getSkewX());
5039```
5040
5041### isEmbolden<sup>12+</sup>
5042
5043isEmbolden(): boolean
5044
5045获取字型是否设置了粗体效果。
5046
5047**系统能力:** SystemCapability.Graphics.Drawing
5048
5049**返回值:**
5050
5051| 类型   | 说明                 |
5052| ------ | -------------------- |
5053| boolean  | 返回字型是否设置粗体效果的结果,true表示设置了粗体效果,false表示未设置粗体效果。 |
5054
5055**示例:**
5056
5057```ts
5058import {drawing} from '@kit.ArkGraphics2D';
5059
5060let font: drawing.Font = new drawing.Font();
5061font.enableEmbolden(true);
5062console.info("values=" + font.isEmbolden());
5063```
5064
5065### getScaleX<sup>12+</sup>
5066
5067getScaleX(): number
5068
5069获取字型在x轴方向上的缩放比例。
5070
5071**系统能力:** SystemCapability.Graphics.Drawing
5072
5073**返回值:**
5074
5075| 类型   | 说明                 |
5076| ------ | -------------------- |
5077| number  | 返回字型在x轴方向上的缩放比例。 |
5078
5079**示例:**
5080
5081```ts
5082import {drawing} from '@kit.ArkGraphics2D';
5083
5084let font: drawing.Font = new drawing.Font();
5085font.setScaleX(2);
5086console.info("values=" + font.getScaleX());
5087```
5088
5089### getHinting<sup>12+</sup>
5090
5091getHinting(): FontHinting
5092
5093获取字型轮廓效果。
5094
5095**系统能力:** SystemCapability.Graphics.Drawing
5096
5097**返回值:**
5098
5099| 类型   | 说明                 |
5100| ------ | -------------------- |
5101| [FontHinting](#fonthinting12)  | 返回字型轮廓效果。 |
5102
5103**示例:**
5104
5105```ts
5106import {drawing} from '@kit.ArkGraphics2D';
5107
5108let font: drawing.Font = new drawing.Font();
5109console.info("values=" + font.getHinting());
5110```
5111
5112### getEdging<sup>12+</sup>
5113
5114getEdging(): FontEdging
5115
5116获取字型边缘效果。
5117
5118**系统能力:** SystemCapability.Graphics.Drawing
5119
5120**返回值:**
5121
5122| 类型   | 说明                 |
5123| ------ | -------------------- |
5124| [FontEdging](#fontedging12)  | 返回字型边缘效果。 |
5125
5126**示例:**
5127
5128```ts
5129import {drawing} from '@kit.ArkGraphics2D';
5130
5131let font: drawing.Font = new drawing.Font();
5132console.info("values=" + font.getEdging());
5133```
5134
5135### enableSubpixel
5136
5137enableSubpixel(isSubpixel: boolean): void
5138
5139使能字型亚像素级别的文字绘制,显示效果平滑。
5140
5141**系统能力:** SystemCapability.Graphics.Drawing
5142
5143**参数:**
5144
5145| 参数名     | 类型    | 必填 | 说明                                                         |
5146| ---------- | ------- | ---- | ------------------------------------------------------------ |
5147| isSubpixel | boolean | 是   | 表示是否使能字型亚像素级别的文字绘制。true表示使能,false表示不使能。 |
5148
5149**错误码:**
5150
5151以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
5152
5153| 错误码ID | 错误信息 |
5154| ------- | --------------------------------------------|
5155| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
5156
5157**示例:**
5158
5159```ts
5160import { drawing } from '@kit.ArkGraphics2D';
5161
5162let font = new drawing.Font();
5163font.enableSubpixel(true);
5164```
5165
5166### enableEmbolden
5167
5168enableEmbolden(isEmbolden: boolean): void
5169
5170使能字型粗体。
5171
5172**系统能力:** SystemCapability.Graphics.Drawing
5173
5174**参数:**
5175
5176| 参数名     | 类型    | 必填 | 说明                                                  |
5177| ---------- | ------- | ---- | ----------------------------------------------------- |
5178| isEmbolden | boolean | 是   | 表示是否使能字型粗体。true表示使能,false表示不使能。 |
5179
5180**错误码:**
5181
5182以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
5183
5184| 错误码ID | 错误信息 |
5185| ------- | --------------------------------------------|
5186| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
5187
5188**示例:**
5189
5190```ts
5191import { drawing } from '@kit.ArkGraphics2D';
5192
5193let font = new drawing.Font();
5194font.enableEmbolden(true);
5195```
5196
5197### enableLinearMetrics
5198
5199enableLinearMetrics(isLinearMetrics: boolean): void
5200
5201使能字型的线性缩放。
5202
5203**系统能力:** SystemCapability.Graphics.Drawing
5204
5205**参数:**
5206
5207| 参数名          | 类型    | 必填 | 说明                                                        |
5208| --------------- | ------- | ---- | ----------------------------------------------------------- |
5209| isLinearMetrics | boolean | 是   | 表示是否使能字型的线性缩放。true表示使能,false表示不使能。 |
5210
5211**错误码:**
5212
5213以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
5214
5215| 错误码ID | 错误信息 |
5216| ------- | --------------------------------------------|
5217| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
5218
5219**示例:**
5220
5221```ts
5222import { drawing } from '@kit.ArkGraphics2D';
5223
5224let font = new drawing.Font();
5225font.enableLinearMetrics(true);
5226```
5227
5228### setSize
5229
5230setSize(textSize: number): void
5231
5232设置字型大小。
5233
5234**系统能力:** SystemCapability.Graphics.Drawing
5235
5236**参数:**
5237
5238| 参数名   | 类型   | 必填 | 说明             |
5239| -------- | ------ | ---- | ---------------- |
5240| textSize | number | 是   | 字型大小,该参数为浮点数,为负数时字型大小会被置为0。字型大小为0时,绘制的文字不会显示。|
5241
5242**错误码:**
5243
5244以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
5245
5246| 错误码ID | 错误信息 |
5247| ------- | --------------------------------------------|
5248| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
5249
5250**示例:**
5251
5252```ts
5253import { drawing } from '@kit.ArkGraphics2D';
5254
5255let font = new drawing.Font();
5256font.setSize(5);
5257```
5258
5259### getSize
5260
5261getSize(): number
5262
5263获取字型大小。
5264
5265**系统能力:** SystemCapability.Graphics.Drawing
5266
5267**返回值:**
5268
5269| 类型   | 说明             |
5270| ------ | ---------------- |
5271| number | 字型大小,浮点数。 |
5272
5273**示例:**
5274
5275```ts
5276import { drawing } from '@kit.ArkGraphics2D';
5277
5278let font = new drawing.Font();
5279font.setSize(5);
5280let fontSize = font.getSize();
5281```
5282
5283### setTypeface
5284
5285setTypeface(typeface: Typeface): void
5286
5287为字型设置字体样式(包括字体名称、粗细、斜体等属性)。
5288
5289**系统能力:** SystemCapability.Graphics.Drawing
5290
5291**参数:**
5292
5293| 参数名   | 类型                  | 必填 | 说明   |
5294| -------- | --------------------- | ---- | ------ |
5295| typeface | [Typeface](#typeface) | 是   | 字体样式,包括字体名称、粗细、斜体等属性。 |
5296
5297**错误码:**
5298
5299以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
5300
5301| 错误码ID | 错误信息 |
5302| ------- | --------------------------------------------|
5303| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
5304
5305**示例:**
5306
5307```ts
5308import { drawing } from '@kit.ArkGraphics2D';
5309
5310let font = new drawing.Font();
5311font.setTypeface(new drawing.Typeface());
5312```
5313
5314### getTypeface
5315
5316getTypeface(): Typeface
5317
5318获取字体。
5319
5320**系统能力:** SystemCapability.Graphics.Drawing
5321
5322**返回值:**
5323
5324| 类型                  | 说明   |
5325| --------------------- | ------ |
5326| [Typeface](#typeface) | 字体。 |
5327
5328**示例:**
5329
5330```ts
5331import { drawing } from '@kit.ArkGraphics2D';
5332
5333let font = new drawing.Font();
5334let typeface = font.getTypeface();
5335```
5336
5337### getMetrics
5338
5339getMetrics(): FontMetrics
5340
5341获取与字体关联的FontMetrics属性。
5342
5343**系统能力:** SystemCapability.Graphics.Drawing
5344
5345**返回值:**
5346
5347| 类型                        | 说明              |
5348| --------------------------- | ----------------- |
5349| [FontMetrics](#fontmetrics) | FontMetrics属性。 |
5350
5351**示例:**
5352
5353```ts
5354import { drawing } from '@kit.ArkGraphics2D';
5355
5356let font = new drawing.Font();
5357let metrics = font.getMetrics();
5358```
5359
5360### measureText
5361
5362measureText(text: string, encoding: TextEncoding): number
5363
5364测量文本的宽度。
5365
5366> **说明:**
5367>
5368> 此接口用于测量原始字符串的文本宽度,若想测量排版后的文本宽度,建议使用[measure.measureText](../apis-arkui/arkts-apis-uicontext-measureutils.md#measuretext12)替代。
5369
5370**系统能力:** SystemCapability.Graphics.Drawing
5371
5372**参数:**
5373
5374| 参数名   | 类型                          | 必填 | 说明       |
5375| -------- | ----------------------------- | ---- | ---------- |
5376| text     | string                        | 是   | 文本内容。 |
5377| encoding | [TextEncoding](#textencoding) | 是   | 编码格式。 |
5378
5379**返回值:**
5380
5381| 类型   | 说明             |
5382| ------ | ---------------- |
5383| number | 文本的宽度,浮点数。 |
5384
5385**错误码:**
5386
5387以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
5388
5389| 错误码ID | 错误信息 |
5390| ------- | --------------------------------------------|
5391| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
5392
5393**示例:**
5394
5395```ts
5396import { drawing } from '@kit.ArkGraphics2D';
5397
5398let font = new drawing.Font();
5399font.measureText("drawing", drawing.TextEncoding.TEXT_ENCODING_UTF8);
5400```
5401
5402### measureSingleCharacter<sup>12+</sup>
5403
5404measureSingleCharacter(text: string): number
5405
5406测量单个字符的宽度。当前字型中的字体不支持待测量字符时,退化到使用系统字体测量字符宽度。
5407
5408**系统能力:** SystemCapability.Graphics.Drawing
5409
5410**参数**
5411
5412| 参数名 | 类型                | 必填 | 说明        |
5413| ------ | ------------------- | ---- | ----------- |
5414| text   | string | 是   | 待测量的单个字符,字符串的长度必须为1。  |
5415
5416**返回值:**
5417
5418| 类型   | 说明             |
5419| ------ | ---------------- |
5420| number | 字符的宽度,浮点数。 |
5421
5422**错误码:**
5423
5424以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
5425
5426| 错误码ID | 错误信息 |
5427| ------- | --------------------------------------------|
5428| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
5429
5430**示例:**
5431
5432```ts
5433import { RenderNode } from '@kit.ArkUI';
5434import { drawing } from '@kit.ArkGraphics2D';
5435
5436class DrawingRenderNode extends RenderNode {
5437  draw(context : DrawContext) {
5438    const canvas = context.canvas;
5439    const font = new drawing.Font();
5440    font.setSize(20);
5441    let width = font.measureSingleCharacter("你");
5442  }
5443}
5444```
5445
5446### setScaleX<sup>12+</sup>
5447
5448setScaleX(scaleX: number): void
5449
5450设置字型对象在x轴上的缩放比例。
5451
5452**系统能力:** SystemCapability.Graphics.Drawing
5453
5454**参数:**
5455
5456| 参数名   | 类型                          | 必填 | 说明       |
5457| -------- | ----------------------------- | ---- | ---------- |
5458| scaleX     | number                      | 是   | 文本在x轴上的缩放比例,该参数为浮点数。 |
5459
5460**错误码:**
5461
5462以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
5463
5464| 错误码ID | 错误信息 |
5465| ------- | --------------------------------------------|
5466| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
5467
5468**示例:**
5469
5470```ts
5471import { RenderNode } from '@kit.ArkUI';
5472import { common2D, drawing } from '@kit.ArkGraphics2D';
5473
5474class DrawingRenderNode extends RenderNode {
5475  draw(context : DrawContext) {
5476    const canvas = context.canvas;
5477    const pen = new drawing.Pen();
5478    pen.setStrokeWidth(5);
5479    pen.setColor({alpha: 255, red: 255, green: 0, blue: 0});
5480    canvas.attachPen(pen);
5481    let font = new drawing.Font();
5482    font.setSize(100);
5483    font.setScaleX(2);
5484    const textBlob = drawing.TextBlob.makeFromString("hello", font, drawing.TextEncoding.TEXT_ENCODING_UTF8);
5485    canvas.drawTextBlob(textBlob, 200, 200);
5486  }
5487}
5488```
5489
5490### setSkewX<sup>12+</sup>
5491
5492setSkewX(skewX: number): void
5493
5494设置字型对象在x轴上的倾斜比例。
5495
5496**系统能力:** SystemCapability.Graphics.Drawing
5497
5498**参数:**
5499
5500| 参数名   | 类型                          | 必填 | 说明       |
5501| -------- | ----------------------------- | ---- | ---------- |
5502| skewX     | number                      | 是   | 文本在x轴上的倾斜比例,正数表示往左边倾斜,负数表示往右边倾斜,该参数为浮点数。 |
5503
5504**错误码:**
5505
5506以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
5507
5508| 错误码ID | 错误信息 |
5509| ------- | --------------------------------------------|
5510| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
5511
5512**示例:**
5513
5514```ts
5515import { RenderNode } from '@kit.ArkUI';
5516import { common2D, drawing } from '@kit.ArkGraphics2D';
5517
5518class DrawingRenderNode extends RenderNode {
5519  draw(context : DrawContext) {
5520    const canvas = context.canvas;
5521    const pen = new drawing.Pen();
5522    pen.setStrokeWidth(5);
5523    pen.setColor({alpha: 255, red: 255, green: 0, blue: 0});
5524    canvas.attachPen(pen);
5525    let font = new drawing.Font();
5526    font.setSize(100);
5527    font.setSkewX(1);
5528    const textBlob = drawing.TextBlob.makeFromString("hello", font, drawing.TextEncoding.TEXT_ENCODING_UTF8);
5529    canvas.drawTextBlob(textBlob, 200, 200);
5530  }
5531}
5532```
5533
5534### setEdging<sup>12+</sup>
5535
5536setEdging(edging: FontEdging): void
5537
5538设置字型边缘效果。
5539
5540**系统能力:** SystemCapability.Graphics.Drawing
5541
5542**参数:**
5543
5544| 参数名   | 类型                          | 必填 | 说明       |
5545| -------- | ----------------------------- | ---- | ---------- |
5546| edging | [FontEdging](#fontedging12) | 是   | 字型边缘效果。 |
5547
5548**错误码:**
5549
5550以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
5551
5552| 错误码ID | 错误信息 |
5553| ------- | --------------------------------------------|
5554| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types; 3. Parameter verification failed. |
5555
5556**示例:**
5557
5558```ts
5559import { drawing } from '@kit.ArkGraphics2D';
5560
5561let font = new drawing.Font();
5562font.setEdging(drawing.FontEdging.SUBPIXEL_ANTI_ALIAS);
5563```
5564
5565### setHinting<sup>12+</sup>
5566
5567setHinting(hinting: FontHinting): void
5568
5569设置字型轮廓效果。
5570
5571**系统能力:** SystemCapability.Graphics.Drawing
5572
5573**参数:**
5574
5575| 参数名   | 类型                          | 必填 | 说明       |
5576| -------- | ----------------------------- | ---- | ---------- |
5577| hinting | [FontHinting](#fonthinting12) | 是   | 字型轮廓效果。 |
5578
5579**错误码:**
5580
5581以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
5582
5583| 错误码ID | 错误信息 |
5584| ------- | --------------------------------------------|
5585| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types; 3. Parameter verification failed. |
5586
5587**示例:**
5588
5589```ts
5590import { drawing } from '@kit.ArkGraphics2D';
5591
5592let font = new drawing.Font();
5593font.setHinting(drawing.FontHinting.FULL);
5594```
5595
5596### countText<sup>12+</sup>
5597
5598countText(text: string): number
5599
5600获取文本所表示的字符数量。
5601
5602**系统能力:** SystemCapability.Graphics.Drawing
5603
5604**参数:**
5605
5606| 参数名   | 类型                          | 必填 | 说明       |
5607| -------- | ----------------------------- | ---- | ---------- |
5608| text     | string                        | 是   | 文本内容。 |
5609
5610**返回值:**
5611
5612| 类型   | 说明             |
5613| ------ | ---------------- |
5614| number | 返回文本所表示的字符数量,整数。 |
5615
5616**错误码:**
5617
5618以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
5619
5620| 错误码ID | 错误信息 |
5621| ------- | --------------------------------------------|
5622| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
5623
5624**示例:**
5625
5626```ts
5627import { drawing } from '@kit.ArkGraphics2D';
5628
5629let font = new drawing.Font();
5630let resultNumber: number = font.countText('ABCDE');
5631console.info("count text number: " + resultNumber);
5632```
5633
5634### setBaselineSnap<sup>12+</sup>
5635
5636setBaselineSnap(isBaselineSnap: boolean): void
5637
5638当前画布矩阵轴对齐时,设置字型基线是否与像素对齐。
5639
5640**系统能力:** SystemCapability.Graphics.Drawing
5641
5642**参数:**
5643
5644| 参数名          | 类型    | 必填 | 说明                                       |
5645| --------------- | ------- | ---- | ---------------------------------------- |
5646| isBaselineSnap | boolean | 是   | 指示字型基线是否和像素对齐,true表示对齐,false表示不对齐。 |
5647
5648**错误码:**
5649
5650以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
5651
5652| 错误码ID | 错误信息 |
5653| ------- | --------------------------------------------|
5654| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
5655
5656**示例:**
5657
5658```ts
5659import { drawing } from '@kit.ArkGraphics2D';
5660
5661let font : drawing.Font = new drawing.Font();
5662font.setBaselineSnap(true);
5663console.info("drawing font isBaselineSnap: " + font.isBaselineSnap());
5664```
5665
5666### isBaselineSnap()<sup>12+</sup>
5667
5668isBaselineSnap(): boolean
5669
5670当前画布矩阵轴对齐时,获取字型基线是否与像素对齐的结果。
5671
5672**系统能力:** SystemCapability.Graphics.Drawing
5673
5674**返回值:**
5675
5676| 类型   | 说明             |
5677| ------ | ---------------- |
5678| boolean | 返回字型基线是否与像素对齐,true为对齐,false为没有对齐。 |
5679
5680**示例:**
5681
5682```ts
5683import { drawing } from '@kit.ArkGraphics2D';
5684
5685let font : drawing.Font = new drawing.Font();
5686font.setTypeface(new drawing.Typeface());
5687font.setBaselineSnap(true);
5688console.info("drawing font isBaselineSnap: " + font.isBaselineSnap());
5689```
5690
5691### setEmbeddedBitmaps<sup>12+</sup>
5692
5693setEmbeddedBitmaps(isEmbeddedBitmaps: boolean): void
5694
5695设置字型是否转换成位图处理。
5696
5697**系统能力:** SystemCapability.Graphics.Drawing
5698
5699**参数:**
5700
5701| 参数名   | 类型   | 必填 | 说明             |
5702| -------- | ------ | ---- | ---------------- |
5703| isEmbeddedBitmaps | boolean | 是   | 设置字型是否转换成位图处理,true表示转换成位图处理,false表示不转换成位图处理。 |
5704
5705**错误码:**
5706
5707以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
5708
5709| 错误码ID | 错误信息 |
5710| ------- | --------------------------------------------|
5711| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
5712
5713**示例:**
5714
5715```ts
5716import { drawing } from '@kit.ArkGraphics2D';
5717
5718let font : drawing.Font = new drawing.Font();
5719font.setTypeface(new drawing.Typeface());
5720font.setEmbeddedBitmaps(false);
5721console.info("draw isEmbeddedBitmaps: " + font.isEmbeddedBitmaps());
5722```
5723
5724### isEmbeddedBitmaps()<sup>12+</sup>
5725
5726isEmbeddedBitmaps(): boolean
5727
5728获取字型是否转换成位图处理的结果。
5729
5730**系统能力:** SystemCapability.Graphics.Drawing
5731
5732**返回值:**
5733
5734| 类型   | 说明             |
5735| ------ | ---------------- |
5736| boolean | 返回字型是否转换成位图处理结果,true表示转换成位图处理,false表示不转换成位图处理。 |
5737
5738**示例:**
5739
5740```ts
5741import { drawing } from '@kit.ArkGraphics2D';
5742
5743let font : drawing.Font = new drawing.Font();
5744font.setTypeface(new drawing.Typeface());
5745font.setEmbeddedBitmaps(true);
5746console.info("draw isEmbeddedBitmaps: " + font.isEmbeddedBitmaps());
5747```
5748
5749### setForceAutoHinting<sup>12+</sup>
5750
5751setForceAutoHinting(isForceAutoHinting: boolean): void
5752
5753设置是否自动调整字型轮廓。
5754
5755**系统能力:** SystemCapability.Graphics.Drawing
5756
5757**参数:**
5758
5759| 参数名   | 类型   | 必填 | 说明             |
5760| -------- | ------ | ---- | ---------------- |
5761| isForceAutoHinting | boolean | 是   | 是否自动调整字型轮廓,true为自动调整,false为不自动调整。 |
5762
5763**错误码:**
5764
5765以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
5766
5767| 错误码ID | 错误信息 |
5768| ------- | --------------------------------------------|
5769| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
5770
5771**示例:**
5772
5773```ts
5774import { drawing } from '@kit.ArkGraphics2D';
5775
5776let font : drawing.Font = new drawing.Font();
5777font.setTypeface(new drawing.Typeface());
5778font.setForceAutoHinting(false);
5779console.info("drawing isForceAutoHinting:  " + font.isForceAutoHinting());
5780```
5781
5782### isForceAutoHinting<sup>12+</sup>
5783
5784isForceAutoHinting(): boolean
5785
5786获取字型轮廓是否自动调整的结果。
5787
5788**系统能力:** SystemCapability.Graphics.Drawing
5789
5790**返回值:**
5791
5792| 类型   | 说明             |
5793| ------ | ---------------- |
5794| boolean | 返回字型轮廓是否自动调整,true为自动调整,false为不自动调整。 |
5795
5796**示例:**
5797
5798```ts
5799import { drawing } from '@kit.ArkGraphics2D';
5800
5801let font : drawing.Font = new drawing.Font();
5802font.setTypeface(new drawing.Typeface());
5803font.setForceAutoHinting(false);
5804console.info("drawing isForceAutoHinting:  " + font.isForceAutoHinting());
5805```
5806
5807### getWidths<sup>12+</sup>
5808
5809getWidths(glyphs: Array\<number>): Array\<number>
5810
5811获取字形数组中每个字形对应的宽度。
5812
5813**系统能力:** SystemCapability.Graphics.Drawing
5814
5815**参数:**
5816
5817| 参数名   | 类型                  | 必填 | 说明   |
5818| -------- | --------------------- | ---- | ------ |
5819| glyphs | Array\<number> | 是   | 字形索引数组,可由[textToGlyphs](#texttoglyphs12)生成。 |
5820
5821**返回值:**
5822
5823| 类型   | 说明             |
5824| ------ | ---------------- |
5825| Array\<number> | 返回字形宽度数组。 |
5826
5827**错误码:**
5828
5829以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
5830
5831| 错误码ID | 错误信息 |
5832| ------- | --------------------------------------------|
5833| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
5834
5835**示例:**
5836
5837```ts
5838import { drawing } from '@kit.ArkGraphics2D';
5839
5840let font: drawing.Font = new drawing.Font();
5841let text: string = 'hello world';
5842let glyphs: number[] = font.textToGlyphs(text);
5843let fontWidths: Array<number> = font.getWidths(glyphs);
5844for (let index = 0; index < fontWidths.length; index++) {
5845  console.info("get fontWidths[", index, "]:", fontWidths[index]);
5846}
5847```
5848
5849### textToGlyphs<sup>12+</sup>
5850
5851textToGlyphs(text: string, glyphCount?: number): Array\<number>
5852
5853将文本转换为字形索引。
5854
5855**系统能力:** SystemCapability.Graphics.Drawing
5856
5857**参数:**
5858
5859| 参数名   | 类型                          | 必填 | 说明       |
5860| -------- | ----------------------------- | ---- | ---------- |
5861| text     | string                        | 是   | 文本字符串。 |
5862| glyphCount | number | 否   | 文本表示的字符数量,必须与[countText](#counttext12)获取的值相等,默认为text的字符数量,该参数为整数。 |
5863
5864**返回值:**
5865
5866| 类型   | 说明             |
5867| ------ | ---------------- |
5868| Array\<number> | 返回转换得到的字形索引数组。 |
5869
5870**错误码:**
5871
5872以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
5873
5874| 错误码ID | 错误信息 |
5875| ------- | --------------------------------------------|
5876| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
5877
5878**示例:**
5879
5880```ts
5881import { drawing } from '@kit.ArkGraphics2D';
5882
5883let font : drawing.Font = new drawing.Font();
5884let text : string = 'hello world';
5885let glyphs : number[] = font.textToGlyphs(text);
5886console.info("drawing text toglyphs OnTestFunction num =  " + glyphs.length );
5887```
5888
5889### getBounds<sup>18+</sup>
5890
5891getBounds(glyphs: Array\<number>): Array\<common2D.Rect>
5892
5893获取字形数组中每个字形的边界矩形。
5894
5895**系统能力:** SystemCapability.Graphics.Drawing
5896
5897**参数:**
5898
5899| 参数名   | 类型                  | 必填 | 说明   |
5900| -------- | --------------------- | ---- | ------ |
5901| glyphs | Array\<number> | 是   | 字形索引数组,可由[textToGlyphs](#texttoglyphs12)生成。 |
5902
5903**返回值:**
5904
5905| 类型   | 说明             |
5906| ------ | ---------------- |
5907| Array\<[common2D.Rect](js-apis-graphics-common2D.md#rect)> | 返回字形边界矩形数组。 |
5908
5909**示例:**
5910
5911```ts
5912import { common2D, drawing } from '@kit.ArkGraphics2D';
5913
5914let font: drawing.Font = new drawing.Font();
5915let text: string = 'hello world';
5916let glyphs: number[] = font.textToGlyphs(text);
5917let fontBounds: Array<common2D.Rect> = font.getBounds(glyphs);
5918for (let index = 0; index < fontBounds.length; index++) {
5919  console.info("get fontWidths[", index, "] left:", fontBounds[index].left, " top:", fontBounds[index].top,
5920    " right:", fontBounds[index].right, " bottom:", fontBounds[index].bottom);
5921}
5922```
5923
5924### getTextPath<sup>18+</sup>
5925
5926getTextPath(text: string, byteLength: number, x: number, y: number): Path;
5927
5928获取文字的轮廓路径。
5929
5930**系统能力:** SystemCapability.Graphics.Drawing
5931
5932**参数:**
5933
5934| 参数名    | 类型                                               | 必填 | 说明                    |
5935| ------   | ------------------------------------------------   | ---- | ---------------------- |
5936|   text   |    string                                          | 是   | 表示存储UTF-8 文本编码的字符。|
5937|byteLength|    number                                          | 是   | 表示要获取对应文本路径的字节长度,按传入的字节长度和实际的文本字节大小之间的最小值来获取对应的文本路径。|
5938|    x     |    number                                          | 是   | 表示文本在绘图区域内以原点为起始位置的X坐标。|
5939|    y     |    number                                          | 是   | 表示文本在绘图区域内以原点为起始位置的Y坐标。|
5940
5941**返回值:**
5942
5943| 类型   | 说明             |
5944| ------ | ---------------- |
5945| [Path](#path) | 返回获取到的文本的路径轮廓。 |
5946
5947**错误码:**
5948
5949以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
5950
5951| 错误码ID | 错误信息 |
5952| ------- | --------------------------------------------|
5953| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
5954
5955**示例:**
5956
5957```ts
5958import { drawing } from '@kit.ArkGraphics2D';
5959import { buffer } from '@kit.ArkTS';
5960import { RenderNode } from '@kit.ArkUI';
5961
5962class DrawingRenderNode extends RenderNode {
5963  draw(context : DrawContext) {
5964    const canvas = context.canvas;
5965    let font = new drawing.Font();
5966    font.setSize(50)
5967    let myString: string = "你好, HarmonyOS";
5968    let length = buffer.from(myString).length;
5969    let path = font.getTextPath(myString, length, 0, 100)
5970    canvas.drawPath(path)
5971  }
5972}
5973```
5974
5975### createPathForGlyph<sup>18+</sup>
5976
5977createPathForGlyph(index: number): Path
5978
5979获取指定字形的路径轮廓。
5980
5981**系统能力:** SystemCapability.Graphics.Drawing
5982
5983**参数:**
5984
5985| 参数名   | 类型                  | 必填 | 说明   |
5986| -------- | --------------------- | ---- | ------ |
5987| index | number | 是   | 字形索引。 |
5988
5989**返回值:**
5990
5991| 类型   | 说明             |
5992| ------ | ---------------- |
5993| [Path](#path) | 返回指定字形的路径轮廓。 |
5994
5995**示例:**
5996
5997```ts
5998import { FrameNode, NodeController, RenderNode } from '@kit.ArkUI';
5999import { drawing } from '@kit.ArkGraphics2D';
6000
6001class DrawingRenderNode extends RenderNode {
6002  draw(context : DrawContext) {
6003    const canvas = context.canvas;
6004    let font = new drawing.Font();
6005    font.setSize(50)
6006    let text: string = '你好';
6007    let glyphs: number[] = font.textToGlyphs(text);
6008    for (let index = 0; index < glyphs.length; index++) {
6009      let path: drawing.Path = font.createPathForGlyph(glyphs[index])
6010      canvas.drawPath(path)
6011    }
6012  }
6013}
6014```
6015
6016### setThemeFontFollowed<sup>15+</sup>
6017
6018setThemeFontFollowed(followed: boolean): void
6019
6020设置字型中的字体是否跟随主题字体。设置跟随主题字体后,若系统启用主题字体并且字型未被设置字体,字型会使用该主题字体。
6021
6022**系统能力:** SystemCapability.Graphics.Drawing
6023
6024**参数:**
6025
6026| 参数名   | 类型   | 必填 | 说明             |
6027| -------- | ------ | ---- | ---------------- |
6028| followed | boolean | 是   | 字型中的字体是否跟随主题字体,true表示跟随主题字体,false表示不跟随主题字体。 |
6029
6030**错误码:**
6031
6032以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
6033
6034| 错误码ID | 错误信息 |
6035| ------- | --------------------------------------------|
6036| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
6037
6038**示例:**
6039
6040```ts
6041import { drawing } from '@kit.ArkGraphics2D';
6042
6043let font : drawing.Font = new drawing.Font();
6044font.setThemeFontFollowed(true);
6045console.info("font is theme font followed: " + font.isThemeFontFollowed());
6046```
6047
6048### isThemeFontFollowed()<sup>15+</sup>
6049
6050isThemeFontFollowed(): boolean
6051
6052获取字型中的字体是否跟随主题字体。默认不跟随。
6053
6054**系统能力:** SystemCapability.Graphics.Drawing
6055
6056**返回值:**
6057
6058| 类型   | 说明             |
6059| ------ | ---------------- |
6060| boolean | 返回字型中的字体是否跟随主题字体的结果,true表示跟随主题字体,false表示不跟随主题字体。 |
6061
6062**示例:**
6063
6064```ts
6065import { drawing } from '@kit.ArkGraphics2D';
6066
6067let font : drawing.Font = new drawing.Font();
6068font.setThemeFontFollowed(true);
6069console.info("font is theme font followed: " + font.isThemeFontFollowed());
6070```
6071
6072## FontMetricsFlags<sup>12+</sup>
6073
6074字体度量标志枚举,指示字体度量中的各字段数据是否有效。
6075
6076**系统能力:** SystemCapability.Graphics.Drawing
6077
6078| 名称                          | 值        | 说明                           |
6079| ----------------------------- | --------- | ------------------------------ |
6080| UNDERLINE_THICKNESS_VALID     | 1 << 0    | 表示[FontMetrics](#fontmetrics)结构中的underlineThickness(下划线厚度)字有效。    |
6081| UNDERLINE_POSITION_VALID      | 1 << 1    | 表示[FontMetrics](#fontmetrics)结构中的underlinePosition(下划线位置)字段有效。  |
6082| STRIKETHROUGH_THICKNESS_VALID | 1 << 2    | 表示[FontMetrics](#fontmetrics)结构中strikethroughThickness(删除线厚度)是有效的。|
6083| STRIKETHROUGH_POSITION_VALID  | 1 << 3    | 表示[FontMetrics](#fontmetrics)结构中strikethroughPosition(删除线位置)字段有效。  |
6084| BOUNDS_INVALID                | 1 << 4    | 表示[FontMetrics](#fontmetrics)结构中的边界度量值(如top、bottom、xMin、xMax)无效。  |
6085
6086## FontMetrics
6087
6088描述字形大小和布局的属性信息,同一种字体中的字符属性大致相同。
6089
6090**系统能力:** SystemCapability.Graphics.Drawing
6091
6092| 名称    | 类型   | 只读 | 可选 | 说明                                                         |
6093| ------- | ------ | ---- | ---- | ------------------------------------------------------------ |
6094| flags<sup>12+</sup>   | [FontMetricsFlags](#fontmetricsflags12) | 否   | 是   | 表明哪些字体度量标志有效。        |
6095| top     | number | 否   | 否   | 文字最高处到基线之间的最大距离,浮点数。                         |
6096| ascent  | number | 否   | 否   | 文字最高处到基线之间的距离,浮点数。                             |
6097| descent | number | 否   | 否   | 基线到文字最低处之间的距离,浮点数。                             |
6098| bottom  | number | 否   | 否   | 基线到文字最低处之间的最大距离,浮点数。                         |
6099| leading | number | 否   | 否   | 行间距,从上一行文字descent到下一行文字ascent之间的距离,浮点数。 |
6100| avgCharWidth<sup>12+</sup> | number | 否   | 是   | 平均字符宽度。                             |
6101| maxCharWidth<sup>12+</sup> | number | 否   | 是   | 最大字符宽度。                             |
6102| xMin<sup>12+</sup> | number | 否    | 是   | 字体中任意字形边界框最左边沿到原点的水平距离,这个值往往小于零,意味着字形在水平方向上的最小边界。                |
6103| xMax<sup>12+</sup> | number | 否   | 是   | 字体中任意字形边界框最右边沿到原点的水平距离,此值多为正数,指示了字形在水平方向上的最大延伸范围。        |
6104| xHeight<sup>12+</sup> | number | 否   | 是   | 小写字母x的高度,通常为负值。                     |
6105| capHeight<sup>12+</sup> | number | 否   | 是   | 大写字母的高度,通常为负值。                      |
6106| underlineThickness<sup>12+</sup> | number | 否   | 是   | 下划线的厚度。                                          |
6107| underlinePosition<sup>12+</sup>  | number | 否   | 是   | 文本基线到下划线顶部的垂直距离,通常是正数。             |
6108| strikethroughThickness<sup>12+</sup>  | number | 否   | 是   | 文本删除线的厚度,即贯穿文本字符的水平线的宽度。    |
6109| strikethroughPosition<sup>12+</sup>  | number | 否   | 是   | 文本基线到底部删除线的垂直距离,通常为负值。         |
6110
6111## ColorFilter
6112
6113颜色滤波器。
6114
6115### createBlendModeColorFilter
6116
6117createBlendModeColorFilter(color: common2D.Color, mode: BlendMode) : ColorFilter
6118
6119创建指定的颜色和混合模式的颜色滤波器。
6120
6121**系统能力:** SystemCapability.Graphics.Drawing
6122
6123**参数:**
6124
6125| 参数名 | 类型                                                 | 必填 | 说明             |
6126| ------ | ---------------------------------------------------- | ---- | ---------------- |
6127| color  | [common2D.Color](js-apis-graphics-common2D.md#color) | 是   | ARGB格式的颜色,每个颜色通道的值是0到255之间的整数。 |
6128| mode   | [BlendMode](#blendmode)                              | 是   | 颜色的混合模式。 |
6129
6130**返回值:**
6131
6132| 类型                        | 说明               |
6133| --------------------------- | ------------------ |
6134| [ColorFilter](#colorfilter) | 返回颜色滤波器。 |
6135
6136**错误码:**
6137
6138以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
6139
6140| 错误码ID | 错误信息 |
6141| ------- | --------------------------------------------|
6142| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
6143
6144**示例:**
6145
6146```ts
6147import { common2D, drawing } from '@kit.ArkGraphics2D';
6148
6149const color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 };
6150let colorFilter = drawing.ColorFilter.createBlendModeColorFilter(color, drawing.BlendMode.SRC);
6151```
6152
6153### createBlendModeColorFilter<sup>18+</sup>
6154
6155static createBlendModeColorFilter(color: common2D.Color | number, mode: BlendMode) : ColorFilter
6156
6157使用指定的颜色和混合模式创建颜色滤波器。
6158
6159**系统能力:** SystemCapability.Graphics.Drawing
6160
6161**参数:**
6162
6163| 参数名 | 类型                                                 | 必填 | 说明             |
6164| ------ | ---------------------------------------------------- | ---- | ---------------- |
6165| color  | [common2D.Color](js-apis-graphics-common2D.md#color) \| number | 是   | 颜色,可以用16进制ARGB格式的无符号整数表示。 |
6166| mode   | [BlendMode](#blendmode)                              | 是   | 颜色的混合模式。 |
6167
6168**返回值:**
6169
6170| 类型                        | 说明               |
6171| --------------------------- | ------------------ |
6172| [ColorFilter](#colorfilter) | 返回颜色滤波器。 |
6173
6174**错误码:**
6175
6176以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
6177
6178| 错误码ID | 错误信息 |
6179| ------- | --------------------------------------------|
6180| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
6181
6182**示例:**
6183
6184```ts
6185import { drawing } from '@kit.ArkGraphics2D';
6186
6187let colorFilter = drawing.ColorFilter.createBlendModeColorFilter(0xffff0000, drawing.BlendMode.SRC);
6188```
6189
6190### createComposeColorFilter
6191
6192createComposeColorFilter(outer: ColorFilter, inner: ColorFilter) : ColorFilter
6193
6194创建一个先应用inner进行滤波,再应用outer进行滤波的组合颜色滤波器。
6195
6196**系统能力:** SystemCapability.Graphics.Drawing
6197
6198**参数:**
6199
6200| 参数名 | 类型                        | 必填 | 说明                             |
6201| ------ | --------------------------- | ---- | -------------------------------- |
6202| outer  | [ColorFilter](#colorfilter) | 是   | 组合滤波器中后生效的颜色滤波器。 |
6203| inner  | [ColorFilter](#colorfilter) | 是   | 组合滤波器中先生效的颜色滤波器。 |
6204
6205**返回值:**
6206
6207| 类型                        | 说明               |
6208| --------------------------- | ------------------ |
6209| [ColorFilter](#colorfilter) | 返回颜色滤波器。 |
6210
6211**错误码:**
6212
6213以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
6214
6215| 错误码ID | 错误信息 |
6216| ------- | --------------------------------------------|
6217| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
6218
6219**示例:**
6220
6221```ts
6222import { common2D, drawing } from '@kit.ArkGraphics2D';
6223
6224const color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 };
6225let colorFilter1 = drawing.ColorFilter.createBlendModeColorFilter(color, drawing.BlendMode.SRC);
6226let colorFilter2 = drawing.ColorFilter.createBlendModeColorFilter(color, drawing.BlendMode.DST);
6227let colorFilter = drawing.ColorFilter.createComposeColorFilter(colorFilter1, colorFilter2);
6228```
6229
6230### createLinearToSRGBGamma
6231
6232createLinearToSRGBGamma() : ColorFilter
6233
6234创建一个从线性颜色空间转换到SRGB颜色空间的颜色滤波器。
6235
6236**系统能力:** SystemCapability.Graphics.Drawing
6237
6238**返回值:**
6239
6240| 类型                        | 说明               |
6241| --------------------------- | ------------------ |
6242| [ColorFilter](#colorfilter) | 返回颜色滤波器。 |
6243
6244**示例:**
6245
6246```ts
6247import { drawing } from '@kit.ArkGraphics2D';
6248
6249let colorFilter = drawing.ColorFilter.createLinearToSRGBGamma();
6250```
6251
6252### createSRGBGammaToLinear
6253
6254createSRGBGammaToLinear() : ColorFilter
6255
6256创建一个从SRGB颜色空间转换到线性颜色空间的颜色滤波器。
6257
6258**系统能力:** SystemCapability.Graphics.Drawing
6259
6260**返回值:**
6261
6262| 类型                        | 说明               |
6263| --------------------------- | ------------------ |
6264| [ColorFilter](#colorfilter) | 返回颜色滤波器。 |
6265
6266**示例:**
6267
6268```ts
6269import { drawing } from '@kit.ArkGraphics2D';
6270
6271let colorFilter = drawing.ColorFilter.createSRGBGammaToLinear();
6272```
6273
6274### createLumaColorFilter
6275
6276createLumaColorFilter() : ColorFilter
6277
6278创建一个颜色滤波器将其输入的亮度值乘以透明度通道,并将红色、绿色和蓝色通道设置为零。
6279
6280**系统能力:** SystemCapability.Graphics.Drawing
6281
6282**返回值:**
6283
6284| 类型                        | 说明               |
6285| --------------------------- | ------------------ |
6286| [ColorFilter](#colorfilter) | 返回颜色滤波器。 |
6287
6288**示例:**
6289
6290```ts
6291import { drawing } from '@kit.ArkGraphics2D';
6292
6293let colorFilter = drawing.ColorFilter.createLumaColorFilter();
6294```
6295
6296### createMatrixColorFilter<sup>12+</sup>
6297
6298static createMatrixColorFilter(matrix: Array\<number>): ColorFilter
6299
6300创建颜色滤波器,通过4x5颜色矩阵变换颜色。
6301
6302**系统能力:** SystemCapability.Graphics.Drawing
6303
6304**参数:**
6305
6306| 参数名   | 类型                                         | 必填 | 说明                            |
6307| -------- | -------------------------------------------- | ---- | ------------------------------- |
6308| matrix | Array\<number> | 是   | 长度为20的数组,表示用于颜色变换的4*5矩阵。                 |
6309
6310**返回值:**
6311
6312| 类型                        | 说明               |
6313| --------------------------- | ------------------ |
6314| [ColorFilter](#colorfilter) | 返回颜色滤波器。 |
6315
6316**错误码:**
6317
6318以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
6319
6320| 错误码ID | 错误信息 |
6321| ------- | --------------------------------------------|
6322| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
6323
6324**示例:**
6325
6326```ts
6327import { drawing } from '@kit.ArkGraphics2D';
6328
6329let matrix: Array<number> = [
6330  1, 0, 0, 0, 0,
6331  0, 1, 0, 0, 0,
6332  0, 0, 100, 0, 0,
6333  0, 0, 0, 1, 0
6334];
6335let colorFilter = drawing.ColorFilter.createMatrixColorFilter(matrix);
6336```
6337### createLightingColorFilter<sup>20+</sup>
6338
6339static createLightingColorFilter(mutColor: common2D.Color | number, addColor: common2D.Color | number): ColorFilter
6340
6341创建一个光照颜色滤波器,此滤波器会将RGB通道的颜色值乘以一种颜色值并加上另一种颜色值,计算结果会被限制在0到255范围内。
6342
6343**系统能力:** SystemCapability.Graphics.Drawing
6344
6345**参数:**
6346
6347| 参数名   | 类型                                         | 必填 | 说明                            |
6348| -------- | -------------------------------------------- | ---- | ------------------------------- |
6349| mutColor | [common2D.Color](js-apis-graphics-common2D.md#color) \| number | 是   | 用来进行乘法运算的颜色,ARGB格式的颜色,每个颜色通道是0到255之间的整数。为number类型时必须是16进制ARGB格式的无符号整数。 |
6350| addColor | [common2D.Color](js-apis-graphics-common2D.md#color) \| number | 是   | 用来进行加法运算的颜色,ARGB格式的颜色,每个颜色通道是0到255之间的整数。为number类型时必须是16进制ARGB格式的无符号整数。 |
6351
6352**返回值:**
6353
6354| 类型                        | 说明                |
6355| --------------------------- | ------------------ |
6356| [ColorFilter](#colorfilter) | 返回一个颜色滤波器。 |
6357
6358**示例:**
6359
6360```ts
6361import { common2D, drawing } from '@kit.ArkGraphics2D';
6362let mulColor : common2D.Color = { alpha: 0, red: 0, green: 0, blue: 20 };
6363let addColor : common2D.Color = { alpha: 0, red: 0, green: 0, blue: 125 };
6364let colorFilter = drawing.ColorFilter.createLightingColorFilter(mulColor, addColor);
6365```
6366## JoinStyle<sup>12+</sup>
6367
6368定义线条转角样式的枚举,即画笔在绘制折线段时,在折线转角处的样式。
6369
6370**系统能力:** SystemCapability.Graphics.Drawing
6371
6372| 名称        | 值   | 说明                                                         | 示意图   |
6373| ----------- | ---- | ----------------------------------------------------------- | -------- |
6374| MITER_JOIN | 0    | 转角类型为尖角,如果折线角度比较小,则尖角会很长,需要使用限制值(miter limit)进行限制。 | ![MITER_JOIN](./figures/zh-ch_image_JoinStyle_Miter_Join.png) |
6375| ROUND_JOIN | 1    | 转角类型为圆头。 | ![ROUND_JOIN](./figures/zh-ch_image_JoinStyle_Round_Join.png) |
6376| BEVEL_JOIN | 2    | 转角类型为平头。 | ![BEVEL_JOIN](./figures/zh-ch_image_JoinStyle_Bevel_Join.png) |
6377
6378## CapStyle<sup>12+</sup>
6379
6380定义线帽样式的枚举,即画笔在绘制线段时,在线段头尾端点的样式。
6381
6382**系统能力:** SystemCapability.Graphics.Drawing
6383
6384| 名称        | 值   | 说明                                                         | 示意图   |
6385| ---------- | ---- | ----------------------------------------------------------- | -------- |
6386| FLAT_CAP   | 0    | 没有线帽样式,线条头尾端点处横切。 | ![FLAT_CAP](./figures/zh-ch_image_CapStyle_Flat_Cap.jpg) |
6387| SQUARE_CAP | 1    | 线帽的样式为方框,线条的头尾端点处多出一个方框,方框宽度和线段一样宽,高度是线段宽度的一半。 | ![SQUARE_CAP](./figures/zh-ch_image_CapStyle_Square_Cap.jpg) |
6388| ROUND_CAP  | 2    | 线帽的样式为圆弧,线条的头尾端点处多出一个半圆弧,半圆的直径与线段宽度一致。 | ![ROUND_CAP](./figures/zh-ch_image_CapStyle_Round_Cap.jpg) |
6389
6390## BlurType<sup>12+</sup>
6391
6392定义蒙版滤镜模糊中操作类型的枚举。
6393
6394**系统能力:** SystemCapability.Graphics.Drawing
6395
6396| 名称   | 值 | 说明               | 示意图   |
6397| ------ | - | ------------------ | -------- |
6398| NORMAL | 0 | 全面模糊,外圈边缘和内部实体一起模糊。 | ![NORMAL](./figures/zh-ch_image_BlueType_Normal.png) |
6399| SOLID  | 1 | 内部实体不变,只模糊外圈边缘部分。 | ![SOLID](./figures/zh-ch_image_BlueType_Solid.png) |
6400| OUTER  | 2 | 只有外圈边缘模糊,内部实体完全透明。 | ![OUTER](./figures/zh-ch_image_BlueType_Outer.png) |
6401| INNER  | 3 | 只有内部实体模糊,外圈边缘清晰。 | ![INNER](./figures/zh-ch_image_BlueType_Inner.png) |
6402
6403## SamplingOptions<sup>12+</sup>
6404
6405采样选项对象。
6406
6407### constructor<sup>12+</sup>
6408
6409constructor()
6410
6411构造一个新的采样选项对象,[FilterMode](#filtermode12)的默认值为FILTER_MODE_NEAREST。
6412
6413**系统能力:** SystemCapability.Graphics.Drawing
6414
6415**示例:**
6416
6417```ts
6418import { RenderNode } from '@kit.ArkUI';
6419import { common2D, drawing } from '@kit.ArkGraphics2D';
6420
6421class DrawingRenderNode extends RenderNode {
6422  draw(context : DrawContext) {
6423    const canvas = context.canvas;
6424    const pen = new drawing.Pen();
6425    let samplingOptions = new drawing.SamplingOptions();
6426  }
6427}
6428```
6429
6430### constructor<sup>12+</sup>
6431
6432constructor(filterMode: FilterMode)
6433
6434构造一个新的采样选项对象。
6435
6436**系统能力:** SystemCapability.Graphics.Drawing
6437
6438**参数:**
6439
6440| 参数名     | 类型                   | 必填 | 说明                                 |
6441| ---------- | --------------------- | ---- | ----------------------------------- |
6442| filterMode | [FilterMode](#filtermode12)    | 是   | 过滤模式。                    |
6443
6444**错误码:**
6445
6446以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
6447
6448| 错误码ID | 错误信息 |
6449| ------- | --------------------------------------------|
6450| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
6451
6452**示例:**
6453
6454```ts
6455import { RenderNode } from '@kit.ArkUI';
6456import { common2D, drawing } from '@kit.ArkGraphics2D';
6457
6458class DrawingRenderNode extends RenderNode {
6459  draw(context : DrawContext) {
6460    const canvas = context.canvas;
6461    let samplingOptions = new drawing.SamplingOptions(drawing.FilterMode.FILTER_MODE_NEAREST);
6462  }
6463}
6464```
6465
6466## Lattice<sup>12+</sup>
6467
6468矩形网格对象。该对象用于将图片按照矩形网格进行划分。
6469
6470### createImageLattice<sup>12+</sup>
6471
6472static createImageLattice(xDivs: Array\<number>, yDivs: Array\<number>, fXCount: number, fYCount: number, fBounds?: common2D.Rect | null, fRectTypes?: Array\<RectType> | null, fColors?: Array\<common2D.Color> | null): Lattice
6473
6474创建矩形网格对象。将图像划分为矩形网格,同时处于偶数列和偶数行上的网格是固定的,如果目标网格足够大,则这些固定网格以其原始大小进行绘制。如果目标网格太小,无法容纳这些固定网格,则所有固定网格都会按比例缩小以适应目标网格。其余网格将进行缩放,来适应剩余的空间。
6475
6476**系统能力:** SystemCapability.Graphics.Drawing
6477
6478**参数:**
6479
6480| 参数名       | 类型                                                                | 必填 | 说明                                                                               |
6481| ------------ | ------------------------------------------------------------------ | ---- | --------------------------------------------------------------------------------- |
6482| xDivs        | Array\<number>                                                     | 是   | 用于划分图像的X坐标值数组。该参数为整数。                                             |
6483| yDivs        | Array\<number>                                                     | 是   | 用于划分图像的Y坐标值数组。该参数为整数。                                             |
6484| fXCount      | number                                                             | 是   | X坐标值数组的大小。基于功能和性能的考虑,取值范围为[0, 5]。                            |
6485| fYCount      | number                                                             | 是   | Y坐标值数组的大小。基于功能和性能的考虑,取值范围为[0, 5]。                            |
6486| fBounds      | [common2D.Rect](js-apis-graphics-common2D.md#rect)\|null           | 否   | 可选,要绘制的原始边界矩形,矩形参数须为整数,默认为原始图像矩形大小(若矩形参数为小数,会直接舍弃小数部分,转为整数)。 |
6487| fRectTypes   | Array\<[RectType](#recttype12)>\|null                              | 否   | 可选,填充网格类型的数组,默认为空。如果设置,大小必须为(fXCount + 1) * (fYCount + 1)。 |
6488| fColors      | Array\<[common2D.Color](js-apis-graphics-common2D.md#color)>\|null | 否   | 可选,填充网格的颜色数组,默认为空。如果设置,大小必须为(fXCount + 1) * (fYCount + 1)。 |
6489
6490**返回值:**
6491
6492| 类型                       | 说明                                |
6493| ------------------------- | ----------------------------------- |
6494| [Lattice](#lattice12)     | 返回创建的矩形网格对象。              |
6495
6496**错误码:**
6497
6498以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
6499
6500| 错误码ID | 错误信息 |
6501| ------- | --------------------------------------------|
6502| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
6503
6504**示例:**
6505
6506```ts
6507import { RenderNode } from '@kit.ArkUI';
6508import { drawing } from '@kit.ArkGraphics2D';
6509
6510class DrawingRenderNode extends RenderNode {
6511  draw(context : DrawContext) {
6512    let xDivs : Array<number> = [1, 2, 4];
6513    let yDivs : Array<number> = [1, 2, 4];
6514    let lattice = drawing.Lattice.createImageLattice(xDivs, yDivs, 3, 3); // 划分(3+1)*(3+1)的网格,下图蓝色填充矩形为固定网格
6515  }
6516}
6517```
6518![zh-ch_Lattice.png](figures/zh-ch_Lattice.png)
6519
6520### createImageLattice<sup>18+</sup>
6521
6522static createImageLattice(xDivs: Array\<number>, yDivs: Array\<number>, fXCount: number, fYCount: number, fBounds?: common2D.Rect | null, fRectTypes?: Array\<RectType> | null, fColors?: Array\<number> | null): Lattice
6523
6524创建矩形网格对象。将图像划分为矩形网格,同时处于偶数列和偶数行上的网格是固定的,如果目标网格足够大,则这些固定网格以其原始大小进行绘制。如果目标网格太小,无法容纳这些固定网格,则所有固定网格都会按比例缩小以适应目标网格。其余网格将进行缩放,来适应剩余的空间。
6525
6526**系统能力:** SystemCapability.Graphics.Drawing
6527
6528**参数:**
6529
6530| 参数名       | 类型                                                                | 必填 | 说明                                                                               |
6531| ------------ | ------------------------------------------------------------------ | ---- | --------------------------------------------------------------------------------- |
6532| xDivs        | Array\<number>                                                     | 是   | 用于划分图像的X坐标值数组。该参数为整数。                                             |
6533| yDivs        | Array\<number>                                                     | 是   | 用于划分图像的Y坐标值数组。该参数为整数。                                             |
6534| fXCount      | number                                                             | 是   | X坐标值数组的大小。基于功能和性能的考虑,取值范围为[0, 5]。                            |
6535| fYCount      | number                                                             | 是   | Y坐标值数组的大小。基于功能和性能的考虑,取值范围为[0, 5]。                            |
6536| fBounds      | [common2D.Rect](js-apis-graphics-common2D.md#rect)\|null           | 否   | 可选,要绘制的原始边界矩形,矩形参数须为整数,默认为原始图像矩形大小(若矩形参数为小数,会直接舍弃小数部分,转为整数)。 |
6537| fRectTypes   | Array\<[RectType](#recttype12)>\|null                              | 否   | 可选,填充网格类型的数组,默认为空。如果设置,大小必须为(fXCount + 1) * (fYCount + 1)。 |
6538| fColors      | Array\<number>\|null | 否   | 可选,填充网格的颜色数组,颜色用16进制ARGB格式的32位无符号整数表示,参数默认为空。如果设置,大小必须为(fXCount + 1) * (fYCount + 1)。 |
6539
6540**返回值:**
6541
6542| 类型                       | 说明                                |
6543| ------------------------- | ----------------------------------- |
6544| [Lattice](#lattice12)     | 返回创建的矩形网格对象。              |
6545
6546**错误码:**
6547
6548以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
6549
6550| 错误码ID | 错误信息 |
6551| ------- | --------------------------------------------|
6552| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
6553
6554**示例:**
6555
6556```ts
6557import { RenderNode } from '@kit.ArkUI';
6558import { drawing } from '@kit.ArkGraphics2D';
6559
6560class DrawingRenderNode extends RenderNode {
6561  draw(context : DrawContext) {
6562    let xDivs : Array<number> = [1, 2, 4];
6563    let yDivs : Array<number> = [1, 2, 4];
6564    let colorArray :Array<number>=[0xffffffff,0x44444444,0x99999999,0xffffffff,0x44444444,0x99999999,0xffffffff,0x44444444,0x99999999,0x44444444,0x99999999,0xffffffff,0x44444444,0x99999999,0xffffffff,0x44444444];
6565    let lattice = drawing.Lattice.createImageLattice(xDivs, yDivs, 3, 3,null,null,colorArray);
6566  }
6567}
6568```
6569
6570## RectType<sup>12+</sup>
6571
6572定义填充网格的矩形类型的枚举。仅在[Lattice](#lattice12)中使用。
6573
6574**系统能力:** SystemCapability.Graphics.Drawing
6575
6576| 名称         | 值   | 说明                                                             |
6577| ------------ | ---- | --------------------------------------------------------------- |
6578| DEFAULT      | 0    | 将图像绘制到矩形网格中。                                          |
6579| TRANSPARENT  | 1    | 将矩形网格设置为透明的。                                          |
6580| FIXEDCOLOR   | 2    | 将[Lattice](#lattice12)中fColors数组的颜色绘制到矩形网格中。       |
6581
6582## MaskFilter<sup>12+</sup>
6583
6584蒙版滤镜对象。
6585
6586### createBlurMaskFilter<sup>12+</sup>
6587
6588static createBlurMaskFilter(blurType: BlurType, sigma: number): MaskFilter
6589
6590创建具有模糊效果的蒙版滤镜。
6591
6592**系统能力:** SystemCapability.Graphics.Drawing
6593
6594**参数:**
6595
6596| 参数名     | 类型                   | 必填 | 说明                                 |
6597| ---------- | --------------------- | ---- | ----------------------------------- |
6598| blurType   | [BlurType](#blurtype12) | 是   | 模糊类型。                           |
6599| sigma      | number                | 是   | 高斯模糊的标准偏差,必须为大于0的浮点数。 |
6600
6601**返回值:**
6602
6603| 类型                      | 说明                |
6604| ------------------------- | ------------------ |
6605| [MaskFilter](#maskfilter12) | 返回创建的蒙版滤镜对象。 |
6606
6607**错误码:**
6608
6609以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
6610
6611| 错误码ID | 错误信息 |
6612| ------- | --------------------------------------------|
6613| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
6614
6615**示例:**
6616
6617```ts
6618import { RenderNode } from '@kit.ArkUI';
6619import { common2D, drawing } from '@kit.ArkGraphics2D';
6620
6621class DrawingRenderNode extends RenderNode {
6622  draw(context : DrawContext) {
6623    const canvas = context.canvas;
6624    let maskFilter = drawing.MaskFilter.createBlurMaskFilter(drawing.BlurType.OUTER, 10);
6625  }
6626}
6627```
6628
6629## PathDashStyle<sup>18+</sup>
6630
6631路径效果的绘制样式枚举。
6632
6633**系统能力:** SystemCapability.Graphics.Drawing
6634
6635| 名称   | 值 | 说明               |
6636| ------ | - | ------------------ |
6637| TRANSLATE | 0 | 不会随着路径旋转,只会平移。 |
6638| ROTATE  | 1 | 随着路径的旋转而旋转。 |
6639| MORPH  | 2 | 随着路径的旋转而旋转,并在转折处进行拉伸或压缩等操作以增加平滑度。 |
6640
6641## PathEffect<sup>12+</sup>
6642
6643路径效果对象。
6644
6645### createDashPathEffect<sup>12+</sup>
6646
6647static createDashPathEffect(intervals:  Array\<number>, phase: number): PathEffect
6648
6649创建将路径变为虚线的路径效果对象。
6650
6651**系统能力:** SystemCapability.Graphics.Drawing
6652
6653**参数:**
6654
6655| 参数名     | 类型           | 必填    | 说明                                               |
6656| ---------- | ------------- | ------- | -------------------------------------------------- |
6657| intervals  | Array\<number> | 是      | 表示虚线的ON和OFF长度的数组,数组个数必须是偶数,且>=2,该参数为正整数。|
6658| phase      | number         | 是      | 绘制时的偏移量,该参数为浮点数。                                     |
6659
6660**返回值:**
6661
6662| 类型                      | 说明                   |
6663| ------------------------- | --------------------- |
6664| [PathEffect](#patheffect12) | 返回创建的路径效果对象。 |
6665
6666**错误码:**
6667
6668以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
6669
6670| 错误码ID | 错误信息 |
6671| ------- | --------------------------------------------|
6672| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
6673
6674**示例:**
6675
6676```ts
6677import { RenderNode } from '@kit.ArkUI';
6678import { common2D, drawing } from '@kit.ArkGraphics2D';
6679
6680class DrawingRenderNode extends RenderNode {
6681  draw(context : DrawContext) {
6682    const canvas = context.canvas;
6683    let intervals = [10, 5];
6684    let effect = drawing.PathEffect.createDashPathEffect(intervals, 5);
6685  }
6686}
6687```
6688
6689### createPathDashEffect<sup>18+</sup>
6690
6691static createPathDashEffect(path: Path, advance: number, phase: number, style: PathDashStyle): PathEffect
6692
6693通过路径描述的形状创建一个虚线路径效果。
6694
6695**系统能力:** SystemCapability.Graphics.Drawing
6696
6697**参数:**
6698
6699| 参数名     | 类型           | 必填    | 说明                                               |
6700| ---------- | ------------- | ------- | -------------------------------------------------- |
6701| path  | [Path](#path) | 是 | 通过该路径生成一个图形,用来填充每个虚线段。|
6702| advance | number | 是 | 虚线段的步长,该参数为大于0的浮点数,否则会抛错误码。 |
6703| phase | number | 是 | 表示虚线段内图形在虚线步长范围内的偏移量,该参数为浮点数,效果为先对偏移量取绝对值,然后对步长取模。 |
6704| style | [PathDashStyle](#pathdashstyle18) | 是 | 指定虚线效果的样式。 |
6705
6706**返回值:**
6707
6708| 类型                      | 说明                   |
6709| ------------------------- | --------------------- |
6710| [PathEffect](#patheffect12) | 返回创建的路径效果对象。 |
6711
6712**错误码:**
6713
6714以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
6715
6716| 错误码ID | 错误信息 |
6717| ------- | --------------------------------------------|
6718| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3. Parameter verification failed. |
6719
6720**示例:**
6721
6722```ts
6723import { RenderNode } from '@kit.ArkUI';
6724import { common2D, drawing } from '@kit.ArkGraphics2D';
6725
6726class DrawingRenderNode extends RenderNode {
6727  draw(context : DrawContext) {
6728    const canvas = context.canvas;
6729    let pen = new drawing.Pen();
6730    const penColor: common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 }
6731    pen.setColor(penColor);
6732    pen.setStrokeWidth(10);
6733    canvas.attachPen(pen);
6734    pen.setAntiAlias(true);
6735
6736    const path = new drawing.Path();
6737    path.moveTo(100, 100);
6738    path.lineTo(150, 50);
6739    path.lineTo(200, 100);
6740
6741    const path1 = new drawing.Path();
6742    path1.moveTo(0, 0);
6743    path1.lineTo(10, 0);
6744    path1.lineTo(20, 10);
6745    path1.lineTo(0,10);
6746
6747    let pathEffect1: drawing.PathEffect = drawing.PathEffect.createPathDashEffect(path1, 50, -30,
6748        drawing.PathDashStyle.MORPH);
6749    pen.setPathEffect(pathEffect1);
6750
6751    canvas.attachPen(pen);
6752    canvas.drawPath(path);
6753    canvas.detachPen();
6754  }
6755}
6756```
6757
6758### createSumPathEffect<sup>18+</sup>
6759
6760static createSumPathEffect(firstPathEffect: PathEffect, secondPathEffect: PathEffect): PathEffect
6761
6762创建一个叠加的路径效果。与createComposePathEffect不同,此接口会分别对两个参数的效果各自独立进行表现,然后将两个效果简单重叠显示。
6763
6764**系统能力:** SystemCapability.Graphics.Drawing
6765
6766**参数:**
6767
6768| 参数名     | 类型           | 必填    | 说明                                               |
6769| ---------- | ------------- | ------- | -------------------------------------------------- |
6770| firstPathEffect | [PathEffect](#patheffect12) | 是 | 表示第一个路径效果。 |
6771| secondPathEffect | [PathEffect](#patheffect12) | 是 | 表示第二个路径效果。 |
6772
6773**返回值:**
6774
6775| 类型                      | 说明                   |
6776| ------------------------- | --------------------- |
6777| [PathEffect](#patheffect12) | 返回创建的路径效果对象。 |
6778
6779**示例:**
6780
6781```ts
6782import { RenderNode } from '@kit.ArkUI';
6783import { drawing } from '@kit.ArkGraphics2D';
6784
6785class DrawingRenderNode extends RenderNode {
6786  draw(context : DrawContext) {
6787    const canvas = context.canvas;
6788    let intervals = [10, 5];
6789    let pathEffectOne = drawing.PathEffect.createDashPathEffect(intervals, 5);
6790    let pathEffectTwo = drawing.PathEffect.createDashPathEffect(intervals, 10);
6791    let effect = drawing.PathEffect.createSumPathEffect(pathEffectOne, pathEffectTwo);
6792  }
6793}
6794```
6795
6796### createCornerPathEffect<sup>12+</sup>
6797
6798static createCornerPathEffect(radius: number): PathEffect
6799
6800创建将路径的夹角变成指定半径的圆角的路径效果对象。
6801
6802**系统能力:** SystemCapability.Graphics.Drawing
6803
6804**参数:**
6805
6806| 参数名     | 类型           | 必填    | 说明                                               |
6807| ---------- | ------------- | ------- | -------------------------------------------------- |
6808| radius     | number        | 是      | 圆角的半径,必须大于0,该参数为浮点数。                |
6809
6810**返回值:**
6811
6812| 类型                      | 说明                   |
6813| ------------------------- | --------------------- |
6814| [PathEffect](#patheffect12) | 返回创建的路径效果对象。 |
6815
6816**错误码:**
6817
6818以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
6819
6820| 错误码ID | 错误信息 |
6821| ------- | --------------------------------------------|
6822| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
6823
6824**示例:**
6825
6826```ts
6827import { RenderNode } from '@kit.ArkUI';
6828import { drawing } from '@kit.ArkGraphics2D';
6829
6830class DrawingRenderNode extends RenderNode {
6831  draw(context : DrawContext) {
6832    const canvas = context.canvas;
6833    let effect = drawing.PathEffect.createCornerPathEffect(30);
6834  }
6835}
6836```
6837
6838### createDiscretePathEffect<sup>18+</sup>
6839
6840static createDiscretePathEffect(segLength: number, dev: number, seedAssist?: number): PathEffect
6841
6842创建一种将路径打散,并且在路径上产生不规则分布的效果。
6843
6844**系统能力:** SystemCapability.Graphics.Drawing
6845
6846**参数:**
6847
6848| 参数名     | 类型           | 必填    | 说明                                               |
6849| ---------- | ------------- | ------- | -------------------------------------------------- |
6850| segLength  | number        | 是      | 路径中每进行一次打散操作的长度,该长度为浮点数,负数和0时无效果。 |
6851| dev        | number        | 是      | 绘制时的末端点的最大移动偏离量,该偏移量为浮点数。 |
6852| seedAssist | number        | 否      | 生成效果伪随机种子辅助变量,默认值为0,该参数为32位无符号整数。 |
6853
6854**返回值:**
6855
6856| 类型                      | 说明                   |
6857| ------------------------- | --------------------- |
6858| [PathEffect](#patheffect12) | 返回创建的路径效果对象。 |
6859
6860**示例:**
6861
6862```ts
6863import { RenderNode } from '@kit.ArkUI';
6864import { drawing } from '@kit.ArkGraphics2D';
6865
6866class DrawingRenderNode extends RenderNode {
6867  draw(context : DrawContext) {
6868    const canvas = context.canvas;
6869    let effect = drawing.PathEffect.createDiscretePathEffect(100, -50, 0);
6870  }
6871}
6872```
6873
6874### createComposePathEffect<sup>18+</sup>
6875
6876static createComposePathEffect(outer: PathEffect, inner: PathEffect): PathEffect
6877
6878创建路径组合的路径效果对象,首先应用内部路径效果,然后应用外部路径效果。
6879
6880**系统能力:** SystemCapability.Graphics.Drawing
6881
6882**参数:**
6883
6884| 参数名 | 类型                        | 必填 | 说明                             |
6885| ------ | --------------------------- | ---- | -------------------------------- |
6886| outer  | [PathEffect](#patheffect12) | 是   | 组合路径效果中外部路径效果。 |
6887| inner  | [PathEffect](#patheffect12) | 是   | 组合路径效果中内部路径效果。 |
6888
6889**返回值:**
6890
6891| 类型                      | 说明                   |
6892| ------------------------- | --------------------- |
6893| [PathEffect](#patheffect12) | 返回创建的路径效果对象。 |
6894
6895**示例:**
6896
6897```ts
6898import { RenderNode } from '@kit.ArkUI';
6899import { drawing } from '@kit.ArkGraphics2D';
6900
6901class DrawingRenderNode extends RenderNode {
6902  draw(context : DrawContext) {
6903    const canvas = context.canvas;
6904    let pathEffect1 = drawing.PathEffect.createCornerPathEffect(100);
6905    let pathEffect2 = drawing.PathEffect.createCornerPathEffect(10);
6906    let effect = drawing.PathEffect.createComposePathEffect(pathEffect1, pathEffect2);
6907  }
6908}
6909```
6910
6911## ShadowLayer<sup>12+</sup>
6912
6913阴影层对象。
6914
6915### create<sup>12+</sup>
6916
6917static create(blurRadius: number, x: number, y: number, color: common2D.Color): ShadowLayer
6918
6919创建阴影层对象。
6920
6921**系统能力:** SystemCapability.Graphics.Drawing
6922
6923**参数:**
6924
6925| 参数名     | 类型      | 必填 | 说明                                 |
6926| ---------- | -------- | ---- | ----------------------------------- |
6927| blurRadius  | number   | 是   | 阴影的半径,必须为大于零的浮点数。     |
6928| x           | number   | 是   | x轴上的偏移点,该参数为浮点数。        |
6929| y           | number   | 是   | Y轴上的偏移点,该参数为浮点数。        |
6930| color       | [common2D.Color](js-apis-graphics-common2D.md#color) | 是   | ARGB格式的颜色,每个颜色通道的值是0到255之间的整数。 |
6931
6932**返回值:**
6933
6934| 类型                        | 说明                  |
6935| --------------------------- | -------------------- |
6936| [ShadowLayer](#shadowlayer12) | 返回创建的阴影层对象。 |
6937
6938**错误码:**
6939
6940以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
6941
6942| 错误码ID | 错误信息 |
6943| ------- | --------------------------------------------|
6944| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
6945
6946**示例:**
6947
6948```ts
6949import { RenderNode } from '@kit.ArkUI';
6950import { common2D, drawing } from '@kit.ArkGraphics2D';
6951
6952class DrawingRenderNode extends RenderNode {
6953  draw(context : DrawContext) {
6954    const canvas = context.canvas;
6955    let color : common2D.Color = {alpha: 0xFF, red: 0x00, green: 0xFF, blue: 0x00};
6956    let shadowLayer = drawing.ShadowLayer.create(3, -3, 3, color);
6957  }
6958}
6959```
6960
6961### create<sup>18+</sup>
6962
6963static create(blurRadius: number, x: number, y: number, color: common2D.Color | number): ShadowLayer
6964
6965创建阴影层对象。
6966
6967**系统能力:** SystemCapability.Graphics.Drawing
6968
6969**参数:**
6970
6971| 参数名     | 类型      | 必填 | 说明                                 |
6972| ---------- | -------- | ---- | ----------------------------------- |
6973| blurRadius  | number   | 是   | 阴影的半径,必须为大于零的浮点数。     |
6974| x           | number   | 是   | x轴上的偏移点,该参数为浮点数。        |
6975| y           | number   | 是   | Y轴上的偏移点,该参数为浮点数。        |
6976| color       | [common2D.Color](js-apis-graphics-common2D.md#color) \| number   | 是   | 颜色,可以用16进制ARGB格式的无符号整数表示。  |
6977
6978**返回值:**
6979
6980| 类型                        | 说明                  |
6981| --------------------------- | -------------------- |
6982| [ShadowLayer](#shadowlayer12) | 返回创建的阴影层对象。 |
6983
6984**错误码:**
6985
6986以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
6987
6988| 错误码ID | 错误信息 |
6989| ------- | --------------------------------------------|
6990| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
6991
6992**示例:**
6993
6994```ts
6995import { RenderNode } from '@kit.ArkUI';
6996import { drawing } from '@kit.ArkGraphics2D';
6997
6998class DrawingRenderNode extends RenderNode {
6999  draw(context : DrawContext) {
7000    const canvas = context.canvas;
7001    let shadowLayer = drawing.ShadowLayer.create(3, -3, 3, 0xff00ff00);
7002  }
7003}
7004```
7005
7006## Pen
7007
7008画笔对象,描述所绘制图形形状的轮廓信息。
7009
7010### constructor<sup>12+</sup>
7011
7012constructor()
7013
7014构造一个新的画笔对象。
7015
7016**系统能力:** SystemCapability.Graphics.Drawing
7017
7018**示例:**
7019
7020```ts
7021import { drawing } from '@kit.ArkGraphics2D';
7022
7023const pen = new drawing.Pen();
7024```
7025
7026### constructor<sup>12+</sup>
7027
7028constructor(pen: Pen)
7029
7030复制构造一个新的画笔对象。
7031
7032**系统能力:** SystemCapability.Graphics.Drawing
7033
7034**参数:**
7035
7036| 参数名 | 类型        | 必填 | 说明              |
7037| ------| ----------- | ---- | ---------------- |
7038| pen     | [Pen](#pen) | 是   | 待复制的画笔对象。 |
7039
7040**错误码:**
7041
7042以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
7043
7044| 错误码ID | 错误信息 |
7045| ------- | --------------------------------------------|
7046| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
7047
7048**示例:**
7049
7050```ts
7051import { common2D, drawing } from '@kit.ArkGraphics2D';
7052
7053const pen = new drawing.Pen();
7054const penColor: common2D.Color = { alpha: 255, red: 0, green: 255, blue: 0 };
7055pen.setColor(penColor);
7056pen.setStrokeWidth(10);
7057const newPen = new drawing.Pen(pen);
7058```
7059
7060### setMiterLimit<sup>12+</sup>
7061
7062setMiterLimit(miter: number): void
7063
7064设置折线尖角长度与线宽的最大比值,当画笔绘制一条折线,并且[JoinStyle](#joinstyle12)为MITER_JOIN时,若尖角长度与线宽的比值大于限制值,则该折角使用BEVEL_JOIN绘制。
7065
7066**系统能力:** SystemCapability.Graphics.Drawing
7067
7068**参数:**
7069
7070| 参数名 | 类型    | 必填 | 说明              |
7071| ------ | ------ | ---- | ---------------- |
7072| miter  | number | 是   | 折线尖角长度与线宽的最大比值,负数在绘制时会被视作4.0处理,非负数正常生效,该参数为浮点数。 |
7073
7074**错误码:**
7075
7076以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
7077
7078| 错误码ID | 错误信息 |
7079| ------- | --------------------------------------------|
7080| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
7081
7082**示例:**
7083
7084```ts
7085import { drawing } from '@kit.ArkGraphics2D';
7086
7087const pen = new drawing.Pen();
7088pen.setMiterLimit(5);
7089```
7090
7091### getMiterLimit<sup>12+</sup>
7092
7093getMiterLimit(): number
7094
7095获取折线尖角的限制值。
7096
7097**系统能力:** SystemCapability.Graphics.Drawing
7098
7099**返回值:**
7100
7101| 类型   | 说明                 |
7102| -------| -------------------- |
7103| number | 返回折线尖角长度与线宽的最大比值。 |
7104
7105**示例:**
7106
7107```ts
7108import { drawing } from '@kit.ArkGraphics2D';
7109
7110const pen = new drawing.Pen();
7111let miter = pen.getMiterLimit();
7112```
7113
7114### setImageFilter<sup>12+</sup>
7115
7116setImageFilter(filter: ImageFilter | null): void
7117
7118设置画笔的图像滤波器。
7119
7120**系统能力:** SystemCapability.Graphics.Drawing
7121
7122**参数:**
7123
7124| 参数名 | 类型   | 必填 | 说明                    |
7125| ------ | ------ | ---- | ----------------------- |
7126| filter    | [ImageFilter](#imagefilter12) \| null | 是   |  图像滤波器,null表示清空画笔的图像滤波器效果。 |
7127
7128**错误码:**
7129
7130以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
7131
7132| 错误码ID | 错误信息 |
7133| ------- | --------------------------------------------|
7134| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types. |
7135
7136**示例:**
7137
7138```ts
7139import {drawing} from '@kit.ArkGraphics2D';
7140
7141let colorfilter = drawing.ColorFilter.createSRGBGammaToLinear();
7142let imgFilter = drawing.ImageFilter.createFromColorFilter(colorfilter);
7143let pen = new drawing.Pen();
7144pen.setImageFilter(imgFilter);
7145pen.setImageFilter(null);
7146```
7147
7148### getColorFilter<sup>12+</sup>
7149
7150getColorFilter(): ColorFilter
7151
7152获取画笔的颜色滤波器。
7153
7154**系统能力:** SystemCapability.Graphics.Drawing
7155
7156**返回值:**
7157
7158| 类型                        | 说明               |
7159| --------------------------- | ------------------ |
7160| [ColorFilter](#colorfilter) | 返回颜色滤波器。 |
7161
7162**示例:**
7163
7164```ts
7165import {drawing} from '@kit.ArkGraphics2D';
7166
7167let pen = new drawing.Pen();
7168let colorfilter = drawing.ColorFilter.createLumaColorFilter();
7169pen.setColorFilter(colorfilter);
7170let filter = pen.getColorFilter();
7171```
7172
7173### setColor
7174
7175setColor(color: common2D.Color) : void
7176
7177设置画笔的颜色。
7178
7179**系统能力:** SystemCapability.Graphics.Drawing
7180
7181**参数:**
7182
7183| 参数名 | 类型                                                 | 必填 | 说明             |
7184| ------ | ---------------------------------------------------- | ---- | ---------------- |
7185| color  | [common2D.Color](js-apis-graphics-common2D.md#color) | 是   | ARGB格式的颜色,每个颜色通道的值是0到255之间的整数。 |
7186
7187**错误码:**
7188
7189以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
7190
7191| 错误码ID | 错误信息 |
7192| ------- | --------------------------------------------|
7193| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
7194
7195**示例:**
7196
7197```ts
7198import { common2D, drawing } from '@kit.ArkGraphics2D';
7199
7200const color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 };
7201const pen = new drawing.Pen();
7202pen.setColor(color);
7203```
7204
7205### setColor<sup>12+</sup>
7206
7207setColor(alpha: number, red: number, green: number, blue: number): void
7208
7209设置画笔的颜色。性能优于[setColor](#setcolor)接口,推荐使用本接口。
7210
7211**系统能力:** SystemCapability.Graphics.Drawing
7212
7213**参数:**
7214
7215| 参数名 | 类型    | 必填 | 说明                                                |
7216| ------ | ------ | ---- | -------------------------------------------------- |
7217| alpha  | number | 是   | ARGB格式颜色的透明度通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。 |
7218| red    | number | 是   | ARGB格式颜色的红色通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。   |
7219| green  | number | 是   | ARGB格式颜色的绿色通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。   |
7220| blue   | number | 是   | ARGB格式颜色的蓝色通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。   |
7221
7222**错误码:**
7223
7224以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
7225
7226| 错误码ID | 错误信息 |
7227| ------- | --------------------------------------------|
7228| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
7229
7230**示例:**
7231
7232```ts
7233import { drawing } from '@kit.ArkGraphics2D';
7234
7235const pen = new drawing.Pen();
7236pen.setColor(255, 255, 0, 0);
7237```
7238
7239### setColor<sup>18+</sup>
7240
7241setColor(color: number) : void
7242
7243设置画笔的颜色。
7244
7245**系统能力:** SystemCapability.Graphics.Drawing
7246
7247**参数:**
7248
7249| 参数名 | 类型                                                 | 必填 | 说明             |
7250| ------ | ---------------------------------------------------- | ---- | ---------------- |
7251| color  | number | 是   | 16进制ARGB格式的颜色。 |
7252
7253**示例:**
7254
7255```ts
7256import { drawing } from '@kit.ArkGraphics2D';
7257
7258const pen = new drawing.Pen();
7259pen.setColor(0xffff0000);
7260```
7261
7262### setColor4f<sup>20+</sup>
7263
7264setColor4f(color4f: common2D.Color4f, colorSpace: colorSpaceManager.ColorSpaceManager | null): void
7265
7266设置画笔的颜色以及标准色域,与[setColor](#setcolor)区别在于可以单独设置色域,适用于需要单独设置色域的场景。
7267
7268**系统能力:** SystemCapability.Graphics.Drawing
7269
7270**参数:**
7271
7272| 参数名 | 类型                                                 | 必填 | 说明             |
7273| ------ | ---------------------------------------------------- | ---- | ---------------- |
7274| color4f  | [common2D.Color4f](js-apis-graphics-common2D.md#color4f20) | 是   | ARGB格式的颜色,每个颜色通道的值是0.0-1.0之间的浮点数,大于1.0时,取1.0,小于0.0时,取0.0。|
7275| colorSpace  | [colorSpaceManager.ColorSpaceManager](js-apis-colorSpaceManager.md#colorspacemanager) \| null | 是   | 标准色域对象,null表示使用SRGB色域。|
7276
7277**示例:**
7278
7279```ts
7280import { common2D, drawing, colorSpaceManager } from "@kit.ArkGraphics2D";
7281
7282const pen = new drawing.Pen();
7283let colorSpace = colorSpaceManager.create(colorSpaceManager.ColorSpace.BT2020_HLG);
7284let color4f:common2D.Color4f = {alpha:1, red:0.5, green:0.4, blue:0.7};
7285pen.setColor4f(color4f, colorSpace);
7286```
7287
7288### getColor<sup>12+</sup>
7289
7290getColor(): common2D.Color
7291
7292获取画笔的颜色。
7293
7294**系统能力:** SystemCapability.Graphics.Drawing
7295
7296**返回值:**
7297
7298| 类型           | 说明            |
7299| -------------- | -------------- |
7300| common2D.Color | 返回画笔的颜色。 |
7301
7302**示例:**
7303
7304```ts
7305import { common2D, drawing } from '@kit.ArkGraphics2D';
7306
7307const color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 };
7308const pen = new drawing.Pen();
7309pen.setColor(color);
7310let colorGet = pen.getColor();
7311```
7312
7313### getColor4f<sup>20+</sup>
7314
7315getColor4f(): common2D.Color4f
7316
7317获取画笔的颜色,与[getColor](#getcolor12)的区别在于返回值类型为浮点数,适用于需要浮点数类型的场景。
7318
7319**系统能力:** SystemCapability.Graphics.Drawing
7320
7321**返回值:**
7322
7323| 类型           | 说明            |
7324| -------------- | -------------- |
7325|[common2D.Color4f](js-apis-graphics-common2D.md#color4f20) | 返回画笔的颜色。 |
7326
7327**示例:**
7328
7329```ts
7330import { common2D, drawing, colorSpaceManager } from "@kit.ArkGraphics2D";
7331
7332const pen = new drawing.Pen();
7333let colorSpace = colorSpaceManager.create(colorSpaceManager.ColorSpace.BT2020_HLG);
7334let color4f:common2D.Color4f = {alpha:1, red:0.5, green:0.4, blue:0.7};
7335pen.setColor4f(color4f, colorSpace);
7336let color = pen.getColor4f();
7337```
7338
7339### getHexColor<sup>18+</sup>
7340
7341getHexColor(): number
7342
7343获取画笔的颜色。
7344
7345**系统能力:** SystemCapability.Graphics.Drawing
7346
7347**返回值:**
7348
7349| 类型           | 说明            |
7350| -------------- | -------------- |
7351| number | 返回画笔的颜色,以16进制ARGB格式的32位无符号整数表示。 |
7352
7353**示例:**
7354
7355```ts
7356import { common2D, drawing } from '@kit.ArkGraphics2D';
7357
7358let color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 };
7359let pen = new drawing.Pen();
7360pen.setColor(color);
7361let hex_color: number = pen.getHexColor();
7362console.info('getHexColor: ', hex_color.toString(16));
7363```
7364
7365### setStrokeWidth
7366
7367setStrokeWidth(width: number) : void
7368
7369设置画笔的线宽。0线宽被视作特殊的极细线宽,在绘制时始终会被绘制为1像素,不随画布的缩放而改变;负数线宽在实际绘制时会被视作0线宽。
7370
7371**系统能力:** SystemCapability.Graphics.Drawing
7372
7373**参数:**
7374
7375| 参数名 | 类型   | 必填 | 说明             |
7376| ------ | ------ | ---- | ---------------- |
7377| width  | number | 是   | 表示线宽,该参数为浮点数。 |
7378
7379**错误码:**
7380
7381以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
7382
7383| 错误码ID | 错误信息 |
7384| ------- | --------------------------------------------|
7385| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
7386
7387**示例:**
7388
7389```ts
7390import { drawing } from '@kit.ArkGraphics2D';
7391
7392const pen = new drawing.Pen();
7393pen.setStrokeWidth(5);
7394```
7395
7396### getWidth<sup>12+</sup>
7397
7398getWidth(): number
7399
7400获取画笔的线宽属性,线宽描述了画笔绘制图形轮廓的宽度。
7401
7402**系统能力:** SystemCapability.Graphics.Drawing
7403
7404**返回值:**
7405
7406| 类型   | 说明            |
7407| ------ | -------------- |
7408| number | 返回画笔的线宽,单位为物理像素px。 |
7409
7410**示例:**
7411
7412```ts
7413import { drawing } from '@kit.ArkGraphics2D';
7414
7415const pen = new drawing.Pen();
7416let width = pen.getWidth();
7417```
7418
7419### setAntiAlias
7420
7421setAntiAlias(aa: boolean) : void
7422
7423设置画笔是否开启抗锯齿。开启后,可以使得图形的边缘在显示时更平滑。未调用此接口设置时,系统默认关闭抗锯齿。
7424
7425**系统能力:** SystemCapability.Graphics.Drawing
7426
7427**参数:**
7428
7429| 参数名 | 类型    | 必填 | 说明                                              |
7430| ------ | ------- | ---- | ------------------------------------------------- |
7431| aa     | boolean | 是   | 表示是否开启抗锯齿。true表示开启,false表示关闭。 |
7432
7433**错误码:**
7434
7435以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
7436
7437| 错误码ID | 错误信息 |
7438| ------- | --------------------------------------------|
7439| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
7440
7441**示例:**
7442
7443```ts
7444import { drawing } from '@kit.ArkGraphics2D';
7445
7446const pen = new drawing.Pen();
7447pen.setAntiAlias(true);
7448```
7449
7450### isAntiAlias<sup>12+</sup>
7451
7452isAntiAlias(): boolean
7453
7454获取画笔是否开启抗锯齿属性。
7455
7456**系统能力:** SystemCapability.Graphics.Drawing
7457
7458**返回值:**
7459
7460| 类型    | 说明                       |
7461| ------- | ------------------------- |
7462| boolean | 返回画笔是否开启抗锯齿属性,true表示开启,false表示关闭。 |
7463
7464**示例:**
7465
7466```ts
7467import { drawing } from '@kit.ArkGraphics2D';
7468
7469const pen = new drawing.Pen();
7470let isAntiAlias = pen.isAntiAlias();
7471```
7472
7473### setAlpha
7474
7475setAlpha(alpha: number) : void
7476
7477设置画笔的透明度。
7478
7479**系统能力:** SystemCapability.Graphics.Drawing
7480
7481**参数:**
7482
7483| 参数名 | 类型   | 必填 | 说明                                     |
7484| ------ | ------ | ---- | ---------------------------------------- |
7485| alpha  | number | 是   | 用于表示透明度的[0, 255]区间内的整数值,传入浮点类型时向下取整。 |
7486
7487**错误码:**
7488
7489以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
7490
7491| 错误码ID | 错误信息 |
7492| ------- | --------------------------------------------|
7493| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
7494
7495**示例:**
7496
7497```ts
7498import { drawing } from '@kit.ArkGraphics2D';
7499
7500const pen = new drawing.Pen();
7501pen.setAlpha(128);
7502```
7503
7504### getAlpha<sup>12+</sup>
7505
7506getAlpha(): number
7507
7508获取画笔的透明度。
7509
7510**系统能力:** SystemCapability.Graphics.Drawing
7511
7512**返回值:**
7513
7514| 类型   | 说明              |
7515| ------ | ---------------- |
7516| number | 返回画笔的透明度,该返回值为0到255之间的整数。 |
7517
7518**示例:**
7519
7520```ts
7521import { drawing } from '@kit.ArkGraphics2D';
7522
7523const pen = new drawing.Pen();
7524let alpha = pen.getAlpha();
7525```
7526
7527### setColorFilter
7528
7529setColorFilter(filter: ColorFilter) : void
7530
7531给画笔添加额外的颜色滤波器。
7532
7533**系统能力:** SystemCapability.Graphics.Drawing
7534
7535**参数:**
7536
7537| 参数名 | 类型                        | 必填 | 说明         |
7538| ------ | --------------------------- | ---- | ------------ |
7539| filter | [ColorFilter](#colorfilter) | 是   | 颜色滤波器。null表示清空颜色滤波器。 |
7540
7541**错误码:**
7542
7543以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
7544
7545| 错误码ID | 错误信息 |
7546| ------- | --------------------------------------------|
7547| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
7548
7549**示例:**
7550
7551```ts
7552import { drawing } from '@kit.ArkGraphics2D';
7553
7554const pen = new drawing.Pen();
7555let colorFilter = drawing.ColorFilter.createLinearToSRGBGamma();
7556pen.setColorFilter(colorFilter);
7557```
7558
7559### setMaskFilter<sup>12+</sup>
7560
7561setMaskFilter(filter: MaskFilter): void
7562
7563给画笔添加额外的蒙版滤镜。
7564
7565**系统能力:** SystemCapability.Graphics.Drawing
7566
7567**参数:**
7568
7569| 参数名 | 类型                       | 必填 | 说明      |
7570| ------ | ------------------------- | ---- | --------- |
7571| filter | [MaskFilter](#maskfilter12) | 是   | 蒙版滤镜。null表示清空蒙版滤镜。 |
7572
7573**错误码:**
7574
7575以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
7576
7577| 错误码ID | 错误信息 |
7578| ------- | --------------------------------------------|
7579| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
7580
7581**示例:**
7582
7583```ts
7584import { RenderNode } from '@kit.ArkUI';
7585import { common2D, drawing } from '@kit.ArkGraphics2D';
7586
7587class DrawingRenderNode extends RenderNode {
7588  draw(context : DrawContext) {
7589    const canvas = context.canvas;
7590    const pen = new drawing.Pen();
7591    pen.setStrokeWidth(5);
7592    pen.setColor({alpha: 255, red: 255, green: 0, blue: 0});
7593    let maskFilter = drawing.MaskFilter.createBlurMaskFilter(drawing.BlurType.OUTER, 10);
7594    pen.setMaskFilter(maskFilter);
7595  }
7596}
7597```
7598
7599### setPathEffect<sup>12+</sup>
7600
7601setPathEffect(effect: PathEffect): void
7602
7603设置画笔路径效果。
7604
7605**系统能力:** SystemCapability.Graphics.Drawing
7606
7607**参数:**
7608
7609| 参数名  | 类型                       | 必填 | 说明         |
7610| ------- | ------------------------- | ---- | ------------ |
7611| effect  | [PathEffect](#patheffect12) | 是   | 路径效果对象。null表示清空路径效果。 |
7612
7613**错误码:**
7614
7615以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
7616
7617| 错误码ID | 错误信息 |
7618| ------- | --------------------------------------------|
7619| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
7620
7621**示例:**
7622
7623```ts
7624import { RenderNode } from '@kit.ArkUI';
7625import { common2D, drawing } from '@kit.ArkGraphics2D';
7626
7627class DrawingRenderNode extends RenderNode {
7628  draw(context : DrawContext) {
7629    const canvas = context.canvas;
7630    const pen = new drawing.Pen();
7631    pen.setStrokeWidth(5);
7632    pen.setColor({alpha: 255, red: 255, green: 0, blue: 0});
7633    let pathEffect = drawing.PathEffect.createDashPathEffect([30, 10], 0);
7634    pen.setPathEffect(pathEffect);
7635  }
7636}
7637```
7638
7639### setShaderEffect<sup>12+</sup>
7640
7641setShaderEffect(shaderEffect: ShaderEffect): void
7642
7643设置画笔着色器效果。
7644
7645**系统能力:** SystemCapability.Graphics.Drawing
7646
7647**参数:**
7648
7649| 参数名  | 类型                       | 必填 | 说明         |
7650| ------- | ------------------------- | ---- | ------------ |
7651| shaderEffect  | [ShaderEffect](#shadereffect12) | 是   | 着色器对象。null表示清空着色器效果。 |
7652
7653**错误码:**
7654
7655以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
7656
7657| 错误码ID | 错误信息 |
7658| ------- | --------------------------------------------|
7659| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
7660
7661**示例:**
7662
7663```ts
7664import { drawing } from '@kit.ArkGraphics2D';
7665
7666const pen = new drawing.Pen();
7667let shaderEffect = drawing.ShaderEffect.createLinearGradient({x: 100, y: 100}, {x: 300, y: 300}, [0xFF00FF00, 0xFFFF0000], drawing.TileMode.REPEAT);
7668pen.setShaderEffect(shaderEffect);
7669```
7670
7671### setShadowLayer<sup>12+</sup>
7672
7673setShadowLayer(shadowLayer: ShadowLayer): void
7674
7675设置画笔阴影层效果。当前仅在绘制文字时生效。
7676
7677**系统能力:** SystemCapability.Graphics.Drawing
7678
7679**参数:**
7680
7681| 参数名  | 类型                       | 必填 | 说明      |
7682| ------- | ------------------------- | ---- | --------- |
7683| shadowLayer  | [ShadowLayer](#shadowlayer12) | 是   | 阴影层对象。null表示清空阴影层效果。 |
7684
7685**错误码:**
7686
7687以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
7688
7689| 错误码ID | 错误信息 |
7690| ------- | --------------------------------------------|
7691| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
7692
7693**示例:**
7694
7695```ts
7696import { RenderNode } from '@kit.ArkUI';
7697import { common2D, drawing } from '@kit.ArkGraphics2D';
7698
7699class DrawingRenderNode extends RenderNode {
7700  draw(context : DrawContext) {
7701    const canvas = context.canvas;
7702    let font = new drawing.Font();
7703    font.setSize(60);
7704    let textBlob = drawing.TextBlob.makeFromString("hello", font, drawing.TextEncoding.TEXT_ENCODING_UTF8);
7705    let pen = new drawing.Pen();
7706    pen.setStrokeWidth(2.0);
7707    let pen_color : common2D.Color = {alpha: 0xFF, red: 0xFF, green: 0x00, blue: 0x00};
7708    pen.setColor(pen_color);
7709    canvas.attachPen(pen);
7710    canvas.drawTextBlob(textBlob, 100, 100);
7711    canvas.detachPen();
7712    let color : common2D.Color = {alpha: 0xFF, red: 0x00, green: 0xFF, blue: 0x00};
7713    let shadowLayer = drawing.ShadowLayer.create(3, -3, 3, color);
7714    pen.setShadowLayer(shadowLayer);
7715    canvas.attachPen(pen);
7716    canvas.drawTextBlob(textBlob, 100, 200);
7717    canvas.detachPen();
7718  }
7719}
7720```
7721
7722### setBlendMode
7723
7724setBlendMode(mode: BlendMode) : void
7725
7726设置画笔的混合模式。
7727
7728**系统能力:** SystemCapability.Graphics.Drawing
7729
7730**参数:**
7731
7732| 参数名 | 类型                    | 必填 | 说明             |
7733| ------ | ----------------------- | ---- | ---------------- |
7734| mode   | [BlendMode](#blendmode) | 是   | 颜色的混合模式。 |
7735
7736**错误码:**
7737
7738以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
7739
7740| 错误码ID | 错误信息 |
7741| ------- | --------------------------------------------|
7742| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
7743
7744**示例:**
7745
7746```ts
7747import { drawing } from '@kit.ArkGraphics2D';
7748
7749const pen = new drawing.Pen();
7750pen.setBlendMode(drawing.BlendMode.SRC);
7751```
7752
7753### setJoinStyle<sup>12+</sup>
7754
7755setJoinStyle(style: JoinStyle): void
7756
7757设置画笔绘制转角的样式。未调用此接口设置时,系统默认的转角样式为MITER_JOIN。
7758
7759**系统能力:** SystemCapability.Graphics.Drawing
7760
7761**参数:**
7762
7763| 参数名 | 类型                     | 必填 | 说明             |
7764| ------ | ----------------------- | ---- | --------------- |
7765| style  | [JoinStyle](#joinstyle12) | 是   | 折线转角样式。     |
7766
7767**错误码:**
7768
7769以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
7770
7771| 错误码ID | 错误信息 |
7772| ------- | --------------------------------------------|
7773| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
7774
7775**示例:**
7776
7777```ts
7778import { RenderNode } from '@kit.ArkUI';
7779import { common2D, drawing } from '@kit.ArkGraphics2D';
7780
7781class DrawingRenderNode extends RenderNode {
7782  draw(context : DrawContext) {
7783    const canvas = context.canvas;
7784    const pen = new drawing.Pen();
7785    pen.setStrokeWidth(5);
7786    pen.setColor({alpha: 255, red: 255, green: 0, blue: 0});
7787    pen.setJoinStyle(drawing.JoinStyle.ROUND_JOIN);
7788  }
7789}
7790```
7791
7792### getJoinStyle<sup>12+</sup>
7793
7794getJoinStyle(): JoinStyle
7795
7796获取画笔绘制转角的样式。
7797
7798**系统能力:** SystemCapability.Graphics.Drawing
7799
7800**返回值:**
7801
7802| 类型          | 说明                    |
7803| ------------- | ---------------------- |
7804| JoinStyle | 返回折线转角的样式。         |
7805
7806**示例:**
7807
7808```ts
7809import { RenderNode } from '@kit.ArkUI';
7810import { common2D, drawing } from '@kit.ArkGraphics2D';
7811
7812class DrawingRenderNode extends RenderNode {
7813  draw(context : DrawContext) {
7814    const canvas = context.canvas;
7815    const pen = new drawing.Pen();
7816    pen.setStrokeWidth(5);
7817    pen.setColor({alpha: 255, red: 255, green: 0, blue: 0});
7818    pen.setJoinStyle(drawing.JoinStyle.ROUND_JOIN);
7819    let joinStyle = pen.getJoinStyle();
7820  }
7821}
7822```
7823
7824### setCapStyle<sup>12+</sup>
7825
7826setCapStyle(style: CapStyle): void
7827
7828设置画笔的线帽样式。未调用此接口设置时,系统默认的线帽样式为FLAT_CAP。
7829
7830**系统能力:** SystemCapability.Graphics.Drawing
7831
7832**参数:**
7833
7834| 参数名 | 类型                     | 必填 | 说明                   |
7835| ------ | ----------------------- | ---- | --------------------- |
7836| style  | [CapStyle](#capstyle12)   | 是   | 描述画笔的线帽样式。    |
7837
7838**错误码:**
7839
7840以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
7841
7842| 错误码ID | 错误信息 |
7843| ------- | --------------------------------------------|
7844| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
7845
7846**示例:**
7847
7848```ts
7849import { RenderNode } from '@kit.ArkUI';
7850import { common2D, drawing } from '@kit.ArkGraphics2D';
7851
7852class DrawingRenderNode extends RenderNode {
7853  draw(context : DrawContext) {
7854    const canvas = context.canvas;
7855    const pen = new drawing.Pen();
7856    pen.setStrokeWidth(5);
7857    pen.setColor({alpha: 255, red: 255, green: 0, blue: 0});
7858    pen.setCapStyle(drawing.CapStyle.SQUARE_CAP);
7859  }
7860}
7861```
7862
7863### getCapStyle<sup>12+</sup>
7864
7865getCapStyle(): CapStyle
7866
7867获取画笔的线帽样式。
7868
7869**系统能力:** SystemCapability.Graphics.Drawing
7870
7871**返回值:**
7872
7873| 类型         | 说明                |
7874| ------------ | ------------------ |
7875| CapStyle     | 返回画笔的线帽样式。 |
7876
7877**示例:**
7878
7879```ts
7880import { RenderNode } from '@kit.ArkUI';
7881import { common2D, drawing } from '@kit.ArkGraphics2D';
7882
7883class DrawingRenderNode extends RenderNode {
7884  draw(context : DrawContext) {
7885    const canvas = context.canvas;
7886    const pen = new drawing.Pen();
7887    pen.setStrokeWidth(5);
7888    pen.setColor({alpha: 255, red: 255, green: 0, blue: 0});
7889    pen.setCapStyle(drawing.CapStyle.SQUARE_CAP);
7890    let capStyle = pen.getCapStyle();
7891  }
7892}
7893```
7894
7895### setDither
7896
7897setDither(dither: boolean) : void
7898
7899开启画笔的抖动绘制效果。抖动绘制可以使得绘制出的颜色更加真实。
7900
7901**系统能力:** SystemCapability.Graphics.Drawing
7902
7903**参数:**
7904
7905| 参数名 | 类型    | 必填 | 说明                                                      |
7906| ------ | ------- | ---- | --------------------------------------------------------- |
7907| dither | boolean | 是   | 是否开启画笔的抖动绘制效果。true表示开启,false表示关闭。 |
7908
7909**错误码:**
7910
7911以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
7912
7913| 错误码ID | 错误信息 |
7914| ------- | --------------------------------------------|
7915| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
7916
7917**示例:**
7918
7919```ts
7920import { drawing } from '@kit.ArkGraphics2D';
7921
7922const pen = new drawing.Pen();
7923pen.setDither(true);
7924```
7925
7926### getFillPath<sup>12+</sup>
7927
7928getFillPath(src: Path, dst: Path): boolean
7929
7930获取使用画笔绘制的源路径轮廓,并用目标路径表示。
7931
7932**系统能力:** SystemCapability.Graphics.Drawing
7933
7934**参数:**
7935
7936| 参数名   | 类型                                         | 必填 | 说明                            |
7937| -------- | -------------------------------------------- | ---- | ------------------------------- |
7938| src | [Path](#path) | 是   | 源路径对象。                 |
7939| dst     | [Path](#path)                | 是   | 目标路径对象。 |
7940
7941**返回值:**
7942
7943| 类型                  | 说明           |
7944| --------------------- | -------------- |
7945| boolean | 返回获取源路径轮廓是否成功,true表示成功,false表示失败。 |
7946
7947**错误码:**
7948
7949以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
7950
7951| 错误码ID | 错误信息 |
7952| ------- | --------------------------------------------|
7953| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
7954
7955**示例:**
7956
7957```ts
7958import { drawing } from '@kit.ArkGraphics2D';
7959
7960let pen = new drawing.Pen();
7961let pathSrc: drawing.Path = new drawing.Path();
7962let pathDst: drawing.Path = new drawing.Path();
7963pathSrc.moveTo(0, 0);
7964pathSrc.lineTo(700, 700);
7965let value = pen.getFillPath(pathSrc, pathDst);
7966```
7967
7968### reset<sup>12+</sup>
7969
7970reset(): void
7971
7972重置当前画笔为初始状态。
7973
7974**系统能力:** SystemCapability.Graphics.Drawing
7975
7976**示例:**
7977
7978```ts
7979import { drawing } from '@kit.ArkGraphics2D';
7980
7981const pen = new drawing.Pen();
7982pen.reset();
7983```
7984
7985## Brush
7986
7987画刷对象,描述所绘制图形的填充信息。
7988
7989### constructor<sup>12+</sup>
7990
7991constructor()
7992
7993构造一个新的画刷对象。
7994
7995**系统能力:** SystemCapability.Graphics.Drawing
7996
7997**示例:**
7998
7999```ts
8000import { drawing } from '@kit.ArkGraphics2D';
8001
8002const brush = new drawing.Brush();
8003```
8004
8005### constructor<sup>12+</sup>
8006
8007constructor(brush: Brush)
8008
8009复制构造一个新的画刷对象。
8010
8011**系统能力:** SystemCapability.Graphics.Drawing
8012
8013**参数:**
8014
8015| 参数名 | 类型        | 必填 | 说明              |
8016| ------| ----------- | ---- | ---------------- |
8017| brush     | [Brush](#brush) | 是   | 待复制的画刷对象。 |
8018
8019**错误码:**
8020
8021以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
8022
8023| 错误码ID | 错误信息 |
8024| ------- | --------------------------------------------|
8025| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
8026
8027**示例:**
8028
8029```ts
8030import { common2D, drawing } from '@kit.ArkGraphics2D';
8031
8032const brush = new drawing.Brush();
8033const brushColor: common2D.Color = { alpha: 255, red: 0, green: 255, blue: 0 };
8034brush.setColor(brushColor);
8035const newBrush = new drawing.Brush(brush);
8036```
8037
8038### setColor
8039
8040setColor(color: common2D.Color) : void
8041
8042设置画刷的颜色。
8043
8044**系统能力:** SystemCapability.Graphics.Drawing
8045
8046**参数:**
8047
8048| 参数名 | 类型                                                 | 必填 | 说明             |
8049| ------ | ---------------------------------------------------- | ---- | ---------------- |
8050| color  | [common2D.Color](js-apis-graphics-common2D.md#color) | 是   | ARGB格式的颜色,每个颜色通道的值是0到255之间的整数。 |
8051
8052**错误码:**
8053
8054以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
8055
8056| 错误码ID | 错误信息 |
8057| ------- | --------------------------------------------|
8058| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
8059
8060**示例:**
8061
8062```ts
8063import { common2D, drawing } from '@kit.ArkGraphics2D';
8064
8065const color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 };
8066const brush = new drawing.Brush();
8067brush.setColor(color);
8068```
8069
8070### setColor<sup>12+</sup>
8071
8072setColor(alpha: number, red: number, green: number, blue: number): void
8073
8074设置画刷的颜色。性能优于[setColor](#setcolor-1)接口,推荐使用本接口。
8075
8076**系统能力:** SystemCapability.Graphics.Drawing
8077
8078**参数:**
8079
8080| 参数名 | 类型    | 必填 | 说明                                               |
8081| ------ | ------ | ---- | -------------------------------------------------- |
8082| alpha  | number | 是   | ARGB格式颜色的透明度通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。 |
8083| red    | number | 是   | ARGB格式颜色的红色通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。   |
8084| green  | number | 是   | ARGB格式颜色的绿色通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。   |
8085| blue   | number | 是   | ARGB格式颜色的蓝色通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。   |
8086
8087**错误码:**
8088
8089以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
8090
8091| 错误码ID | 错误信息 |
8092| ------- | --------------------------------------------|
8093| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
8094
8095**示例:**
8096
8097```ts
8098import { drawing } from '@kit.ArkGraphics2D';
8099
8100const brush = new drawing.Brush();
8101brush.setColor(255, 255, 0, 0);
8102```
8103
8104### setColor<sup>18+</sup>
8105
8106setColor(color: number) : void
8107
8108设置画刷的颜色。
8109
8110**系统能力:** SystemCapability.Graphics.Drawing
8111
8112**参数:**
8113
8114| 参数名 | 类型                                                 | 必填 | 说明             |
8115| ------ | ---------------------------------------------------- | ---- | ---------------- |
8116| color  | number | 是   | 16进制ARGB格式的颜色。 |
8117
8118**错误码:**
8119
8120以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
8121
8122| 错误码ID | 错误信息 |
8123| ------- | --------------------------------------------|
8124| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
8125
8126**示例:**
8127
8128```ts
8129import { drawing } from '@kit.ArkGraphics2D';
8130
8131const brush = new drawing.Brush();
8132brush.setColor(0xffff0000);
8133```
8134
8135### setColor4f<sup>20+</sup>
8136
8137setColor4f(color4f: common2D.Color4f, colorSpace: colorSpaceManager.ColorSpaceManager | null): void
8138
8139设置画刷的颜色以及标准色域,与[setColor](#setcolor-1)区别在于可以单独设置色域,适用于需要单独设置色域的场景。
8140
8141**系统能力:** SystemCapability.Graphics.Drawing
8142
8143**参数:**
8144
8145| 参数名 | 类型                                                 | 必填 | 说明             |
8146| ------ | ---------------------------------------------------- | ---- | ---------------- |
8147| color4f  | [common2D.Color4f](js-apis-graphics-common2D.md#color4f20) | 是   | ARGB格式的颜色,每个颜色通道的值是0.0-1.0之间的浮点数,大于1.0时,取1.0,小于0.0时,取0.0。|
8148| colorSpace  | [colorSpaceManager.ColorSpaceManager](js-apis-colorSpaceManager.md#colorspacemanager) \| null | 是   | 标准色域对象,null表示使用SRGB色域。|
8149
8150**示例:**
8151
8152```ts
8153import { common2D, drawing, colorSpaceManager } from "@kit.ArkGraphics2D";
8154
8155const brush = new drawing.Brush();
8156let colorSpace = colorSpaceManager.create(colorSpaceManager.ColorSpace.BT2020_HLG);
8157let color4f:common2D.Color4f = {alpha:1, red:0.5, green:0.4, blue:0.7};
8158brush.setColor4f(color4f, colorSpace);
8159```
8160
8161### getColor<sup>12+</sup>
8162
8163getColor(): common2D.Color
8164
8165获取画刷的颜色。
8166
8167**系统能力:** SystemCapability.Graphics.Drawing
8168
8169**返回值:**
8170
8171| 类型           | 说明            |
8172| -------------- | -------------- |
8173| common2D.Color | 返回画刷的颜色。 |
8174
8175**示例:**
8176
8177```ts
8178import { common2D, drawing } from '@kit.ArkGraphics2D';
8179
8180const color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 };
8181const brush = new drawing.Brush();
8182brush.setColor(color);
8183let colorGet = brush.getColor();
8184```
8185
8186### getColor4f<sup>20+</sup>
8187
8188getColor4f(): common2D.Color4f
8189
8190获取画刷的颜色,与[getColor](#getcolor12-1)的区别是返回值类型为浮点数,适用于需要浮点数类型的场景。
8191
8192**系统能力:** SystemCapability.Graphics.Drawing
8193
8194**返回值:**
8195
8196| 类型           | 说明            |
8197| -------------- | -------------- |
8198| [common2D.Color4f](js-apis-graphics-common2D.md#color4f20) | 返回画刷的颜色。 |
8199
8200**示例:**
8201
8202```ts
8203import { common2D, drawing, colorSpaceManager } from "@kit.ArkGraphics2D";
8204
8205const brush = new drawing.Brush();
8206let colorSpace = colorSpaceManager.create(colorSpaceManager.ColorSpace.BT2020_HLG);
8207let color4f:common2D.Color4f = {alpha:1, red:0.5, green:0.4, blue:0.7};
8208brush.setColor4f(color4f, colorSpace);
8209let color = brush.getColor4f();
8210```
8211
8212### getHexColor<sup>18+</sup>
8213
8214getHexColor(): number
8215
8216获取画刷的颜色。
8217
8218**系统能力:** SystemCapability.Graphics.Drawing
8219
8220**返回值:**
8221
8222| 类型           | 说明            |
8223| -------------- | -------------- |
8224| number | 返回画刷的颜色,以16进制ARGB格式的32位无符号整数表示。 |
8225
8226**示例:**
8227
8228```ts
8229import { common2D, drawing } from '@kit.ArkGraphics2D';
8230
8231let color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 };
8232let brush = new drawing.Brush();
8233brush.setColor(color);
8234let hex_color: number = brush.getHexColor();
8235console.info('getHexColor: ', hex_color.toString(16));
8236```
8237
8238### setAntiAlias
8239
8240setAntiAlias(aa: boolean) : void
8241
8242设置画刷是否开启抗锯齿。开启后,可以使得图形的边缘在显示时更平滑。未调用此接口设置时,系统默认关闭抗锯齿。
8243
8244**系统能力:** SystemCapability.Graphics.Drawing
8245
8246**参数:**
8247
8248| 参数名 | 类型    | 必填 | 说明                                              |
8249| ------ | ------- | ---- | ------------------------------------------------- |
8250| aa     | boolean | 是   | 表示是否开启抗锯齿,true表示开启,false表示关闭。 |
8251
8252**错误码:**
8253
8254以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
8255
8256| 错误码ID | 错误信息 |
8257| ------- | --------------------------------------------|
8258| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
8259
8260**示例:**
8261
8262```ts
8263import { drawing } from '@kit.ArkGraphics2D';
8264
8265const brush = new drawing.Brush();
8266brush.setAntiAlias(true);
8267```
8268
8269### isAntiAlias<sup>12+</sup>
8270
8271isAntiAlias(): boolean
8272
8273获取画刷是否开启抗锯齿属性。
8274
8275**系统能力:** SystemCapability.Graphics.Drawing
8276
8277**返回值:**
8278
8279| 类型    | 说明                       |
8280| ------- | ------------------------- |
8281| boolean | 返回画刷是否开启抗锯齿属性,true表示开启,false表示关闭。 |
8282
8283**示例:**
8284
8285```ts
8286import { drawing } from '@kit.ArkGraphics2D';
8287
8288const brush = new drawing.Brush();
8289let isAntiAlias = brush.isAntiAlias();
8290```
8291
8292### setAlpha
8293
8294setAlpha(alpha: number) : void
8295
8296设置画刷的透明度。
8297
8298**系统能力:** SystemCapability.Graphics.Drawing
8299
8300**参数:**
8301
8302| 参数名 | 类型   | 必填 | 说明                                     |
8303| ------ | ------ | ---- | ---------------------------------------- |
8304| alpha  | number | 是   | 用于表示透明度的[0, 255]区间内的整数值,传入浮点类型时向下取整。 |
8305
8306**错误码:**
8307
8308以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
8309
8310| 错误码ID | 错误信息 |
8311| ------- | --------------------------------------------|
8312| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
8313
8314**示例:**
8315
8316```ts
8317import { drawing } from '@kit.ArkGraphics2D';
8318
8319const brush = new drawing.Brush();
8320brush.setAlpha(128);
8321```
8322
8323### getAlpha<sup>12+</sup>
8324
8325getAlpha(): number
8326
8327获取画刷的透明度。
8328
8329**系统能力:** SystemCapability.Graphics.Drawing
8330
8331**返回值:**
8332
8333| 类型   | 说明              |
8334| ------ | ---------------- |
8335| number | 返回画刷的透明度,该返回值为0到255之间的整数。 |
8336
8337**示例:**
8338
8339```ts
8340import { drawing } from '@kit.ArkGraphics2D';
8341
8342const brush = new drawing.Brush();
8343let alpha = brush.getAlpha();
8344```
8345
8346### setColorFilter
8347
8348setColorFilter(filter: ColorFilter) : void
8349
8350给画刷添加额外的颜色滤波器。
8351
8352**系统能力:** SystemCapability.Graphics.Drawing
8353
8354**参数:**
8355
8356| 参数名 | 类型                        | 必填 | 说明         |
8357| ------ | --------------------------- | ---- | ------------ |
8358| filter | [ColorFilter](#colorfilter) | 是   | 颜色滤波器。null表示清空颜色滤波器。 |
8359
8360**错误码:**
8361
8362以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
8363
8364| 错误码ID | 错误信息 |
8365| ------- | --------------------------------------------|
8366| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
8367
8368**示例:**
8369
8370```ts
8371import { drawing } from '@kit.ArkGraphics2D';
8372
8373const brush = new drawing.Brush();
8374let colorFilter = drawing.ColorFilter.createLinearToSRGBGamma();
8375brush.setColorFilter(colorFilter);
8376```
8377
8378### setMaskFilter<sup>12+</sup>
8379
8380setMaskFilter(filter: MaskFilter): void
8381
8382给画刷添加额外的蒙版滤镜。
8383
8384**系统能力:** SystemCapability.Graphics.Drawing
8385
8386**参数:**
8387
8388| 参数名 | 类型                       | 必填 | 说明      |
8389| ------ | ------------------------- | ---- | --------- |
8390| filter | [MaskFilter](#maskfilter12) | 是   | 蒙版滤镜。null表示清空蒙版滤镜。 |
8391
8392**错误码:**
8393
8394以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
8395
8396| 错误码ID | 错误信息 |
8397| ------- | --------------------------------------------|
8398| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
8399
8400**示例:**
8401
8402```ts
8403import { RenderNode } from '@kit.ArkUI';
8404import { common2D, drawing } from '@kit.ArkGraphics2D';
8405
8406class DrawingRenderNode extends RenderNode {
8407  draw(context : DrawContext) {
8408    const canvas = context.canvas;
8409    const brush = new drawing.Brush();
8410    let maskFilter = drawing.MaskFilter.createBlurMaskFilter(drawing.BlurType.OUTER, 10);
8411    brush.setMaskFilter(maskFilter);
8412  }
8413}
8414```
8415
8416### setShaderEffect<sup>12+</sup>
8417
8418setShaderEffect(shaderEffect: ShaderEffect): void
8419
8420设置画刷着色器效果。
8421
8422**系统能力:** SystemCapability.Graphics.Drawing
8423
8424**参数:**
8425
8426| 参数名  | 类型                       | 必填 | 说明         |
8427| ------- | ------------------------- | ---- | ------------ |
8428| shaderEffect  | [ShaderEffect](#shadereffect12) | 是   | 着色器对象。null表示清空着色器效果。 |
8429
8430**错误码:**
8431
8432以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
8433
8434| 错误码ID | 错误信息 |
8435| ------- | --------------------------------------------|
8436| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
8437
8438**示例:**
8439
8440```ts
8441import { drawing } from '@kit.ArkGraphics2D';
8442
8443const brush = new drawing.Brush();
8444let shaderEffect = drawing.ShaderEffect.createLinearGradient({x: 100, y: 100}, {x: 300, y: 300}, [0xFF00FF00, 0xFFFF0000], drawing.TileMode.REPEAT);
8445brush.setShaderEffect(shaderEffect);
8446```
8447
8448### setShadowLayer<sup>12+</sup>
8449
8450setShadowLayer(shadowLayer: ShadowLayer): void
8451
8452设置画刷阴影层效果。当前仅在绘制文字时生效。
8453
8454**系统能力:** SystemCapability.Graphics.Drawing
8455
8456**参数:**
8457
8458| 参数名  | 类型                       | 必填 | 说明      |
8459| ------- | ------------------------- | ---- | --------- |
8460| shadowLayer  | [ShadowLayer](#shadowlayer12) | 是   | 阴影层对象。null表示清空阴影层效果。 |
8461
8462**错误码:**
8463
8464以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
8465
8466| 错误码ID | 错误信息 |
8467| ------- | --------------------------------------------|
8468| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
8469
8470**示例:**
8471
8472```ts
8473import { RenderNode } from '@kit.ArkUI';
8474import { common2D, drawing } from '@kit.ArkGraphics2D';
8475
8476class DrawingRenderNode extends RenderNode {
8477  draw(context : DrawContext) {
8478    const canvas = context.canvas;
8479    let font = new drawing.Font();
8480    font.setSize(60);
8481
8482    let textBlob = drawing.TextBlob.makeFromString("hello", font, drawing.TextEncoding.TEXT_ENCODING_UTF8);
8483    let pen = new drawing.Pen();
8484    pen.setStrokeWidth(2.0);
8485
8486    let pen_color : common2D.Color = {alpha: 0xFF, red: 0xFF, green: 0x00, blue: 0x00};
8487    pen.setColor(pen_color);
8488    canvas.attachPen(pen);
8489    canvas.drawTextBlob(textBlob, 100, 100);
8490    canvas.detachPen();
8491
8492    let color : common2D.Color = {alpha: 0xFF, red: 0x00, green: 0xFF, blue: 0x00};
8493    let shadowLayer = drawing.ShadowLayer.create(3, -3, 3, color);
8494    pen.setShadowLayer(shadowLayer);
8495    canvas.attachPen(pen);
8496    canvas.drawTextBlob(textBlob, 100, 200);
8497    canvas.detachPen();
8498
8499    let brush = new drawing.Brush();
8500    let brush_color : common2D.Color = {alpha: 0xFF, red: 0xFF, green: 0x00, blue: 0x00};
8501    brush.setColor(brush_color);
8502    canvas.attachBrush(brush);
8503    canvas.drawTextBlob(textBlob, 300, 100);
8504    canvas.detachBrush();
8505
8506    brush.setShadowLayer(shadowLayer);
8507    canvas.attachBrush(brush);
8508    canvas.drawTextBlob(textBlob, 300, 200);
8509    canvas.detachBrush();
8510  }
8511}
8512```
8513
8514### setBlendMode
8515
8516setBlendMode(mode: BlendMode) : void
8517
8518设置画刷的混合模式。未调用此接口设置时,系统默认的混合模式为SRC_OVER。
8519
8520**系统能力:** SystemCapability.Graphics.Drawing
8521
8522**参数:**
8523
8524| 参数名 | 类型                    | 必填 | 说明             |
8525| ------ | ----------------------- | ---- | ---------------- |
8526| mode   | [BlendMode](#blendmode) | 是   | 颜色的混合模式。 |
8527
8528**错误码:**
8529
8530以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
8531
8532| 错误码ID | 错误信息 |
8533| ------- | --------------------------------------------|
8534| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
8535
8536**示例:**
8537
8538```ts
8539import { drawing } from '@kit.ArkGraphics2D';
8540
8541const brush = new drawing.Brush();
8542brush.setBlendMode(drawing.BlendMode.SRC);
8543```
8544
8545### setImageFilter<sup>12+</sup>
8546
8547setImageFilter(filter: ImageFilter | null): void
8548
8549为画刷设置图像滤波器。
8550
8551**系统能力:** SystemCapability.Graphics.Drawing
8552
8553**参数:**
8554
8555| 参数名 | 类型   | 必填 | 说明                    |
8556| ------ | ------ | ---- | ----------------------- |
8557| filter    | [ImageFilter](#imagefilter12) \| null | 是   | 图像滤波器,null表示清空图像滤波器效果。 |
8558
8559**错误码:**
8560
8561以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
8562
8563| 错误码ID | 错误信息 |
8564| ------- | --------------------------------------------|
8565| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types. |
8566
8567**示例:**
8568
8569```ts
8570import {drawing} from '@kit.ArkGraphics2D';
8571
8572let brush = new drawing.Brush();
8573let imgFilter = drawing.ImageFilter.createBlurImageFilter(5, 10, drawing.TileMode.DECAL);
8574brush.setImageFilter(imgFilter);
8575brush.setImageFilter(null);
8576```
8577
8578### getColorFilter<sup>12+</sup>
8579
8580getColorFilter(): ColorFilter
8581
8582获取画刷的颜色滤波器。
8583
8584**系统能力:** SystemCapability.Graphics.Drawing
8585
8586**返回值:**
8587
8588| 类型                        | 说明               |
8589| --------------------------- | ------------------ |
8590| [ColorFilter](#colorfilter) | 返回颜色滤波器。 |
8591
8592**示例:**
8593
8594```ts
8595import {drawing} from '@kit.ArkGraphics2D';
8596
8597let brush = new drawing.Brush();
8598let setColorFilter = drawing.ColorFilter.createSRGBGammaToLinear();
8599brush.setColorFilter(setColorFilter);
8600let filter = brush.getColorFilter();
8601```
8602
8603### reset<sup>12+</sup>
8604
8605reset(): void
8606
8607重置当前画刷为初始状态。
8608
8609**系统能力:** SystemCapability.Graphics.Drawing
8610
8611**示例:**
8612
8613```ts
8614import { drawing } from '@kit.ArkGraphics2D';
8615
8616const brush = new drawing.Brush();
8617brush.reset();
8618```
8619
8620## ScaleToFit<sup>12+</sup>
8621
8622源矩形到目标矩形的缩放方式枚举。
8623
8624**系统能力:** SystemCapability.Graphics.Drawing
8625
8626| 名称                   | 值   | 说明                           |
8627| ---------------------- | ---- | ------------------------------ |
8628| FILL_SCALE_TO_FIT     | 0    | 将源矩形缩放以填充满整个目标矩形,可能会改变源矩形的长宽比。  |
8629| START_SCALE_TO_FIT    | 1    | 保持源矩形的长宽比进行缩放,并对齐到目标矩形的左上方。 |
8630| CENTER_SCALE_TO_FIT    | 2    | 保持源矩形的长宽比进行缩放,并居中对齐到目标矩形。   |
8631| END_SCALE_TO_FIT | 3    | 保持源矩形的长宽比进行缩放,并对齐到目标矩形的右下方。   |
8632
8633## Matrix<sup>12+</sup>
8634
8635矩阵对象。
8636
8637表示为3*3的矩阵,如下图所示:
8638
8639![matrix_3x3](figures/matrix3X3.PNG)
8640
8641矩阵中的元素从左到右,从上到下分别表示水平缩放系数、水平倾斜系数、水平位移系数、垂直倾斜系数、垂直缩放系数、垂直位移系数、X轴透视系数、Y轴透视系数、透视缩放系数。
8642设(x<sub>1</sub>, y<sub>1</sub>)为源坐标点,(x<sub>2</sub>, y<sub>2</sub>)为源坐标点通过矩阵变换后的坐标点,则两个坐标点的关系如下:
8643
8644![matrix_xy](figures/matrix_xy.PNG)
8645
8646### constructor<sup>12+</sup>
8647
8648constructor()
8649
8650构造一个矩阵对象。
8651
8652**系统能力:** SystemCapability.Graphics.Drawing
8653
8654**示例:**
8655
8656```ts
8657import { drawing } from '@kit.ArkGraphics2D';
8658
8659let matrix = new drawing.Matrix();
8660```
8661
8662### constructor<sup>20+</sup>
8663
8664constructor(matrix: Matrix)
8665
8666拷贝一个矩阵。
8667
8668**系统能力:** SystemCapability.Graphics.Drawing
8669
8670**参数:**
8671
8672| 参数名         | 类型                                       | 必填   | 说明                  |
8673| ----------- | ---------------------------------------- | ---- | ------------------- |
8674| matrix      | [Matrix](#matrix12)                  | 是    | 被拷贝的矩阵。|
8675
8676**示例:**
8677
8678```ts
8679import { drawing } from '@kit.ArkGraphics2D';
8680
8681let matrix = new drawing.Matrix();
8682let matrix2 = new drawing.Matrix(matrix);
8683```
8684
8685### isAffine<sup>20+</sup>
8686
8687isAffine(): boolean
8688
8689判断当前矩阵是否为仿射矩阵。仿射矩阵是一种包括平移、旋转、缩放等变换的矩阵。
8690
8691**系统能力:** SystemCapability.Graphics.Drawing
8692
8693**返回值:**
8694
8695| 类型                        | 说明                  |
8696| --------------------------- | -------------------- |
8697| boolean | 返回当前矩阵是否为仿射矩阵。true表示是仿射矩阵,false表示不是仿射矩阵。 |
8698
8699**示例:**
8700
8701```ts
8702import { drawing } from '@kit.ArkGraphics2D';
8703
8704let matrix = new drawing.Matrix();
8705matrix.setMatrix([1, 0.5, 1, 0.5, 1, 1, 1, 1, 1]);
8706let isAff = matrix.isAffine();
8707console.info('isAff :', isAff);
8708```
8709
8710### rectStaysRect<sup>20+</sup>
8711
8712rectStaysRect(): boolean
8713
8714判断经过该矩阵映射后的矩形的形状是否仍为矩形。
8715
8716**系统能力:** SystemCapability.Graphics.Drawing
8717
8718**返回值:**
8719
8720| 类型                        | 说明                  |
8721| --------------------------- | -------------------- |
8722| boolean | 返回经过该矩阵映射后的矩形的形状是否仍为矩形。true表示仍是矩形,false表示不是矩形。 |
8723
8724**示例:**
8725
8726```ts
8727import { drawing } from '@kit.ArkGraphics2D';
8728
8729let matrix = new drawing.Matrix();
8730matrix.setMatrix([1, 0.5, 1, 0.5, 1, 1, 1, 1, 1]);
8731let matrix2 = new drawing.Matrix(matrix);
8732let isRect = matrix2.rectStaysRect();
8733console.info('isRect :', isRect);
8734```
8735
8736### setSkew<sup>20+</sup>
8737
8738setSkew(kx: number, ky: number, px: number, py: number): void
8739
8740设置矩阵的倾斜系数。
8741
8742**系统能力:** SystemCapability.Graphics.Drawing
8743
8744**参数:**
8745
8746| 参数名         | 类型                                       | 必填   | 说明                       |
8747| ----------- | ---------------------------------------- | ---- | -------------------             |
8748| kx          | number                  | 是    | x轴上的倾斜量,该参数为浮点数。正值会使绘制沿y轴增量方向向右倾斜;负值会使绘制沿y轴增量方向向左倾斜。        |
8749| ky          | number                  | 是    | y轴上的倾斜量,该参数为浮点数。正值会使绘制沿x轴增量方向向下倾斜;负值会使绘制沿x轴增量方向向上倾斜。        |
8750| px          | number                  | 是    | 倾斜中心点的x轴坐标,该参数为浮点数。0表示坐标原点,正数表示位于坐标原点右侧,负数表示位于坐标原点左侧。     |
8751| py          | number                  | 是    | 倾斜中心点的y轴坐标,该参数为浮点数。0表示坐标原点,正数表示位于坐标原点下侧,负数表示位于坐标原点上侧。     |
8752
8753**示例:**
8754
8755```ts
8756import { drawing } from '@kit.ArkGraphics2D';
8757
8758let matrix = new drawing.Matrix();
8759matrix.setMatrix([1, 0.5, 1, 0.5, 1, 1, 1, 1, 1]);
8760matrix.setSkew(2, 0.5, 0.5, 2);
8761```
8762
8763### setSinCos<sup>20+</sup>
8764
8765setSinCos(sinValue: number, cosValue: number, px: number, py: number): void
8766
8767设置矩阵,使其围绕旋转中心(px, py)以指定的正弦值和余弦值旋转。
8768
8769**系统能力:** SystemCapability.Graphics.Drawing
8770
8771**参数:**
8772
8773| 参数名         | 类型                                       | 必填   | 说明            |
8774| ----------- | ---------------------------------------- | ---- | ------------------- |
8775| sinValue          | number                  | 是    | 旋转角度的正弦值。仅当正弦值和余弦值的平方和为1时,为旋转变换,否则矩阵可能包含平移缩放等其他变换。          |
8776| cosValue          | number                  | 是    | 旋转角度的余弦值。仅当正弦值和余弦值的平方和为1时,为旋转变换,否则矩阵可能包含平移缩放等其他变换。            |
8777| px          | number                  | 是    | 旋转中心的x轴坐标,该参数为浮点数。0表示坐标原点,正数表示位于坐标原点右侧,负数表示位于坐标原点左侧。     |
8778| py          | number                  | 是    | 旋转中心的y轴坐标,该参数为浮点数。0表示坐标原点,正数表示位于坐标原点下侧,负数表示位于坐标原点上侧。    |
8779
8780**示例:**
8781
8782```ts
8783import { drawing } from '@kit.ArkGraphics2D';
8784
8785let matrix = new drawing.Matrix();
8786matrix.setMatrix([1, 0.5, 1, 0.5, 1, 1, 1, 1, 1]);
8787matrix.setSinCos(0, 1, 1, 0);
8788```
8789### setRotation<sup>12+</sup>
8790
8791setRotation(degree: number, px: number, py: number): void
8792
8793设置矩阵为单位矩阵,并围绕位于(px, py)的旋转轴点进行旋转。
8794
8795**系统能力:** SystemCapability.Graphics.Drawing
8796
8797**参数:**
8798
8799| 参数名         | 类型                                       | 必填   | 说明                  |
8800| ----------- | ---------------------------------------- | ---- | ------------------- |
8801| degree      | number                  | 是    | 角度,单位为度。正数表示顺时针旋转,负数表示逆时针旋转,该参数为浮点数。|
8802| px          | number                  | 是    | 旋转轴点的横坐标,该参数为浮点数。     |
8803| py          | number                  | 是    | 旋转轴点的纵坐标,该参数为浮点数。     |
8804
8805**错误码:**
8806
8807以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
8808
8809| 错误码ID | 错误信息 |
8810| ------- | --------------------------------------------|
8811| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
8812
8813**示例:**
8814
8815```ts
8816import { drawing } from '@kit.ArkGraphics2D';
8817
8818let matrix = new drawing.Matrix();
8819matrix.setRotation(90, 100, 100);
8820```
8821
8822### setScale<sup>12+</sup>
8823
8824setScale(sx: number, sy: number, px: number, py: number): void
8825
8826设置矩阵为单位矩阵围绕位于(px, py)的中心点,以sx和sy进行缩放后的结果。
8827
8828**系统能力:** SystemCapability.Graphics.Drawing
8829
8830**参数:**
8831
8832| 参数名         | 类型                                       | 必填   | 说明                  |
8833| ----------- | ---------------------------------------- | ---- | ------------------- |
8834| sx          | number                  | 是    | x轴方向缩放系数,为负数时可看作是先关于y = px作镜像翻转后再进行缩放,该参数为浮点数。     |
8835| sy          | number                  | 是    | y轴方向缩放系数,为负数时可看作是先关于x = py作镜像翻转后再进行缩放,该参数为浮点数。     |
8836| px          | number                  | 是    |  缩放中心点的横坐标,该参数为浮点数。      |
8837| py          | number                  | 是    |  缩放中心点的纵坐标,该参数为浮点数。      |
8838
8839**错误码:**
8840
8841以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
8842
8843| 错误码ID | 错误信息 |
8844| ------- | --------------------------------------------|
8845| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
8846
8847**示例:**
8848
8849```ts
8850import { drawing } from '@kit.ArkGraphics2D';
8851
8852let matrix = new drawing.Matrix();
8853matrix.setScale(100, 100, 150, 150);
8854```
8855
8856### setTranslation<sup>12+</sup>
8857
8858setTranslation(dx: number, dy: number): void
8859
8860设置矩阵为单位矩阵平移(dx, dy)后的结果。
8861
8862**系统能力:** SystemCapability.Graphics.Drawing
8863
8864**参数:**
8865
8866| 参数名         | 类型                                       | 必填   | 说明                  |
8867| ----------- | ---------------------------------------- | ---- | ------------------- |
8868| dx          | number                  | 是    | x轴方向平移距离,正数表示往x轴正方向平移,负数表示往x轴负方向平移,该参数为浮点数。     |
8869| dy          | number                  | 是    | y轴方向平移距离,正数表示往y轴正方向平移,负数表示往y轴负方向平移,该参数为浮点数。     |
8870
8871**错误码:**
8872
8873以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
8874
8875| 错误码ID | 错误信息 |
8876| ------- | --------------------------------------------|
8877| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
8878
8879**示例:**
8880
8881```ts
8882import { drawing } from '@kit.ArkGraphics2D';
8883
8884let matrix = new drawing.Matrix();
8885matrix.setTranslation(100, 100);
8886```
8887
8888### setMatrix<sup>12+</sup>
8889
8890setMatrix(values: Array\<number>): void
8891
8892设置矩阵对象的各项参数。
8893
8894**系统能力:** SystemCapability.Graphics.Drawing
8895
8896**参数:**
8897
8898| 参数名 | 类型                                                 | 必填 | 说明             |
8899| ------ | ---------------------------------------------------- | ---- | ---------------- |
8900| values  | Array\<number> | 是   | 长度为9的浮点数组,表示矩阵对象参数。数组中的值按下标从小,到大分别表示水平缩放系数、水平倾斜系数、水平位移系数、垂直倾斜系数、垂直缩放系数、垂直位移系数、X轴透视系数、Y轴透视系数、透视缩放系数。 |
8901
8902**错误码:**
8903
8904以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
8905
8906| 错误码ID | 错误信息 |
8907| ------- | --------------------------------------------|
8908| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types; 3. Parameter verification failed. |
8909
8910**示例:**
8911
8912```ts
8913import { drawing } from '@kit.ArkGraphics2D';
8914
8915let matrix = new drawing.Matrix();
8916let value : Array<number> = [2, 2, 2, 2, 2, 2, 2, 2, 2];
8917matrix.setMatrix(value);
8918```
8919
8920### preConcat<sup>12+</sup>
8921
8922preConcat(matrix: Matrix): void
8923
8924将当前矩阵设置为当前矩阵左乘matrix的结果。
8925
8926**系统能力:** SystemCapability.Graphics.Drawing
8927
8928**参数:**
8929
8930| 参数名 | 类型                                                 | 必填 | 说明             |
8931| ------ | ---------------------------------------------------- | ---- | ---------------- |
8932| matrix  | [Matrix](#matrix12) | 是   | 表示矩阵对象,位于乘法表达式右侧。 |
8933
8934**错误码:**
8935
8936以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
8937
8938| 错误码ID | 错误信息 |
8939| ------- | --------------------------------------------|
8940| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
8941
8942**示例:**
8943
8944```ts
8945import { drawing } from '@kit.ArkGraphics2D';
8946
8947let matrix1 = new drawing.Matrix();
8948matrix1.setMatrix([2, 1, 3, 1, 2, 1, 3, 1, 2]);
8949let matrix2 = new drawing.Matrix();
8950matrix2.setMatrix([-2, 1, 3, 1, 0, -1, 3, -1, 2]);
8951matrix1.preConcat(matrix2);
8952```
8953
8954### setMatrix<sup>20+</sup>
8955
8956setMatrix(matrix: Array\<number\> \| Matrix): void
8957
8958用一个矩阵对当前矩阵进行更新。
8959
8960**系统能力:** SystemCapability.Graphics.Drawing
8961
8962| 参数名 | 类型                                                 | 必填 | 说明             |
8963| ------ | ---------------------------------------------------- | ---- | ---------------- |
8964| matrix | Array\<number\> \| [Matrix](#matrix12) | 是   | 用于更新的数组或矩阵。 |
8965
8966**示例:**
8967
8968```ts
8969import { drawing } from '@kit.ArkGraphics2D';
8970
8971let matrix1 = new drawing.Matrix();
8972matrix1.setMatrix([2, 1, 3, 1, 2, 1, 3, 1, 2]);
8973let matrix2 = new drawing.Matrix();
8974matrix1.setMatrix(matrix2);
8975```
8976
8977### setConcat<sup>20+</sup>
8978
8979setConcat(matrixA: Matrix, matrixB: Matrix): void
8980
8981用两个矩阵的乘积更新当前矩阵。
8982
8983**系统能力:** SystemCapability.Graphics.Drawing
8984
8985| 参数名 | 类型                                                 | 必填 | 说明             |
8986| ------ | ---------------------------------------------------- | ---- | ---------------- |
8987| matrixA  | [Matrix](#matrix12) | 是   | 用于运算的矩阵A。 |
8988| matrixB  | [Matrix](#matrix12) | 是   | 用于运算的矩阵B。 |
8989
8990**示例:**
8991
8992```ts
8993import { drawing } from '@kit.ArkGraphics2D';
8994
8995let matrix1 = new drawing.Matrix();
8996matrix1.setMatrix([2, 1, 3, 1, 2, 1, 3, 1, 2]);
8997let matrix2 = new drawing.Matrix();
8998matrix2.setMatrix([-2, 1, 3, 1, 0, -1, 3, -1, 2]);
8999matrix1.setConcat(matrix2, matrix1);
9000```
9001
9002### postConcat<sup>20+</sup>
9003
9004postConcat(matrix: Matrix): void
9005
9006用当前矩阵右乘一个矩阵。
9007
9008**系统能力:** SystemCapability.Graphics.Drawing
9009
9010| 参数名 | 类型                                                 | 必填 | 说明             |
9011| ------ | ---------------------------------------------------- | ---- | ---------------- |
9012| matrix | [Matrix](#matrix12) | 是   | 用于运算的矩阵。 |
9013
9014**示例:**
9015
9016```ts
9017import { drawing } from '@kit.ArkGraphics2D';
9018
9019let matrix = new drawing.Matrix();
9020if (matrix.isIdentity()) {
9021  console.info("matrix is identity.");
9022} else {
9023  console.info("matrix is not identity.");
9024}
9025let matrix1 = new drawing.Matrix();
9026matrix1.setMatrix([2, 1, 3, 1, 2, 1, 3, 1, 2]);
9027let matrix2 = new drawing.Matrix();
9028matrix2.setMatrix([-2, 1, 3, 1, 0, -1, 3, -1, 2]);
9029matrix1.postConcat(matrix2);
9030```
9031
9032### isEqual<sup>12+</sup>
9033
9034isEqual(matrix: Matrix): Boolean
9035
9036判断两个矩阵是否相等。
9037
9038**系统能力:** SystemCapability.Graphics.Drawing
9039
9040**参数:**
9041
9042| 参数名 | 类型                                                 | 必填 | 说明             |
9043| ------ | ---------------------------------------------------- | ---- | ---------------- |
9044| matrix  | [Matrix](#matrix12) | 是   | 另一个矩阵。 |
9045
9046**返回值:**
9047
9048| 类型                        | 说明                  |
9049| --------------------------- | -------------------- |
9050| Boolean | 返回两个矩阵的比较结果。true表示两个矩阵相等,false表示两个矩阵不相等。 |
9051
9052**错误码:**
9053
9054以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
9055
9056| 错误码ID | 错误信息 |
9057| ------- | --------------------------------------------|
9058| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
9059
9060**示例:**
9061
9062```ts
9063import { drawing } from '@kit.ArkGraphics2D';
9064
9065let matrix1 = new drawing.Matrix();
9066matrix1.setMatrix([2, 1, 3, 1, 2, 1, 3, 1, 2]);
9067let matrix2 = new drawing.Matrix();
9068matrix2.setMatrix([-2, 1, 3, 1, 0, -1, 3, -1, 2]);
9069if (matrix1.isEqual(matrix2)) {
9070  console.info("matrix1 and matrix2 are equal.");
9071} else {
9072  console.info("matrix1 and matrix2 are not equal.");
9073}
9074```
9075
9076### invert<sup>12+</sup>
9077
9078invert(matrix: Matrix): Boolean
9079
9080将矩阵matrix设置为当前矩阵的逆矩阵,并返回是否设置成功的结果。
9081
9082**系统能力:** SystemCapability.Graphics.Drawing
9083
9084**参数:**
9085
9086| 参数名 | 类型                                                 | 必填 | 说明             |
9087| ------ | ---------------------------------------------------- | ---- | ---------------- |
9088| matrix  | [Matrix](#matrix12) | 是   | 矩阵对象,用于存储获取到的逆矩阵。 |
9089
9090**返回值:**
9091
9092| 类型                        | 说明                  |
9093| --------------------------- | -------------------- |
9094| Boolean | 返回matrix是否被设置为逆矩阵的结果。true表示当前矩阵可逆,matrix被设置为逆矩阵,false表示当前矩阵不可逆,matrix不被设置。 |
9095
9096**错误码:**
9097
9098以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
9099
9100| 错误码ID | 错误信息 |
9101| ------- | --------------------------------------------|
9102| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
9103
9104**示例:**
9105
9106```ts
9107import { drawing } from '@kit.ArkGraphics2D';
9108
9109let matrix1 = new drawing.Matrix();
9110matrix1.setMatrix([2, 1, 3, 1, 2, 1, 3, 1, 2]);
9111let matrix2 = new drawing.Matrix();
9112matrix2.setMatrix([-2, 1, 3, 1, 0, -1, 3, -1, 2]);
9113if (matrix1.invert(matrix2)) {
9114  console.info("matrix1 is invertible and matrix2 is set as an inverse matrix of the matrix1.");
9115} else {
9116  console.info("matrix1 is not invertible and matrix2 is not changed.");
9117}
9118```
9119
9120### isIdentity<sup>12+</sup>
9121
9122isIdentity(): Boolean
9123
9124判断矩阵是否是单位矩阵。
9125
9126**系统能力:** SystemCapability.Graphics.Drawing
9127
9128**返回值:**
9129
9130| 类型                        | 说明                  |
9131| --------------------------- | -------------------- |
9132| Boolean | 返回矩阵是否是单位矩阵。true表示矩阵是单位矩阵,false表示矩阵不是单位矩阵。 |
9133
9134**示例:**
9135
9136```ts
9137import { drawing } from '@kit.ArkGraphics2D';
9138
9139let matrix = new drawing.Matrix();
9140if (matrix.isIdentity()) {
9141  console.info("matrix is identity.");
9142} else {
9143  console.info("matrix is not identity.");
9144}
9145```
9146
9147### getValue<sup>12+</sup>
9148
9149getValue(index: number): number
9150
9151获取矩阵给定索引位的值。索引范围0-8。
9152
9153**系统能力:** SystemCapability.Graphics.Drawing
9154
9155**参数:**
9156
9157| 参数名          | 类型    | 必填 | 说明                                                        |
9158| --------------- | ------- | ---- | ----------------------------------------------------------- |
9159| index | number | 是   | 索引位置,范围0-8,该参数为整数。 |
9160
9161**返回值:**
9162
9163| 类型                  | 说明           |
9164| --------------------- | -------------- |
9165| number | 函数返回矩阵给定索引位对应的值,该返回值为整数。 |
9166
9167**错误码:**
9168
9169以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
9170
9171| 错误码ID | 错误信息 |
9172| ------- | --------------------------------------------|
9173| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types;3. Parameter verification failed.|
9174
9175**示例:**
9176
9177```ts
9178import {drawing} from "@kit.ArkGraphics2D";
9179
9180let matrix = new drawing.Matrix();
9181for (let i = 0; i < 9; i++) {
9182    console.info("matrix "+matrix.getValue(i).toString());
9183}
9184```
9185
9186### postRotate<sup>12+</sup>
9187
9188postRotate(degree: number, px: number, py: number): void
9189
9190将矩阵设置为矩阵右乘围绕轴心点旋转一定角度的单位矩阵后得到的矩阵。
9191
9192**系统能力:** SystemCapability.Graphics.Drawing
9193
9194**参数:**
9195
9196| 参数名          | 类型    | 必填 | 说明                                                        |
9197| --------------- | ------- | ---- | ----------------------------------------------------------- |
9198| degree | number | 是   | 旋转角度,单位为度。正数表示顺时针旋转,负数表示逆时针旋转,该参数为浮点数。 |
9199| px | number | 是   | 旋转中心点的横坐标,该参数为浮点数。 |
9200| py | number | 是   | 旋转中心点的纵坐标,该参数为浮点数。 |
9201
9202**错误码:**
9203
9204以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
9205
9206| 错误码ID | 错误信息 |
9207| ------- | --------------------------------------------|
9208| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
9209
9210**示例:**
9211
9212```ts
9213import {drawing} from "@kit.ArkGraphics2D";
9214
9215let matrix = new drawing.Matrix();
9216let degree: number = 2;
9217let px: number = 3;
9218let py: number = 4;
9219matrix.postRotate(degree, px, py);
9220console.info("matrix= "+matrix.getAll().toString());
9221```
9222
9223### postScale<sup>12+</sup>
9224
9225postScale(sx: number, sy: number, px: number, py: number): void
9226
9227将矩阵设置为矩阵右乘围绕轴心点按一定缩放系数缩放后的单位矩阵后得到的矩阵。
9228
9229**系统能力:** SystemCapability.Graphics.Drawing
9230
9231**参数:**
9232
9233| 参数名          | 类型    | 必填 | 说明                                                        |
9234| --------------- | ------- | ---- | ----------------------------------------------------------- |
9235| sx | number | 是   | x轴方向缩放系数,负数表示先关于y = px作镜像翻转后再进行缩放,该参数为浮点数。 |
9236| sy | number | 是   | y轴方向缩放系数,负数表示先关于x = py作镜像翻转后再进行缩放,该参数为浮点数。 |
9237| px | number | 是   | 缩放中心点的横坐标,该参数为浮点数。 |
9238| py | number | 是   | 缩放中心点的纵坐标,该参数为浮点数。 |
9239
9240**错误码:**
9241
9242以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
9243
9244| 错误码ID | 错误信息 |
9245| ------- | --------------------------------------------|
9246| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
9247
9248**示例:**
9249
9250```ts
9251import {drawing} from "@kit.ArkGraphics2D";
9252
9253let matrix = new drawing.Matrix();
9254let sx: number = 2;
9255let sy: number = 0.5;
9256let px: number = 1;
9257let py: number = 1;
9258matrix.postScale(sx, sy, px, py);
9259console.info("matrix= "+matrix.getAll().toString());
9260```
9261
9262### postTranslate<sup>12+</sup>
9263
9264postTranslate(dx: number, dy: number): void
9265
9266将矩阵设置为矩阵右乘平移一定距离后的单位矩阵后得到的矩阵。
9267
9268**系统能力:** SystemCapability.Graphics.Drawing
9269
9270**参数:**
9271
9272| 参数名          | 类型    | 必填 | 说明                                                        |
9273| --------------- | ------- | ---- | ----------------------------------------------------------- |
9274| dx | number | 是   | x轴方向平移距离,正数表示往x轴正方向平移,负数表示往x轴负方向平移,该参数为浮点数。 |
9275| dy | number | 是   | y轴方向平移距离,正数表示往y轴正方向平移,负数表示往y轴负方向平移,该参数为浮点数。 |
9276
9277**错误码:**
9278
9279以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
9280
9281| 错误码ID | 错误信息 |
9282| ------- | --------------------------------------------|
9283| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
9284
9285**示例:**
9286
9287```ts
9288import {drawing} from "@kit.ArkGraphics2D";
9289
9290let matrix = new drawing.Matrix();
9291let dx: number = 3;
9292let dy: number = 4;
9293matrix.postTranslate(dx, dy);
9294console.info("matrix= "+matrix.getAll().toString());
9295```
9296
9297### preRotate<sup>12+</sup>
9298
9299preRotate(degree: number, px: number, py: number): void
9300
9301将矩阵设置为矩阵左乘围绕轴心点旋转一定角度的单位矩阵后得到的矩阵。
9302
9303**系统能力:** SystemCapability.Graphics.Drawing
9304
9305**参数:**
9306
9307| 参数名          | 类型    | 必填 | 说明                                                        |
9308| --------------- | ------- | ---- | ----------------------------------------------------------- |
9309| degree | number | 是   | 旋转角度,单位为度。正数表示顺时针旋转,负数表示逆时针旋转,该参数为浮点数。 |
9310| px | number | 是   | 旋转中心点的横坐标,该参数为浮点数。 |
9311| py | number | 是   | 旋转中心点的纵坐标,该参数为浮点数。 |
9312
9313**错误码:**
9314
9315以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
9316
9317| 错误码ID | 错误信息 |
9318| ------- | --------------------------------------------|
9319| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
9320
9321**示例:**
9322
9323```ts
9324import {drawing} from "@kit.ArkGraphics2D";
9325
9326let matrix = new drawing.Matrix();
9327let degree: number = 2;
9328let px: number = 3;
9329let py: number = 4;
9330matrix.preRotate(degree, px, py);
9331console.info("matrix= "+matrix.getAll().toString());
9332```
9333
9334### postSkew<sup>20+</sup>
9335
9336postSkew(kx: number, ky: number, px: number, py: number): void
9337
9338当前矩阵右乘一个倾斜变换矩阵。
9339
9340**系统能力:** SystemCapability.Graphics.Drawing
9341
9342**参数:**
9343
9344| 参数名         | 类型                                       | 必填   | 说明             |
9345| ----------- | ---------------------------------------- | ---- | -------------------   |
9346| kx          | number                  | 是    | x轴上的倾斜量,该参数为浮点数。正值会使绘制沿y轴增量方向向右倾斜;负值会使绘制沿y轴增量方向向左倾斜。           |
9347| ky          | number                  | 是    | y轴上的倾斜量,该参数为浮点数。正值会使绘制沿x轴增量方向向下倾斜;负值会使绘制沿x轴增量方向向上倾斜。           |
9348| px          | number                  | 是    | 倾斜中心点的x轴坐标,该参数为浮点数。0表示坐标原点,正数表示位于坐标原点右侧,负数表示位于坐标原点左侧。    |
9349| py          | number                  | 是    | 倾斜中心点的y轴坐标,该参数为浮点数。0表示坐标原点,正数表示位于坐标原点下侧,负数表示位于坐标原点上侧。   |
9350
9351**示例:**
9352
9353```ts
9354import {drawing} from "@kit.ArkGraphics2D"
9355let matrix = new drawing.Matrix();
9356matrix.postSkew(2.0, 1.0, 2.0, 1.0);
9357```
9358
9359### preSkew<sup>20+</sup>
9360
9361 preSkew(kx: number, ky: number, px: number, py: number): void
9362
9363当前矩阵左乘一个倾斜变换矩阵。
9364
9365**系统能力:** SystemCapability.Graphics.Drawing
9366
9367**参数:**
9368
9369| 参数名         | 类型                                       | 必填   | 说明             |
9370| ----------- | ---------------------------------------- | ---- | -------------------   |
9371| kx          | number                  | 是    | x轴上的倾斜量,该参数为浮点数。正值会使绘制沿y轴增量方向向右倾斜;负值会使绘制沿y轴增量方向向左倾斜。           |
9372| ky          | number                  | 是    | y轴上的倾斜量,该参数为浮点数。正值会使绘制沿x轴增量方向向下倾斜;负值会使绘制沿x轴增量方向向上倾斜。           |
9373| px          | number                  | 是    | 倾斜中心点的x轴坐标,该参数为浮点数。0表示坐标原点,正数表示位于坐标原点右侧,负数表示位于坐标原点左侧。        |
9374| py          | number                  | 是    | 倾斜中心点的y轴坐标,该参数为浮点数。0表示坐标原点,正数表示位于坐标原点下侧,负数表示位于坐标原点上侧。        |
9375
9376**示例:**
9377
9378```ts
9379import {drawing} from "@kit.ArkGraphics2D"
9380let matrix = new drawing.Matrix();
9381matrix.preSkew(2.0, 1.0, 2.0, 1.0);
9382```
9383
9384### mapRadius<sup>20+</sup>
9385
9386mapRadius(radius: number): number
9387
9388返回半径为radius的圆经过当前矩阵映射形成的椭圆的平均半径。平均半径的平方为椭圆长轴长度和短轴长度的乘积。若当前矩阵包含透视变换,则该结果无意义。
9389
9390**系统能力:** SystemCapability.Graphics.Drawing
9391
9392| 参数名 | 类型                                                 | 必填 | 说明             |
9393| ------ | ---------------------------------------------------- | ---- | ---------------- |
9394| radius  | number | 是   | 用于计算的圆的半径,浮点数。如果是负数,则按照绝对值进行计算。 |
9395
9396**返回值:**
9397
9398| 类型                        | 说明                  |
9399| --------------------------- | -------------------- |
9400| number | 返回经过变换之后的平均半径。 |
9401
9402**示例:**
9403
9404```ts
9405import {drawing} from "@kit.ArkGraphics2D"
9406
9407let matrix = new drawing.Matrix();
9408matrix.setMatrix([2, 1, 3, 1, 2, 1, 3, 1, 2]);
9409let radius = matrix.mapRadius(10);
9410console.info('radius', radius);
9411```
9412
9413### preScale<sup>12+</sup>
9414
9415preScale(sx: number, sy: number, px: number, py: number): void
9416
9417将矩阵设置为矩阵左乘围绕轴心点按一定缩放系数缩放后的单位矩阵后得到的矩阵。
9418
9419**系统能力:** SystemCapability.Graphics.Drawing
9420
9421**参数:**
9422
9423| 参数名          | 类型    | 必填 | 说明                                                        |
9424| --------------- | ------- | ---- | ----------------------------------------------------------- |
9425| sx | number | 是   | x轴方向缩放系数,为负数时可看作是先关于y = px作镜像翻转后再进行缩放,该参数为浮点数。 |
9426| sy | number | 是   | y轴方向缩放系数,为负数时可看作是先关于x = py作镜像翻转后再进行缩放,该参数为浮点数。 |
9427| px | number | 是   | 轴心点横坐标,该参数为浮点数。 |
9428| py | number | 是   | 轴心点纵坐标,该参数为浮点数。 |
9429
9430**错误码:**
9431
9432以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
9433
9434| 错误码ID | 错误信息 |
9435| ------- | --------------------------------------------|
9436| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
9437
9438**示例:**
9439
9440```ts
9441import {drawing} from "@kit.ArkGraphics2D";
9442
9443let matrix = new drawing.Matrix();
9444let sx: number = 2;
9445let sy: number = 0.5;
9446let px: number = 1;
9447let py: number = 1;
9448matrix.preScale(sx, sy, px, py);
9449console.info("matrix"+matrix.getAll().toString());
9450```
9451
9452### preTranslate<sup>12+</sup>
9453
9454preTranslate(dx: number, dy: number): void
9455
9456将矩阵设置为矩阵左乘平移一定距离后的单位矩阵后得到的矩阵。
9457
9458**系统能力:** SystemCapability.Graphics.Drawing
9459
9460**参数:**
9461
9462| 参数名          | 类型    | 必填 | 说明                                                        |
9463| --------------- | ------- | ---- | ----------------------------------------------------------- |
9464| dx | number | 是   | x轴方向平移距离,正数表示往x轴正方向平移,负数表示往x轴负方向平移,该参数为浮点数。 |
9465| dy | number | 是   | y轴方向平移距离,正数表示往y轴正方向平移,负数表示往y轴负方向平移,该参数为浮点数。 |
9466
9467**错误码:**
9468
9469以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
9470
9471| 错误码ID | 错误信息 |
9472| ------- | --------------------------------------------|
9473| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
9474
9475**示例:**
9476
9477```ts
9478import {drawing} from "@kit.ArkGraphics2D";
9479
9480let matrix = new drawing.Matrix();
9481let dx: number = 3;
9482let dy: number = 4;
9483matrix.preTranslate(dx, dy);
9484console.info("matrix"+matrix.getAll().toString());
9485```
9486
9487### reset<sup>12+</sup>
9488
9489reset(): void
9490
9491重置当前矩阵为单位矩阵。
9492
9493**系统能力:** SystemCapability.Graphics.Drawing
9494
9495**示例:**
9496
9497```ts
9498import {drawing} from "@kit.ArkGraphics2D";
9499
9500let matrix = new drawing.Matrix();
9501matrix.postScale(2, 3, 4, 5);
9502matrix.reset();
9503console.info("matrix= "+matrix.getAll().toString());
9504```
9505
9506### mapPoints<sup>12+</sup>
9507
9508mapPoints(src: Array\<common2D.Point>): Array\<common2D.Point>
9509
9510通过矩阵变换将源点数组映射到目标点数组。
9511
9512**系统能力:** SystemCapability.Graphics.Drawing
9513
9514**参数:**
9515
9516| 参数名          | 类型    | 必填 | 说明                                                        |
9517| --------------- | ------- | ---- | ----------------------------------------------------------- |
9518| src | Array\<[common2D.Point](js-apis-graphics-common2D.md#point12)> | 是   | 源点数组。 |
9519
9520**返回值:**
9521
9522| 类型                  | 说明           |
9523| --------------------- | -------------- |
9524| Array\<[common2D.Point](js-apis-graphics-common2D.md#point12)> | 源点数组经矩阵变换后的点数组。 |
9525
9526**错误码:**
9527
9528以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
9529
9530| 错误码ID | 错误信息 |
9531| ------- | --------------------------------------------|
9532| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
9533
9534**示例:**
9535
9536```ts
9537import {drawing,common2D} from "@kit.ArkGraphics2D";
9538
9539let src: Array<common2D.Point> = [];
9540src.push({x: 15, y: 20});
9541src.push({x: 20, y: 15});
9542src.push({x: 30, y: 10});
9543let matrix = new drawing.Matrix();
9544let dst: Array<common2D.Point> = matrix.mapPoints(src);
9545console.info("matrix= src: "+JSON.stringify(src));
9546console.info("matrix= dst: "+JSON.stringify(dst));
9547```
9548
9549### getAll<sup>12+</sup>
9550
9551getAll(): Array\<number>
9552
9553获取矩阵的所有元素值。
9554
9555**系统能力:** SystemCapability.Graphics.Drawing
9556
9557**返回值:**
9558
9559| 类型                  | 说明           |
9560| --------------------- | -------------- |
9561| Array\<number> | 存储矩阵元素值的浮点数组,长度为9。 |
9562
9563**示例:**
9564
9565```ts
9566import {drawing} from "@kit.ArkGraphics2D";
9567
9568let matrix = new drawing.Matrix();
9569console.info("matrix "+ matrix.getAll());
9570```
9571
9572### mapRect<sup>12+</sup>
9573
9574mapRect(dst: common2D.Rect, src: common2D.Rect): boolean
9575
9576将目标矩形设置为源矩形通过矩阵变换后的图形的外接矩形。如下图所示,蓝色矩形为源矩形,假设黄色矩形为源矩形通过矩阵变换形成的图形,此时黄色矩形的边不与坐标轴平行,无法使用矩形对象表示,因此,将目标矩形设置为黄色矩形的外接矩形,即黑色矩形。
9577
9578![mapRect](./figures/zh-ch_matrix_mapRect.png)
9579
9580**系统能力:** SystemCapability.Graphics.Drawing
9581
9582**参数:**
9583
9584| 参数名          | 类型    | 必填 | 说明                                                        |
9585| --------------- | ------- | ---- | ----------------------------------------------------------- |
9586| dst | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 目标矩形对象,用于存储源矩形经矩阵变换后的图形的外接矩形。 |
9587| src |[common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 源矩形对象。 |
9588
9589**返回值:**
9590
9591| 类型                  | 说明           |
9592| --------------------- | -------------- |
9593| boolean | 返回源矩形经过矩阵变换后的图形是否仍然是矩形,true表示是矩形,false表示不是矩形。 |
9594
9595**错误码:**
9596
9597以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
9598
9599| 错误码ID | 错误信息 |
9600| ------- | --------------------------------------------|
9601| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
9602
9603**示例:**
9604
9605```ts
9606import {drawing,common2D} from "@kit.ArkGraphics2D";
9607
9608let dst: common2D.Rect = { left: 100, top: 20, right: 130, bottom: 60 };
9609let src: common2D.Rect = { left: 100, top: 80, right: 130, bottom: 120 };
9610let matrix = new drawing.Matrix();
9611if (matrix.mapRect(dst, src)) {
9612    console.info("matrix= dst "+JSON.stringify(dst));
9613}
9614```
9615
9616### setRectToRect<sup>12+</sup>
9617
9618setRectToRect(src: common2D.Rect, dst: common2D.Rect, scaleToFit: ScaleToFit): boolean
9619
9620将当前矩阵设置为能使源矩形映射到目标矩形的变换矩阵。
9621
9622**系统能力:** SystemCapability.Graphics.Drawing
9623
9624**参数:**
9625
9626| 参数名          | 类型    | 必填 | 说明                                                        |
9627| --------------- | ------- | ---- | ----------------------------------------------------------- |
9628| src | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 源矩形。 |
9629| dst | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 目标矩形。 |
9630| scaleToFit | [ScaleToFit](#scaletofit12) | 是   | 源矩形到目标矩形的映射方式。 |
9631
9632**返回值:**
9633
9634| 类型                  | 说明           |
9635| --------------------- | -------------- |
9636| boolean | 返回矩阵是否可以表示矩形之间的映射,true表示可以,false表示不可以。如果源矩形的宽高任意一个小于等于0,则返回false,并将矩阵设置为单位矩阵;如果目标矩形的宽高任意一个小于等于0,则返回true,并将矩阵设置为除透视缩放系数为1外其余值皆为0的矩阵。 |
9637
9638**错误码:**
9639
9640以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
9641
9642| 错误码ID | 错误信息 |
9643| ------- | --------------------------------------------|
9644| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
9645
9646**示例:**
9647
9648```ts
9649import {drawing,common2D} from "@kit.ArkGraphics2D";
9650
9651let src: common2D.Rect = { left: 100, top: 100, right: 300, bottom: 300 };
9652let dst: common2D.Rect = { left: 200, top: 200, right: 600, bottom: 600 };
9653let scaleToFit: drawing.ScaleToFit = drawing.ScaleToFit.FILL_SCALE_TO_FIT
9654let matrix = new drawing.Matrix();
9655if (matrix.setRectToRect(src, dst, scaleToFit)) {
9656    console.info("matrix"+matrix.getAll().toString());
9657}
9658```
9659
9660### setPolyToPoly<sup>12+</sup>
9661
9662setPolyToPoly(src: Array\<common2D.Point>, dst: Array\<common2D.Point>, count: number): boolean
9663
9664将当前矩阵设置为能够将源点数组映射到目标点数组的变换矩阵。源点和目标点的个数必须大于等于0,小于等于4。
9665
9666**系统能力:** SystemCapability.Graphics.Drawing
9667
9668**参数:**
9669
9670| 参数名          | 类型    | 必填 | 说明                                                        |
9671| --------------- | ------- | ---- | ----------------------------------------------------------- |
9672| src | Array\<[common2D.Point](js-apis-graphics-common2D.md#point12)> | 是   | 源点数组,长度必须为count。 |
9673| dst | Array\<[common2D.Point](js-apis-graphics-common2D.md#point12)> | 是   | 目标点数组,长度必须为count。 |
9674| count | number | 是   | 在src和dst点的数量,该参数为整数。 |
9675
9676**返回值:**
9677
9678| 类型                  | 说明           |
9679| --------------------- | -------------- |
9680| boolean | 返回设置矩阵是否成功的结果,true表示设置成功,false表示设置失败。 |
9681
9682**错误码:**
9683
9684以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
9685
9686| 错误码ID | 错误信息 |
9687| ------- | --------------------------------------------|
9688| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
9689
9690**示例:**
9691
9692```ts
9693import {drawing,common2D} from "@kit.ArkGraphics2D";
9694
9695let srcPoints: Array<common2D.Point> = [ {x: 10, y: 20}, {x: 200, y: 150} ];
9696let dstPoints: Array<common2D.Point> = [{ x:0, y: 10 }, { x:300, y: 600 }];
9697let matrix = new drawing.Matrix();
9698if (matrix.setPolyToPoly(srcPoints, dstPoints, 2)) {
9699    console.info("matrix"+matrix.getAll().toString());
9700}
9701```
9702
9703## RoundRect<sup>12+</sup>
9704
9705圆角矩形对象。
9706
9707### constructor<sup>20+</sup>
9708
9709constructor(roundRect: RoundRect)
9710
9711拷贝一个圆角矩形。
9712
9713**系统能力:** SystemCapability.Graphics.Drawing
9714
9715**参数:**
9716
9717| 参数名         | 类型                                       | 必填   | 说明                  |
9718| ----------- | ---------------------------------------- | ---- | ------------------- |
9719| roundRect        | [RoundRect](#roundrect12) | 是    |  用于拷贝的圆角矩形。   |
9720
9721**示例:**
9722
9723```ts
9724import { common2D, drawing } from '@kit.ArkGraphics2D';
9725
9726let rect: common2D.Rect = {left : 100, top : 100, right : 500, bottom : 300};
9727let roundRect = new drawing.RoundRect(rect, 50, 50);
9728let roundRect2 = new drawing.RoundRect(roundRect);
9729```
9730
9731### constructor<sup>12+</sup>
9732
9733constructor(rect: common2D.Rect, xRadii: number, yRadii: number)
9734
9735构造一个圆角矩形对象,当且仅当xRadii和yRadii均大于0时,圆角生效,否则只会构造一个矩形。
9736
9737**系统能力:** SystemCapability.Graphics.Drawing
9738
9739**参数:**
9740
9741| 参数名         | 类型                                       | 必填   | 说明                  |
9742| ----------- | ---------------------------------------- | ---- | ------------------- |
9743| rect        | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是    | 需要创建的圆角矩形区域。      |
9744| xRadii        | number                  | 是    | X轴上的圆角半径,该参数为浮点数,小于等于0时无效。     |
9745| yRadii        | number                  | 是    | Y轴上的圆角半径,该参数为浮点数,小于等于0时无效。     |
9746
9747**错误码:**
9748
9749以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
9750
9751| 错误码ID | 错误信息 |
9752| ------- | --------------------------------------------|
9753| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
9754
9755**示例:**
9756
9757```ts
9758import { common2D, drawing } from '@kit.ArkGraphics2D';
9759
9760let rect: common2D.Rect = {left : 100, top : 100, right : 500, bottom : 300};
9761let roundRect = new drawing.RoundRect(rect, 50, 50);
9762```
9763### setCorner<sup>12+</sup>
9764
9765setCorner(pos: CornerPos, x: number, y: number): void
9766
9767设置圆角矩形中指定圆角位置的圆角半径。
9768
9769**系统能力:** SystemCapability.Graphics.Drawing
9770
9771**参数:**
9772
9773| 参数名   | 类型                                         | 必填 | 说明                            |
9774| -------- | -------------------------------------------- | ---- | ------------------------------- |
9775| pos | [CornerPos](#cornerpos12) | 是   | 圆角位置。                 |
9776| x     | number                 | 是   | x轴方向的圆角半径,该参数为浮点数,小于等于0时无效。 |
9777| y     | number      | 是   | y轴方向的圆角半径,该参数为浮点数,小于等于0时无效。 |
9778
9779**错误码:**
9780
9781以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
9782
9783| 错误码ID | 错误信息 |
9784| ------- | --------------------------------------------|
9785| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
9786
9787**示例:**
9788
9789```ts
9790import { drawing } from '@kit.ArkGraphics2D';
9791
9792let roundRect : drawing.RoundRect = new drawing.RoundRect({left: 0, top: 0, right: 300, bottom: 300}, 50, 50);
9793roundRect.setCorner(drawing.CornerPos.TOP_LEFT_POS, 150, 150);
9794```
9795
9796### getCorner<sup>12+</sup>
9797
9798getCorner(pos: CornerPos): common2D.Point
9799
9800获取圆角矩形中指定圆角位置的圆角半径。
9801
9802**系统能力:** SystemCapability.Graphics.Drawing
9803
9804**参数:**
9805
9806| 参数名   | 类型                                         | 必填 | 说明                            |
9807| -------- | -------------------------------------------- | ---- | ------------------------------- |
9808| pos | [CornerPos](#cornerpos12) | 是   | 圆角位置。                 |
9809
9810**返回值:**
9811
9812| 类型                  | 说明           |
9813| --------------------- | -------------- |
9814| [common2D.Point](js-apis-graphics-common2D.md#point12)  | 返回一个点,其横坐标表示圆角x轴方向上的半径,纵坐标表示y轴方向上的半径。 |
9815
9816**错误码:**
9817
9818以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
9819
9820| 错误码ID | 错误信息 |
9821| ------- | --------------------------------------------|
9822| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. |
9823
9824**示例:**
9825
9826```ts
9827import { drawing } from '@kit.ArkGraphics2D';
9828
9829let roundRect : drawing.RoundRect = new drawing.RoundRect({left: 0, top: 0, right: 300, bottom: 300}, 50, 50);
9830let cornerRadius = roundRect.getCorner(drawing.CornerPos.BOTTOM_LEFT_POS);
9831console.info("getCorner---"+cornerRadius.x)
9832console.info("getCorner---"+cornerRadius.y)
9833```
9834
9835### offset<sup>12+</sup>
9836
9837offset(dx: number, dy: number): void
9838
9839将圆角矩形分别沿x轴方向和y轴方向平移dx,dy。
9840
9841**系统能力:** SystemCapability.Graphics.Drawing
9842
9843**参数:**
9844
9845| 参数名   | 类型                                         | 必填 | 说明                            |
9846| -------- | -------------------------------------------- | ---- | ------------------------------- |
9847| dx | number | 是   | 表示x轴方向上的偏移量。正数表示向x轴正方向平移,负数表示向x轴负方向平移,该参数为浮点数。                 |
9848| dy | number | 是   | 表示y轴方向上的偏移量。正数表示向y轴正方向平移,负数表示向y轴负方向平移,该参数为浮点数。                 |
9849
9850**错误码:**
9851
9852以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
9853
9854| 错误码ID | 错误信息 |
9855| ------- | --------------------------------------------|
9856| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
9857
9858**示例:**
9859
9860```ts
9861import { drawing } from '@kit.ArkGraphics2D';
9862
9863let roundRect : drawing.RoundRect = new drawing.RoundRect({left: 0, top: 0, right: 300, bottom: 300}, 50, 50);
9864roundRect.offset(100, 100);
9865```
9866
9867## Region<sup>12+</sup>
9868
9869区域对象,用于描述所绘制图形的区域信息。
9870
9871### constructor<sup>20+</sup>
9872
9873constructor()
9874
9875构造一个区域对象。
9876
9877**系统能力:** SystemCapability.Graphics.Drawing
9878
9879```ts
9880import { RenderNode } from '@kit.ArkUI';
9881import { drawing } from '@kit.ArkGraphics2D';
9882class DrawingRenderNode extends RenderNode {
9883  draw(context : DrawContext) {
9884    const canvas = context.canvas;
9885    const pen = new drawing.Pen();
9886    pen.setColor({ alpha: 255, red: 255, green: 0, blue: 0 });
9887    pen.setStrokeWidth(10);
9888    canvas.attachPen(pen);
9889    let region = new drawing.Region();
9890    region.setRect(200, 200, 400, 400);
9891    canvas.drawRegion(region);
9892    canvas.detachPen();
9893  }
9894}
9895```
9896
9897### constructor<sup>20+</sup>
9898
9899constructor(region: Region)
9900
9901拷贝一个区域对象。
9902
9903**系统能力:** SystemCapability.Graphics.Drawing
9904
9905**参数:**
9906
9907| 参数名 | 类型   | 必填 | 说明                    |
9908| ------ | ------ | ---- | ----------------------- |
9909| region     | [Region](#region12) | 是   | 用于拷贝的区域。 |
9910
9911**示例:**
9912
9913```ts
9914import { RenderNode } from '@kit.ArkUI';
9915import { drawing } from '@kit.ArkGraphics2D';
9916class DrawingRenderNode extends RenderNode {
9917  draw(context : DrawContext) {
9918    const canvas = context.canvas;
9919    const pen = new drawing.Pen();
9920    pen.setColor({ alpha: 255, red: 255, green: 0, blue: 0 });
9921    pen.setStrokeWidth(10);
9922    canvas.attachPen(pen);
9923    let region = new drawing.Region();
9924    region.setRect(200, 200, 400, 400);
9925    let region2 = new drawing.Region(region);
9926    canvas.drawRegion(region2);
9927    canvas.detachPen();
9928  }
9929}
9930```
9931
9932### constructor<sup>20+</sup>
9933
9934constructor(left: number, top: number, right: number, bottom: number)
9935
9936构造矩形区域。
9937
9938**系统能力:** SystemCapability.Graphics.Drawing
9939
9940**参数:**
9941
9942| 参数名 | 类型   | 必填 | 说明                    |
9943| ------ | ------ | ---- | ----------------------- |
9944| left   | number | 是   | 矩形区域的左侧位置(矩形左上角横坐标)。该参数必须为整数。0表示坐标原点,负数表示位于坐标原点左侧,正数表示位于坐标原点右侧。|
9945| top    | number | 是   | 矩形区域的顶部位置(矩形左上角纵坐标)。该参数必须为整数。0表示坐标原点,负数表示位于坐标原点上侧,正数表示位于坐标原点下侧。 |
9946| right  | number | 是   | 矩形区域的右侧位置(矩形右下角横坐标)。该参数必须为整数。0表示坐标原点,负数表示位于坐标原点左侧,正数表示位于坐标原点右侧。 |
9947| bottom | number | 是   | 矩形区域的底部位置(矩形右下角纵坐标)。该参数必须为整数。0表示坐标原点,负数表示位于坐标原点上侧,正数表示位于坐标原点下侧。 |
9948
9949**示例:**
9950
9951```ts
9952import { RenderNode } from '@kit.ArkUI';
9953import { drawing } from '@kit.ArkGraphics2D';
9954class DrawingRenderNode extends RenderNode {
9955  draw(context : DrawContext) {
9956    const canvas = context.canvas;
9957    const pen = new drawing.Pen();
9958    pen.setColor({ alpha: 255, red: 255, green: 0, blue: 0 });
9959    pen.setStrokeWidth(10);
9960    canvas.attachPen(pen);
9961    let region = new drawing.Region(100, 100, 200, 200);
9962    canvas.drawRegion(region);
9963    canvas.detachPen();
9964  }
9965}
9966```
9967
9968### isEqual<sup>20+</sup>
9969
9970isEqual(other: Region): boolean
9971
9972用于判断其他区域是否与当前区域相等。
9973
9974**系统能力:** SystemCapability.Graphics.Drawing
9975
9976**参数:**
9977
9978| 参数名 | 类型   | 必填 | 说明                    |
9979| ------ | ------ | ---- | ----------------------- |
9980| other      | [Region](#region12) | 是   | 区域对象。 |
9981
9982**返回值:**
9983
9984| 类型    | 说明           |
9985| ------- | -------------- |
9986| boolean | 返回其他区域是否与当前区域相等的结果。true表示相等,false表示不相等。 |
9987
9988**示例:**
9989
9990```ts
9991import { RenderNode } from '@kit.ArkUI';
9992import { drawing } from '@kit.ArkGraphics2D';
9993class DrawingRenderNode extends RenderNode {
9994  draw(context : DrawContext) {
9995    const canvas = context.canvas;
9996    const pen = new drawing.Pen();
9997    pen.setColor({ alpha: 255, red: 255, green: 0, blue: 0 });
9998    pen.setStrokeWidth(10);
9999    canvas.attachPen(pen);
10000    let region = new drawing.Region();
10001    let other = new drawing.Region();
10002    region.setRect(100, 100, 400, 400);
10003    other.setRect(150, 150, 250 ,250);
10004    let flag: boolean = false;
10005    flag = region.isEqual(other);
10006    console.info('flag: ', flag);
10007    canvas.drawRegion(region);
10008    canvas.drawRegion(other);
10009    canvas.detachPen();
10010  }
10011}
10012```
10013
10014### isComplex<sup>20+</sup>
10015
10016isComplex(): boolean
10017
10018判断当前区域是否包含多个矩形。
10019
10020**系统能力:** SystemCapability.Graphics.Drawing
10021
10022**返回值:**
10023
10024| 类型    | 说明           |
10025| ------- | -------------- |
10026| boolean | 返回当前区域是否包含多个矩形的结果。true表示当前区域包含多个矩形,false表示当前区域不包含多个矩形。 |
10027
10028**示例:**
10029
10030```ts
10031import { common2D, drawing } from '@kit.ArkGraphics2D';
10032import { RenderNode } from '@kit.ArkUI';
10033
10034class DrawingRenderNode extends RenderNode {
10035  draw(context : DrawContext) {
10036    const canvas = context.canvas;
10037    const pen = new drawing.Pen();
10038    pen.setColor({ alpha: 255, red: 255, green: 0, blue: 0 });
10039    pen.setStrokeWidth(10);
10040    canvas.attachPen(pen);
10041    let region = new drawing.Region();
10042    let other = new drawing.Region();
10043    region.setRect(100, 100, 200, 200);
10044    region.op(new drawing.Region(220, 200, 280, 280), drawing.RegionOp.UNION);
10045    let flag: boolean = false;
10046    flag = region.isComplex();
10047    console.info('flag :', flag);
10048    canvas.drawRegion(region);
10049    canvas.drawRegion(other);
10050    canvas.detachPen();
10051  }
10052}
10053```
10054
10055### isEmpty<sup>20+</sup>
10056
10057isEmpty(): boolean
10058
10059判断当前区域是否为空。
10060
10061**系统能力:** SystemCapability.Graphics.Drawing
10062
10063**返回值:**
10064
10065| 类型    | 说明                    |
10066| ------- | --------------         |
10067| boolean | 返回当前区域是否为空。true表示当前区域为空,false表示当前区域不为空。   |
10068
10069**示例:**
10070
10071```ts
10072import { RenderNode } from '@kit.ArkUI';
10073import { drawing } from '@kit.ArkGraphics2D';
10074
10075class DrawingRenderNode extends RenderNode {
10076  draw(context : DrawContext) {
10077    const canvas = context.canvas;
10078    const pen = new drawing.Pen();
10079    pen.setColor({ alpha: 255, red: 255, green: 0, blue: 0 });
10080    pen.setStrokeWidth(10);
10081    canvas.attachPen(pen);
10082    let region = new drawing.Region();
10083    let flag: boolean = region.isEmpty();
10084    console.info('flag: ', flag);
10085    region.setRect(100, 100, 400, 400);
10086    flag = region.isEmpty();
10087    console.info('flag: ', flag);
10088    canvas.drawRegion(region);
10089    canvas.detachPen();
10090  }
10091}
10092```
10093
10094### getBounds<sup>20+</sup>
10095
10096getBounds(): common2D.Rect
10097
10098获取区域的边界。
10099
10100**系统能力:** SystemCapability.Graphics.Drawing
10101
10102**返回值:**
10103
10104| 类型    | 说明           |
10105| ------- | -------------- |
10106| [common2D.Rect](js-apis-graphics-common2D.md#rect) | 返回当前区域的边界矩形。 |
10107
10108**示例:**
10109
10110```ts
10111import { drawing } from '@kit.ArkGraphics2D';
10112
10113let region = new drawing.Region();
10114let rect = region.getBounds();
10115```
10116
10117### getBoundaryPath<sup>20+</sup>
10118
10119getBoundaryPath(): Path
10120
10121返回一个新路径,该路径取自当前区域的边界。
10122
10123**系统能力:** SystemCapability.Graphics.Drawing
10124
10125**返回值:**
10126
10127| 类型    | 说明           |
10128| ------- | -------------- |
10129| [Path](#path)  | 返回当前区域边界的路径。 |
10130
10131**示例:**
10132
10133```ts
10134import { drawing } from '@kit.ArkGraphics2D';
10135let region = new drawing.Region();
10136let path = region.getBoundaryPath();
10137```
10138
10139### isPointContained<sup>12+</sup>
10140
10141isPointContained(x: number, y: number) : boolean
10142
10143判断测试点是否在区域内。
10144
10145**系统能力:** SystemCapability.Graphics.Drawing
10146
10147**参数:**
10148
10149| 参数名 | 类型   | 必填 | 说明                    |
10150| ------ | ------ | ---- | ----------------------- |
10151| x      | number | 是   | 测试点的x轴坐标。该参数必须为整数。如果输入的数字包含小数部分,小数部分将被舍去。 |
10152| y      | number | 是   | 测试点的y轴坐标。该参数必须为整数。如果输入的数字包含小数部分,小数部分将被舍去。 |
10153
10154**返回值:**
10155
10156| 类型    | 说明           |
10157| ------- | -------------- |
10158| boolean | 返回测试点是否在区域内的结果。true表示测试点在区域内,false表示测试点不在区域内。 |
10159
10160**错误码:**
10161
10162以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
10163
10164| 错误码ID | 错误信息 |
10165| ------- | --------------------------------------------|
10166| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
10167
10168**示例:**
10169
10170```ts
10171import { RenderNode } from '@kit.ArkUI';
10172import { drawing } from '@kit.ArkGraphics2D';
10173
10174class DrawingRenderNode extends RenderNode {
10175  draw(context : DrawContext) {
10176    const canvas = context.canvas;
10177    const pen = new drawing.Pen();
10178    pen.setColor({ alpha: 255, red: 255, green: 0, blue: 0 });
10179    pen.setStrokeWidth(10);
10180    canvas.attachPen(pen);
10181    let region = new drawing.Region();
10182    region.setRect(100, 100, 400, 400);
10183    let flag: boolean = false;
10184    flag = region.isPointContained(200,200);
10185    console.info("region isPointContained : " + flag);
10186    canvas.drawPoint(200,200);
10187    canvas.drawRegion(region);
10188    canvas.detachPen();
10189  }
10190}
10191```
10192
10193### offset<sup>20+</sup>
10194
10195offset(dx: number, dy: number): void
10196
10197对区域进行平移。
10198
10199**系统能力:** SystemCapability.Graphics.Drawing
10200
10201**参数:**
10202
10203| 参数名 | 类型   | 必填 | 说明                    |
10204| ------ | ------ | ---- | ----------------------- |
10205| dx      | number | 是   | x轴方向平移量,正数往x轴正方向平移,负数往x轴负方向平移,该参数为整数。 |
10206| dy      | number | 是   | y轴方向平移量,正数往y轴正方向平移,负数往y轴负方向平移,该参数为整数。|
10207
10208**示例:**
10209
10210```ts
10211import { RenderNode } from '@kit.ArkUI';
10212import { drawing } from '@kit.ArkGraphics2D';
10213class DrawingRenderNode extends RenderNode {
10214  draw(context : DrawContext) {
10215    const canvas = context.canvas;
10216    const pen = new drawing.Pen();
10217    pen.setColor({ alpha: 255, red: 255, green: 0, blue: 0 });
10218    pen.setStrokeWidth(10);
10219    canvas.attachPen(pen);
10220    let region = new drawing.Region();
10221    region.setRect(100, 100, 400, 400);
10222    region.offset(10, 20);
10223    canvas.drawPoint(200,200);
10224    canvas.drawRegion(region);
10225    canvas.detachPen();
10226  }
10227}
10228```
10229
10230### isRegionContained<sup>12+</sup>
10231
10232isRegionContained(other: Region) : boolean
10233
10234判断其他区域是否在当前区域内。
10235
10236**系统能力:** SystemCapability.Graphics.Drawing
10237
10238**参数:**
10239
10240| 参数名 | 类型   | 必填 | 说明                    |
10241| ------ | ------ | ---- | ----------------------- |
10242| other      | [Region](#region12) | 是   | 区域对象。 |
10243
10244**返回值:**
10245
10246| 类型    | 说明           |
10247| ------- | -------------- |
10248| boolean | 返回其他区域是否在当前区域内的结果。true表示其他区域在当前区域内,false表示其他区域不在当前区域内。 |
10249
10250**错误码:**
10251
10252以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
10253
10254| 错误码ID | 错误信息 |
10255| ------- | --------------------------------------------|
10256| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
10257
10258**示例:**
10259
10260```ts
10261import { RenderNode } from '@kit.ArkUI';
10262import { drawing } from '@kit.ArkGraphics2D';
10263
10264class DrawingRenderNode extends RenderNode {
10265  draw(context : DrawContext) {
10266    const canvas = context.canvas;
10267    const pen = new drawing.Pen();
10268    pen.setColor({ alpha: 255, red: 255, green: 0, blue: 0 });
10269    pen.setStrokeWidth(10);
10270    canvas.attachPen(pen);
10271    let region = new drawing.Region();
10272    let other = new drawing.Region();
10273    region.setRect(100, 100, 400, 400);
10274    other.setRect(150, 150, 250 ,250);
10275    let flag: boolean = false;
10276    flag = region.isRegionContained(other);
10277    console.info("region isRegionContained : " + flag);
10278    canvas.drawRegion(region);
10279    canvas.drawRegion(other);
10280    canvas.detachPen();
10281  }
10282}
10283```
10284
10285### op<sup>12+</sup>
10286
10287op(region: Region, regionOp: RegionOp) : boolean
10288
10289将当前区域与指定区域进行运算,并替换为运算结果。
10290
10291**系统能力:** SystemCapability.Graphics.Drawing
10292
10293**参数:**
10294
10295| 参数名 | 类型   | 必填 | 说明                    |
10296| ------ | ------ | ---- | ----------------------- |
10297| region      | [Region](#region12) | 是   | 区域对象。 |
10298| regionOp      | [RegionOp](#regionop12) | 是   | 区域合并操作类型。 |
10299
10300**返回值:**
10301
10302| 类型    | 说明           |
10303| ------- | -------------- |
10304| boolean | 返回区域运算结果是否成功替换当前区域。true表示区域运算结果替换当前区域成功,false表示区域运算结果替换当前区域失败。 |
10305
10306**错误码:**
10307
10308以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
10309
10310| 错误码ID | 错误信息 |
10311| ------- | --------------------------------------------|
10312| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
10313
10314**示例:**
10315
10316```ts
10317import { RenderNode } from '@kit.ArkUI';
10318import { drawing } from '@kit.ArkGraphics2D';
10319
10320class DrawingRenderNode extends RenderNode {
10321  draw(context : DrawContext) {
10322    const canvas = context.canvas;
10323    const pen = new drawing.Pen();
10324    pen.setColor({ alpha: 255, red: 255, green: 0, blue: 0 });
10325    pen.setStrokeWidth(10);
10326    canvas.attachPen(pen);
10327    let region = new drawing.Region();
10328    region.setRect(200, 200, 400, 400);
10329    let othregion = new drawing.Region();
10330    othregion.setRect(110, 110, 240, 240);
10331    let flag: boolean = false;
10332    flag = region.op(othregion,drawing.RegionOp.REPLACE);
10333    console.info("region op : " + flag);
10334    canvas.drawRegion(region);
10335    canvas.detachPen();
10336  }
10337}
10338```
10339
10340### quickReject<sup>12+</sup>
10341
10342quickReject(left: number, top: number, right: number, bottom: number) : boolean
10343
10344快速判断矩形和区域是否不相交,实际上比较的是矩形和区域的外接矩形是否不相交,因此会有误差。
10345
10346**系统能力:** SystemCapability.Graphics.Drawing
10347
10348**参数:**
10349
10350| 参数名 | 类型   | 必填 | 说明                    |
10351| ------ | ------ | ---- | ----------------------- |
10352| left   | number | 是   | 矩形区域的左侧位置。该参数必须为整数。当输入的数字带小数时,小数部分会被舍去。 |
10353| top    | number | 是   | 矩形区域的顶部位置。该参数必须为整数。当输入的数字带小数时,小数部分会被舍去。 |
10354| right  | number | 是   | 矩形区域的右侧位置。该参数必须为整数。当输入的数字带小数时,小数部分会被舍去。 |
10355| bottom | number | 是   | 矩形区域的底部位置。该参数必须为整数。当输入的数字带小数时,小数部分会被舍去。 |
10356
10357**返回值:**
10358
10359| 类型    | 说明           |
10360| ------- | -------------- |
10361| boolean | 返回矩形是否与区域不相交的结果。true表示矩形与区域不相交,false表示矩形与区域相交。 |
10362
10363**错误码:**
10364
10365以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
10366
10367| 错误码ID | 错误信息 |
10368| ------- | --------------------------------------------|
10369| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
10370
10371**示例:**
10372
10373```ts
10374import { RenderNode } from '@kit.ArkUI';
10375import { drawing } from '@kit.ArkGraphics2D';
10376
10377class DrawingRenderNode extends RenderNode {
10378  draw(context : DrawContext) {
10379    const canvas = context.canvas;
10380    const pen = new drawing.Pen();
10381    pen.setColor({ alpha: 255, red: 255, green: 0, blue: 0 });
10382    pen.setStrokeWidth(10);
10383    canvas.attachPen(pen);
10384    let region = new drawing.Region();
10385    region.setRect(100, 100, 400, 400);
10386    let flag: boolean = false;
10387    flag = region.quickReject(50, 50, 70, 70);
10388    console.info("region quickReject : " + flag);
10389    canvas.drawRegion(region);
10390    canvas.detachPen();
10391  }
10392}
10393```
10394
10395### quickRejectRegion<sup>20+</sup>
10396
10397quickRejectRegion(region: Region): boolean
10398
10399判断当前区域是否与另一个区域不相交。实际上比较的是两个区域的外接矩形是否不相交,因此会有误差。
10400
10401**系统能力:** SystemCapability.Graphics.Drawing
10402
10403**参数:**
10404
10405| 参数名 | 类型   | 必填 | 说明                    |
10406| ------ | ------ | ---- | ----------------------- |
10407| region      | [Region](#region12) | 是   | 指定的区域对象。 |
10408
10409**返回值:**
10410
10411| 类型    | 说明           |
10412| ------- | -------------- |
10413| boolean | 返回是否当前区域与另外的区域不相交的结果。true表示不相交,false表示相交。仅点和边相交返回true。|
10414
10415**示例:**
10416
10417```ts
10418import { RenderNode } from '@kit.ArkUI';
10419import { drawing } from '@kit.ArkGraphics2D';
10420
10421class DrawingRenderNode extends RenderNode {
10422  draw(context : DrawContext) {
10423    const canvas = context.canvas;
10424    const pen = new drawing.Pen();
10425    pen.setColor({ alpha: 255, red: 255, green: 0, blue: 0 });
10426    pen.setStrokeWidth(10);
10427    canvas.attachPen(pen);
10428    let region = new drawing.Region();
10429    let region2 = new drawing.Region();
10430    region2.setRect(100, 100, 400, 400);
10431    let flag: boolean = false;
10432    flag = region.quickRejectRegion(region2);
10433    console.info("region quickRejectRegion: " + flag);
10434    canvas.drawRegion(region);
10435    canvas.detachPen();
10436  }
10437}
10438```
10439
10440### setPath<sup>12+</sup>
10441
10442setPath(path: Path, clip: Region) : boolean
10443
10444设置一个与裁剪区域内路径轮廓相匹配的区域。
10445
10446**系统能力:** SystemCapability.Graphics.Drawing
10447
10448**参数:**
10449
10450| 参数名 | 类型   | 必填 | 说明                    |
10451| ------ | ------ | ---- | ----------------------- |
10452| path      | [Path](#path) | 是   | 路径对象。 |
10453| clip      | [Region](#region12) | 是   | 区域对象。 |
10454
10455**返回值:**
10456
10457| 类型    | 说明           |
10458| ------- | -------------- |
10459| boolean | 返回设置一个与裁剪区域内路径轮廓相匹配的区域是否成功。true表示设置成功,false表示设置失败。 |
10460
10461**错误码:**
10462
10463以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
10464
10465| 错误码ID | 错误信息 |
10466| ------- | --------------------------------------------|
10467| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
10468
10469**示例:**
10470
10471```ts
10472import { RenderNode } from '@kit.ArkUI';
10473import { drawing } from '@kit.ArkGraphics2D';
10474
10475class DrawingRenderNode extends RenderNode {
10476  draw(context : DrawContext) {
10477    const canvas = context.canvas;
10478    const pen = new drawing.Pen();
10479    pen.setColor({ alpha: 255, red: 255, green: 0, blue: 0 });
10480    pen.setStrokeWidth(10);
10481    canvas.attachPen(pen);
10482    let region = new drawing.Region();
10483    let path = new drawing.Path();
10484    region.setRect(100, 100, 400, 400);
10485    path.arcTo(50, 50, 300, 300, 0, 359);
10486    let flag: boolean = false;
10487    flag = region.setPath(path,region);
10488    console.info("region setPath : " + flag);
10489    canvas.drawRegion(region);
10490    canvas.detachPen();
10491  }
10492}
10493```
10494
10495### setRegion<sup>20+</sup>
10496
10497setRegion(region: Region): void
10498
10499设置当前区域为另一块区域。
10500
10501**系统能力:** SystemCapability.Graphics.Drawing
10502
10503**参数:**
10504
10505| 参数名 | 类型   | 必填 | 说明                    |
10506| ------ | ------ | ---- | ----------------------- |
10507| region      | [Region](#region12) | 是   | 用于赋值的区域。 |
10508
10509**示例:**
10510
10511```ts
10512import { RenderNode } from '@kit.ArkUI';
10513import { drawing } from '@kit.ArkGraphics2D';
10514
10515class DrawingRenderNode extends RenderNode {
10516  draw(context : DrawContext) {
10517    const canvas = context.canvas;
10518    const pen = new drawing.Pen();
10519    pen.setColor({ alpha: 255, red: 255, green: 0, blue: 0 });
10520    pen.setStrokeWidth(10);
10521    canvas.attachPen(pen);
10522    let region = new drawing.Region();
10523    region.setRect(100, 100, 200, 200);
10524    let region2 = new drawing.Region();
10525    region2.setRegion(region);
10526    canvas.drawRegion(region2);
10527    canvas.detachPen();
10528  }
10529}
10530```
10531
10532### setEmpty<sup>20+</sup>
10533
10534setEmpty(): void
10535
10536设置当前区域为空。
10537
10538**系统能力:** SystemCapability.Graphics.Drawing
10539
10540**示例:**
10541
10542```ts
10543import { RenderNode } from '@kit.ArkUI';
10544import { drawing } from '@kit.ArkGraphics2D';
10545
10546class DrawingRenderNode extends RenderNode {
10547  draw(context : DrawContext) {
10548    let region = new drawing.Region();
10549    region.setRect(100, 100, 200, 200);
10550    let isEmpty = region.isEmpty();
10551    console.info("isEmpty :" + isEmpty);
10552    region.setEmpty();
10553    isEmpty = region.isEmpty();
10554    console.info("isEmpty :" + isEmpty);
10555  }
10556}
10557```
10558
10559### setRect<sup>12+</sup>
10560
10561setRect(left: number, top: number, right: number, bottom: number) : boolean
10562
10563设置一个矩形区域。
10564
10565**系统能力:** SystemCapability.Graphics.Drawing
10566
10567**参数:**
10568
10569| 参数名 | 类型   | 必填 | 说明                    |
10570| ------ | ------ | ---- | ----------------------- |
10571| left   | number | 是   | 矩形区域的左侧位置。该参数必须为整数。当输入的数字带小数时,小数部分会被舍去。 |
10572| top    | number | 是   | 矩形区域的顶部位置。该参数必须为整数。当输入的数字带小数时,小数部分会被舍去。 |
10573| right  | number | 是   | 矩形区域的右侧位置。该参数必须为整数。当输入的数字带小数时,小数部分会被舍去。 |
10574| bottom | number | 是   | 矩形区域的底部位置。该参数必须为整数。当输入的数字带小数时,小数部分会被舍去。 |
10575
10576**返回值:**
10577
10578| 类型    | 说明           |
10579| ------- | -------------- |
10580| boolean | 返回设置矩形区域是否成功的结果。true表示设置矩形区域成功,false表示设置矩形区域失败。 |
10581
10582**错误码:**
10583
10584以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
10585
10586| 错误码ID | 错误信息 |
10587| ------- | --------------------------------------------|
10588| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
10589
10590**示例:**
10591
10592```ts
10593import { RenderNode } from '@kit.ArkUI';
10594import { drawing } from '@kit.ArkGraphics2D';
10595
10596class DrawingRenderNode extends RenderNode {
10597  draw(context : DrawContext) {
10598    const canvas = context.canvas;
10599    const pen = new drawing.Pen();
10600    pen.setColor({ alpha: 255, red: 255, green: 0, blue: 0 });
10601    pen.setStrokeWidth(10);
10602    canvas.attachPen(pen);
10603    let region = new drawing.Region();
10604    let flag: boolean = false;
10605    flag = region.setRect(50, 50, 300, 300);
10606    console.info("region setRect : " + flag);
10607    canvas.drawRegion(region);
10608    canvas.detachPen();
10609  }
10610}
10611```
10612
10613## TileMode<sup>12+</sup>
10614
10615着色器效果平铺模式的枚举。
10616
10617**系统能力:** SystemCapability.Graphics.Drawing
10618
10619| 名称                   | 值   | 说明                           |
10620| ---------------------- | ---- | ------------------------------ |
10621| CLAMP     | 0    | 如果着色器效果超出其原始边界,剩余区域使用着色器的边缘颜色填充。 |
10622| REPEAT    | 1    | 在水平和垂直方向上重复着色器效果。 |
10623| MIRROR    | 2    | 在水平和垂直方向上重复着色器效果,交替镜像图像,以便相邻图像始终接合。 |
10624| DECAL     | 3    | 仅在其原始边界内渲染着色器效果。|
10625
10626## ShaderEffect<sup>12+</sup>
10627
10628着色器。画刷和画笔设置着色器后,会使用着色器效果而不是颜色属性去绘制,但此时画笔和画刷的透明度属性仍然生效。
10629
10630### createComposeShader<sup>20+</sup>
10631
10632static createComposeShader(dstShaderEffect: ShaderEffect, srcShaderEffect: ShaderEffect, blendMode: BlendMode): ShaderEffect
10633
10634按照指定的混合模式对两个着色器进行叠加,生成一个新的着色器。
10635
10636**系统能力:** SystemCapability.Graphics.Drawing
10637
10638**参数:**
10639
10640| 参数名 | 类型                                               | 必填 | 说明           |
10641| ------ | -------------------------------------------------- | ---- | -------------- |
10642| dstShaderEffect  | [ShaderEffect](#shadereffect12) | 是   | 在混合模式中作为目标色的着色器。 |
10643| srcShaderEffect  | [ShaderEffect](#shadereffect12) | 是   | 在混合模式中作为源色的着色器。   |
10644| blendMode  | [BlendMode](#blendmode) | 是   | 混合模式。 |
10645
10646**返回值:**
10647
10648| 类型    | 说明                       |
10649| ------- | ------------------------- |
10650| [ShaderEffect](#shadereffect12) | 返回创建的着色器对象。 |
10651
10652**错误码:**
10653
10654以下错误码的详细介绍请参见[图形绘制与显示错误码](../apis-arkgraphics2d/errorcode-drawing.md)。
10655
10656| 错误码ID | 错误信息 |
10657| ------- | --------------------------------------------|
10658| 25900001 | Parameter error.Possible causes: Incorrect parameter range. |
10659
10660**示例:**
10661
10662```ts
10663import { drawing } from '@kit.ArkGraphics2D';
10664
10665let dstShader = drawing.ShaderEffect.createColorShader(0xFF0000FF);
10666let srcShader = drawing.ShaderEffect.createColorShader(0xFFFF0000);
10667let shader = drawing.ShaderEffect.createComposeShader(dstShader, srcShader, drawing.BlendMode.SRC);
10668```
10669
10670### createImageShader<sup>20+</sup>
10671
10672static createImageShader(pixelmap: image.PixelMap, tileX: TileMode, tileY: TileMode, samplingOptions: SamplingOptions, matrix?: Matrix | null): ShaderEffect
10673
10674基于图片创建一个着色器。此接口不建议用于录制类型的画布,会影响性能。
10675
10676**系统能力:** SystemCapability.Graphics.Drawing
10677
10678**参数:**
10679
10680| 参数名 | 类型                                               | 必填 | 说明           |
10681| ------ | -------------------------------------------------- | ---- | -------------- |
10682| pixelmap  | [image.PixelMap](../apis-image-kit/arkts-apis-image-PixelMap.md)  | 是   | 进行采样的图片对象。 |
10683| tileX   | [TileMode](#tilemode12)  | 是   | 水平方向的平铺模式。 |
10684| tileY   | [TileMode](#tilemode12)  | 是   | 竖直方向的平铺模式。 |
10685| samplingOptions     | [SamplingOptions](#samplingoptions12)                           | 是   | 图片采样参数。 |
10686| matrix | [Matrix](#matrix12) \| null | 否   | 可选参数,对图片施加的矩阵变换,如果为空,则不施加任何变换。 |
10687
10688**返回值:**
10689
10690| 类型    | 说明                       |
10691| ------- | ------------------------- |
10692| [ShaderEffect](#shadereffect12) | 返回创建的着色器对象。 |
10693
10694**错误码:**
10695
10696以下错误码的详细介绍请参见[图形绘制与显示错误码](../apis-arkgraphics2d/errorcode-drawing.md)。
10697
10698| 错误码ID | 错误信息 |
10699| ------- | --------------------------------------------|
10700| 25900001 | Parameter error.Possible causes: Incorrect parameter range. |
10701
10702**示例:**
10703
10704```ts
10705import { RenderNode } from '@kit.ArkUI';
10706import { image } from '@kit.ImageKit';
10707import { drawing } from '@kit.ArkGraphics2D';
10708class DrawingRenderNode extends RenderNode {
10709  pixelMap: image.PixelMap | null = null;
10710
10711  async draw(context : DrawContext) {
10712    let matrix = new drawing.Matrix();
10713    let options = new drawing.SamplingOptions(drawing.FilterMode.FILTER_MODE_NEAREST);
10714    if (this.pixelMap != null) {
10715      let imageShader = drawing.ShaderEffect.createImageShader(this.pixelMap, drawing.TileMode.REPEAT, drawing.TileMode.MIRROR, options, matrix);
10716    }
10717  }
10718}
10719```
10720
10721### createColorShader<sup>12+</sup>
10722
10723static createColorShader(color: number): ShaderEffect
10724
10725创建具有单一颜色的着色器。
10726
10727**系统能力:** SystemCapability.Graphics.Drawing
10728
10729**参数:**
10730
10731| 参数名 | 类型                                               | 必填 | 说明           |
10732| ------ | -------------------------------------------------- | ---- | -------------- |
10733| color   | number | 是   | 表示着色器的ARGB格式颜色,该参数为32位无符号整数。 |
10734
10735**返回值:**
10736
10737| 类型    | 说明                       |
10738| ------- | ------------------------- |
10739| [ShaderEffect](#shadereffect12) | 返回具有单一颜色的着色器对象。 |
10740
10741**错误码:**
10742
10743以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
10744
10745| 错误码ID | 错误信息 |
10746| ------- | --------------------------------------------|
10747| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
10748
10749**示例:**
10750
10751```ts
10752import { drawing } from '@kit.ArkGraphics2D';
10753
10754let shaderEffect = drawing.ShaderEffect.createColorShader(0xFFFF0000);
10755```
10756
10757### createLinearGradient<sup>12+</sup>
10758
10759static createLinearGradient(startPt: common2D.Point, endPt: common2D.Point, colors: Array
10760\<number>, mode: TileMode, pos?: Array\<number> | null, matrix?: Matrix | null): ShaderEffect
10761
10762创建着色器,在两个指定点之间生成线性渐变。
10763
10764**系统能力:** SystemCapability.Graphics.Drawing
10765
10766**参数:**
10767
10768| 参数名 | 类型                                               | 必填 | 说明           |
10769| ------ | -------------------------------------------------- | ---- | -------------- |
10770| startPt  | [common2D.Point](js-apis-graphics-common2D.md#point12)  | 是   | 表示渐变的起点。 |
10771| endPt   | [common2D.Point](js-apis-graphics-common2D.md#point12)  | 是   | 表示渐变的终点。 |
10772| colors | Array\<number> | 是   | 表示在两个点之间分布的颜色数组,数组中的值为32位(ARGB)无符号整数。 |
10773| mode  | [TileMode](#tilemode12) | 是   | 着色器效果平铺模式。 |
10774| pos | Array\<number> \|null| 否   | 表示每种对应颜色在颜色数组中的相对位置。数组长度需和colors保持一致,数组的首个元素应当是0.0,末尾元素应当是1.0,中间的元素应当在0与1之间并且逐下标递增,表示colors中每个对应颜色的相对位置。默认为null,表示颜色均匀分布在起点和终点之间。 |
10775| matrix | [Matrix](#matrix12) \| null | 否   | 矩阵对象,用于对着色器做矩阵变换。默认为null,表示单位矩阵。 |
10776
10777![LinearGradient](./figures/zh-ch_image_createLinearGradient.png)
10778
10779如上图所示,设置颜色数组为红绿蓝,位置数组为0.0、0.75和1.0后的显示效果。三角下标表示对应颜色的起始点和终点之间的相对位置,颜色之间使用渐变填充。
10780
10781**返回值:**
10782
10783| 类型    | 说明                       |
10784| ------- | ------------------------- |
10785| [ShaderEffect](#shadereffect12) | 返回创建的着色器对象。 |
10786
10787**错误码:**
10788
10789以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
10790
10791| 错误码ID | 错误信息 |
10792| ------- | --------------------------------------------|
10793| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types; 3. Parameter verification failed. |
10794
10795**示例:**
10796
10797```ts
10798import { common2D,drawing } from '@kit.ArkGraphics2D';
10799
10800let startPt: common2D.Point = { x: 100, y: 100 };
10801let endPt: common2D.Point = { x: 300, y: 300 };
10802let shaderEffect = drawing.ShaderEffect.createLinearGradient(startPt, endPt, [0xFF00FF00, 0xFFFF0000], drawing.TileMode.REPEAT);
10803```
10804
10805### createRadialGradient<sup>12+</sup>
10806
10807static createRadialGradient(centerPt: common2D.Point, radius: number, colors: Array\<number>, mode: TileMode, pos?: Array\<number> | null, matrix?: Matrix | null): ShaderEffect;
10808
10809创建着色器,使用给定的圆心和半径生成径向渐变。径向渐变是指颜色从圆心逐渐向外扩散形成的渐变。
10810
10811**系统能力:** SystemCapability.Graphics.Drawing
10812
10813**参数:**
10814
10815| 参数名 | 类型                                               | 必填 | 说明           |
10816| ------ | -------------------------------------------------- | ---- | -------------- |
10817| centerPt  | [common2D.Point](js-apis-graphics-common2D.md#point12)  | 是   | 表示渐变的圆心。 |
10818| radius   | number  | 是   | 表示渐变的半径,小于等于0时无效,该参数为浮点数。 |
10819| colors | Array\<number> | 是   | 表示在圆心和圆边界之间分布的颜色数组,数组中的值为32位(ARGB)无符号整数。 |
10820| mode  | [TileMode](#tilemode12) | 是   | 着色器效果平铺模式。 |
10821| pos | Array\<number> \| null | 否   | 表示每种对应颜色在颜色数组中的相对位置。数组长度需和colors保持一致,数组的首个元素应当是0.0,末尾元素应当是1.0,中间的元素应当在0与1之间并且逐下标递增,表示colors中每个对应颜色的相对位置。默认为null,表示颜色均匀分布在圆心和圆边界之间。 |
10822| matrix | [Matrix](#matrix12) \| null | 否   | 矩阵对象,用于对着色器做矩阵变换。默认为null,表示单位矩阵。 |
10823
10824![RadialGradient](./figures/zh-ch_image_createRadialGradient.png)
10825
10826如上图所示,设置颜色数组为红绿蓝,位置数组为0.0、0.75和1.0后的显示效果。三角下标表示对应颜色所在圆心和圆边界之间的相对位置,颜色之间使用渐变填充。
10827
10828**返回值:**
10829
10830| 类型    | 说明                       |
10831| ------- | ------------------------- |
10832| [ShaderEffect](#shadereffect12) | 返回创建的着色器对象。 |
10833
10834**错误码:**
10835
10836以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
10837
10838| 错误码ID | 错误信息 |
10839| ------- | --------------------------------------------|
10840| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types; 3. Parameter verification failed. |
10841
10842**示例:**
10843
10844```ts
10845import { common2D,drawing } from '@kit.ArkGraphics2D';
10846
10847let centerPt: common2D.Point = { x: 100, y: 100 };
10848let shaderEffect = drawing.ShaderEffect.createRadialGradient(centerPt, 100, [0xFF00FF00, 0xFFFF0000], drawing.TileMode.REPEAT);
10849```
10850
10851### createSweepGradient<sup>12+</sup>
10852
10853static createSweepGradient(centerPt: common2D.Point, colors: Array\<number>,
10854  mode: TileMode, startAngle: number, endAngle: number, pos?: Array\<number> | null,
10855  matrix?: Matrix | null): ShaderEffect;
10856
10857创建着色器。该着色器以给定中心点为圆心,在顺时针或逆时针方向上生成颜色扫描渐变。
10858
10859**系统能力:** SystemCapability.Graphics.Drawing
10860
10861**参数:**
10862
10863| 参数名 | 类型                                               | 必填 | 说明           |
10864| ------ | -------------------------------------------------- | ---- | -------------- |
10865| centerPt  | [common2D.Point](js-apis-graphics-common2D.md#point12)  | 是   | 表示渐变的圆心。 |
10866| colors | Array\<number> | 是   | 表示在起始角度和结束角度之间分布的颜色数组,数组中的值为32位(ARGB)无符号整数。 |
10867| mode  | [TileMode](#tilemode12) | 是   | 着色器效果平铺模式。 |
10868| startAngle | number | 是   | 表示扇形渐变的起始角度,单位为度。0度时为x轴正方向,正数往顺时针方向偏移,负数往逆时针方向偏移。该参数为浮点数。 |
10869| endAngle | number | 是   | 表示扇形渐变的结束角度,单位为度。0度时为x轴正方向,正数往顺时针方向偏移,负数往逆时针方向偏移。小于起始角度时无效。该参数为浮点数。 |
10870| pos | Array\<number> \| null | 否   | 表示每种对应颜色在颜色数组中的相对位置。数组长度需和colors保持一致,数组的首个元素应当是0.0,末尾元素应当是1.0,中间的元素应当在0与1之间并且逐下标递增,表示colors中每个对应颜色的相对位置。默认为null,表示颜色均匀分布在起始角度和结束角度之间。 |
10871| matrix | [Matrix](#matrix12) \| null | 否   |矩阵对象,用于对着色器做矩阵变换。默认为null,表示单位矩阵。 |
10872
10873![SweepGradient](./figures/zh-ch_image_createSweepGradient.png)
10874
10875如上图所示,设置颜色数组为红绿蓝,位置数组为0.0、0.75和1.0,起始角度设置为0度,结束角度设置为180度后的显示效果。0.0对应0度的位置,0.75对应135度的位置,1.0对应180度的位置,颜色之间使用渐变填充。
10876
10877**返回值:**
10878
10879| 类型    | 说明                       |
10880| ------- | ------------------------- |
10881| [ShaderEffect](#shadereffect12) | 返回创建的着色器对象。 |
10882
10883**错误码:**
10884
10885以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
10886
10887| 错误码ID | 错误信息 |
10888| ------- | --------------------------------------------|
10889| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types; 3. Parameter verification failed. |
10890
10891**示例:**
10892
10893```ts
10894import { common2D,drawing } from '@kit.ArkGraphics2D';
10895
10896let centerPt: common2D.Point = { x: 100, y: 100 };
10897let shaderEffect = drawing.ShaderEffect.createSweepGradient(centerPt, [0xFF00FF00, 0xFFFF0000], drawing.TileMode.REPEAT, 100, 200);
10898```
10899
10900### createConicalGradient<sup>12+</sup>
10901
10902static createConicalGradient(startPt: common2D.Point, startRadius: number, endPt: common2D.Point, endRadius: number, colors: Array\<number>, mode: TileMode,
10903pos?: Array\<number> | null, matrix?: Matrix | null): ShaderEffect;
10904
10905创建着色器,在给定两个圆之间生成径向渐变。
10906
10907**系统能力:** SystemCapability.Graphics.Drawing
10908
10909**参数:**
10910
10911| 参数名 | 类型                                               | 必填 | 说明           |
10912| ------ | -------------------------------------------------- | ---- | -------------- |
10913| startPt  | [common2D.Point](js-apis-graphics-common2D.md#point12)  | 是   |表示渐变的起始圆的圆心。 |
10914| startRadius | number | 是   | 表示渐变的起始圆的半径,小于0时无效。该参数为浮点数。 |
10915| endPt  | [common2D.Point](js-apis-graphics-common2D.md#point12)  | 是   | 表示渐变的结束圆的圆心。 |
10916| endRadius | number | 是   | 表示渐变的结束圆的半径,小于0时无效。该参数为浮点数。 |
10917| colors | Array\<number> | 是   | 表示在起始圆和结束圆之间分布的颜色数组,数组中的值为32位(ARGB)无符号整数。 |
10918| mode  | [TileMode](#tilemode12) | 是   | 着色器效果平铺模式。 |
10919| pos | Array\<number> \| null | 否   | 表示每种对应颜色在颜色数组中的相对位置。数组长度需和colors保持一致,数组的首个元素应当是0.0,末尾元素应当是1.0,中间的元素应当在0与1之间并且逐下标递增,表示colors中每个对应颜色的相对位置。默认为null,表示颜色均匀分布在起始圆和结束圆之间。|
10920| matrix | [Matrix](#matrix12) \| null | 否   | 矩阵对象,用于对着色器做矩阵变换。默认为null,表示单位矩阵。 |
10921
10922![ConicalGradient](./figures/zh-ch_image_createConicalGradient.png)
10923
10924如上图所示,设置颜色数组为红绿蓝,位置数组为0.0、0.5和1.0的绘制结果。左侧为起始圆不在结束圆内的绘制结果,右侧为起始圆在结束圆内的绘制结果。
10925
10926**返回值:**
10927
10928| 类型    | 说明                       |
10929| ------- | ------------------------- |
10930| [ShaderEffect](#shadereffect12) | 返回创建的着色器对象。 |
10931
10932**错误码:**
10933
10934以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
10935
10936| 错误码ID | 错误信息 |
10937| ------- | --------------------------------------------|
10938| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types; 3. Parameter verification failed. |
10939
10940**示例:**
10941
10942```ts
10943import { common2D,drawing } from '@kit.ArkGraphics2D';
10944
10945let startPt: common2D.Point = { x: 100, y: 100 };
10946let endPt: common2D.Point = {x: 200, y: 200};
10947let shaderEffect = drawing.ShaderEffect.createConicalGradient(startPt, 100, endPt, 50, [0xFF00FF00, 0xFFFF0000], drawing.TileMode.REPEAT);
10948```
10949
10950## Tool<sup>15+</sup>
10951
10952本模块定义的工具类,仅提供静态的方法,主要完成其他模块和[common2D](js-apis-graphics-common2D.md)中定义的数据结构的转换功能等操作。
10953
10954### makeColorFromResourceColor<sup>15+</sup>
10955
10956static makeColorFromResourceColor(resourceColor: ResourceColor): common2D.Color
10957
10958将ResourceColor类型的值转换为common2D.Color对象。
10959
10960**系统能力:** SystemCapability.Graphics.Drawing
10961
10962**参数:**
10963
10964| 参数名 | 类型                                               | 必填 | 说明           |
10965| ------ | -------------------------------------------------- | ---- | -------------- |
10966| resourceColor | [ResourceColor](../apis-arkui/arkui-ts/ts-types.md#resourcecolor) | 是   | ResourceColor格式的颜色值(支持所有的4种输入,示例中提供13个示例输入)。其中第4种类型[Resource](../apis-arkui/arkui-ts/ts-types.md#resource)只接受``$r('belonging.type.name')``构造方法,需要确保该资源在main/resources/base/element目录下已定义(app支持color、string和integer,sys只支持color)。 |
10967
10968**返回值:**
10969
10970| 类型    | 说明                       |
10971| ------- | ------------------------- |
10972| [common2D.Color](js-apis-graphics-common2D.md#color) | 转换后的common2D.Color颜色对象,若转换失败则返回空指针。 |
10973
10974**错误码:**
10975
10976以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。
10977
10978| 错误码ID | 错误信息 |
10979| ------- | --------------------------------------------|
10980| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. |
10981
10982**示例:**
10983
10984```ts
10985import { drawing, common2D } from '@kit.ArkGraphics2D';
10986
10987// Color
10988let color1: common2D.Color = drawing.Tool.makeColorFromResourceColor(Color.Blue);
10989
10990// Number
10991let color2: common2D.Color = drawing.Tool.makeColorFromResourceColor(0xffc0cb);
10992let color3: common2D.Color = drawing.Tool.makeColorFromResourceColor(0x11ffa500);
10993
10994// String
10995let color4: common2D.Color = drawing.Tool.makeColorFromResourceColor('#ff0000');
10996let color5: common2D.Color = drawing.Tool.makeColorFromResourceColor('#110000ff');
10997let color6: common2D.Color = drawing.Tool.makeColorFromResourceColor('#00f');
10998let color7: common2D.Color = drawing.Tool.makeColorFromResourceColor('#100f');
10999let color8: common2D.Color = drawing.Tool.makeColorFromResourceColor('rgb(255, 100, 255)');
11000let color9: common2D.Color = drawing.Tool.makeColorFromResourceColor('rgba(255, 100, 255, 0.5)');
11001
11002// Resource
11003let color10: common2D.Color = drawing.Tool.makeColorFromResourceColor($r('sys.color.ohos_id_color_secondary'));
11004let color11: common2D.Color = drawing.Tool.makeColorFromResourceColor($r('app.color.appColorTest'));
11005let color12: common2D.Color = drawing.Tool.makeColorFromResourceColor($r('app.string.appColorTest'));
11006let color13: common2D.Color = drawing.Tool.makeColorFromResourceColor($r('app.integer.appColorTest'));
11007
11008// Use color
11009let brush = new drawing.Brush();
11010brush.setColor(color1);
11011```
11012
11013## RegionOp<sup>12+</sup>
11014
11015两个区域合并时的操作的枚举。
11016
11017**系统能力:** SystemCapability.Graphics.Drawing
11018
11019| 名称                   | 值   | 说明                           | 示意图   |
11020| --------------------- | ---- | ------------------------------ | -------- |
11021| DIFFERENCE         | 0    | 两个区域的相减操作。  | ![CLEAR](./figures/zh-ch_image_RegionOp_Difference.png) |
11022| INTERSECT          | 1    | 两个区域的相交操作。 | ![INTERSECT](./figures/zh-ch_image_RegionOp_Intersect.png) |
11023| UNION              | 2    | 两个区域的联合操作。   | ![UNION](./figures/zh-ch_image_RegionOpe_Union.png) |
11024| XOR                | 3    | 两个区域的异或操作。   | ![XOR](./figures/zh-ch_image_RegionOp_Xor.png) |
11025| REVERSE_DIFFERENCE | 4    | 两个区域的反向相减操作。   | ![REVERSE_DIFFERENCE](./figures/zh-ch_image_RegionOp_Reverse_difference.png) |
11026| REPLACE            | 5    | 两个区域替换操作。   | ![REPLACE](./figures/zh-ch_image_RegionOp_Replace.png) |
11027
11028> **说明:**
11029>
11030> 示意图展示了一个以红色区域为基础,使用不同枚举值与另一个蓝色区域合并后获得的结果,其中绿色区域为最终得到的区域。
11031
11032## CornerPos<sup>12+</sup>
11033
11034圆角位置枚举。
11035
11036**系统能力:** SystemCapability.Graphics.Drawing
11037
11038| 名称                   | 值   | 说明                           |
11039| --------------------- | ---- | ------------------------------ |
11040| TOP_LEFT_POS          | 0    | 左上角圆角位置。  |
11041| TOP_RIGHT_POS         | 1    | 右上角圆角位置。 |
11042| BOTTOM_RIGHT_POS      | 2    | 右下角圆角位置。   |
11043| BOTTOM_LEFT_POS       | 3    | 左下角圆角位置。   |
11044
11045## RectUtils<sup>20+</sup>
11046
11047提供了处理矩形的工具。
11048
11049主要的使用场景:
11050
110511. 矩形快速构建与获取基本属性,如构造新矩形、拷贝矩形、获取矩形的宽高以及中心点等。
11052
110532. 边界计算与调整,如获取包含关系、计算与更新矩形之间交集和并集,更新边界值等。
11054
11055### makeEmpty<sup>20+</sup>
11056
11057static makeEmpty(): common2D.Rect
11058
11059创建一个上下左右边界坐标都是0的矩形。
11060
11061**系统能力:** SystemCapability.Graphics.Drawing
11062
11063**返回值:**
11064
11065| 类型    | 说明                       |
11066| ------- | ------------------------- |
11067| [common2D.Rect](js-apis-graphics-common2D.md#rect) | 创建的矩形对象。 |
11068
11069**示例:**
11070
11071```ts
11072import { drawing, common2D } from '@kit.ArkGraphics2D';
11073
11074let rect = drawing.RectUtils.makeEmpty();
11075```
11076
11077### makeLtrb<sup>20+</sup>
11078
11079static makeLtrb(left: number, top: number, right: number, bottom: number): common2D.Rect
11080
11081创建指定上下左右边界的矩形。
11082
11083**系统能力:** SystemCapability.Graphics.Drawing
11084
11085**参数:**
11086
11087| 参数名 | 类型    | 必填 | 说明           |
11088| ------ | ------ | ---- | -------------- |
11089| left   | number | 是   | 矩形的左上角x轴坐标,该参数为浮点数。0表示坐标原点,负数表示位于坐标原点左侧,正数表示位于坐标原点右侧。 |
11090| top    | number | 是   | 矩形的左上角y轴坐标,该参数为浮点数。0表示坐标原点,负数表示位于坐标原点上侧,正数表示位于坐标原点下侧。 |
11091| right  | number | 是   | 矩形的右下角x轴坐标,该参数为浮点数。0表示坐标原点,负数表示位于坐标原点左侧,正数表示位于坐标原点右侧。 |
11092| bottom | number | 是   | 矩形的右下角y轴坐标,该参数为浮点数。0表示坐标原点,负数表示位于坐标原点上侧,正数表示位于坐标原点下侧。 |
11093
11094**返回值:**
11095
11096| 类型    | 说明                       |
11097| ------- | ------------------------- |
11098| [common2D.Rect](js-apis-graphics-common2D.md#rect) | 创建的矩形。 |
11099
11100**示例:**
11101
11102```ts
11103import { drawing, common2D } from '@kit.ArkGraphics2D';
11104
11105let rect = drawing.RectUtils.makeLtrb(10, 10, 20, 20);
11106```
11107
11108### makeCopy<sup>20+</sup>
11109
11110static makeCopy(src: common2D.Rect): common2D.Rect;
11111
11112拷贝一个矩形。
11113
11114**系统能力**:SystemCapability.Graphics.Drawing
11115
11116**参数:**
11117
11118| 参数名 | 类型    | 必填 | 说明           |
11119| ------ | ------ | ---- | -------------- |
11120| src   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 用于拷贝的矩形。 |
11121
11122
11123**返回值:**
11124
11125| 类型    | 说明                       |
11126| ------- | ------------------------- |
11127| [common2D.Rect](js-apis-graphics-common2D.md#rect) | 创建的新矩形。 |
11128
11129**示例:**
11130
11131```ts
11132import { drawing, common2D } from '@kit.ArkGraphics2D';
11133let rect = drawing.RectUtils.makeLtrb(10, 10, 20, 20);
11134let rect2 = drawing.RectUtils.makeCopy(rect);
11135console.info('rect2.left:', rect2.left);
11136console.info('rect2.top: ', rect2.top);
11137console.info('rect2.right: ', rect2.right);
11138console.info('rect2.bottom: ', rect2.bottom);
11139```
11140
11141### getWidth<sup>20+</sup>
11142
11143static getWidth(rect: common2D.Rect): number
11144
11145获取矩形的宽度。
11146
11147**系统能力:** SystemCapability.Graphics.Drawing
11148
11149**参数:**
11150
11151| 参数名 | 类型    | 必填 | 说明           |
11152| ------ | ------ | ---- | -------------- |
11153| rect   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 矩形对象。 |
11154
11155
11156**返回值:**
11157
11158| 类型    | 说明                       |
11159| ------- | ------------------------- |
11160| number | 返回矩形的宽。如果矩形的左边界大于右边界,获取的宽度为负值,左边界小于右边界则为正值。 |
11161
11162**示例:**
11163
11164```ts
11165import { drawing, common2D } from '@kit.ArkGraphics2D';
11166let rect = drawing.RectUtils.makeLtrb(10, 10, 20, 20);
11167let width = drawing.RectUtils.getWidth(rect);
11168console.info('width :', width);
11169```
11170
11171### getHeight<sup>20+</sup>
11172
11173static getHeight(rect: common2D.Rect): number
11174
11175获取矩形的高度。
11176
11177**系统能力:** SystemCapability.Graphics.Drawing
11178
11179**参数:**
11180
11181| 参数名 | 类型    | 必填 | 说明           |
11182| ------ | ------ | ---- | -------------- |
11183| rect   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 矩形对象。 |
11184
11185**返回值:**
11186
11187| 类型    | 说明                       |
11188| ------- | ------------------------- |
11189| number | 返回矩形的高。如果矩形的上边界大于下边界,获取的高度为负值,上边界小于下边界则为正值。|
11190
11191**示例:**
11192
11193```ts
11194import { drawing, common2D } from '@kit.ArkGraphics2D';
11195let rect = drawing.RectUtils.makeLtrb(10, 10, 20, 20);
11196let height = drawing.RectUtils.getHeight(rect);
11197```
11198
11199### centerX<sup>20+</sup>
11200
11201static centerX(rect: common2D.Rect): number
11202
11203获取矩形中心的横坐标。
11204
11205**系统能力:** SystemCapability.Graphics.Drawing
11206
11207**参数:**
11208
11209| 参数名 | 类型    | 必填 | 说明           |
11210| ------ | ------ | ---- | -------------- |
11211| rect   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 矩形对象。 |
11212
11213**返回值:**
11214
11215| 类型    | 说明                       |
11216| ------- | ------------------------- |
11217| number | 返回矩形中心的横坐标。 |
11218
11219**示例:**
11220
11221```ts
11222import { drawing, common2D } from '@kit.ArkGraphics2D';
11223let rect = drawing.RectUtils.makeLtrb(20, 30, 30, 40);
11224let x = drawing.RectUtils.centerX(rect);
11225```
11226
11227### centerY<sup>20+</sup>
11228
11229static centerY(rect: common2D.Rect): number
11230
11231获取矩形中心的纵坐标。
11232
11233**系统能力:** SystemCapability.Graphics.Drawing
11234
11235**参数:**
11236
11237| 参数名 | 类型    | 必填 | 说明           |
11238| ------ | ------ | ---- | -------------- |
11239| rect   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 矩形对象。 |
11240
11241**返回值:**
11242
11243| 类型    | 说明                       |
11244| ------- | ------------------------- |
11245| number | 返回矩形中心的纵坐标。 |
11246
11247**示例:**
11248
11249```ts
11250import { drawing, common2D } from '@kit.ArkGraphics2D';
11251let rect = drawing.RectUtils.makeLtrb(20, 30, 30, 40);
11252let x = drawing.RectUtils.centerY(rect);
11253```
11254
11255### contains<sup>20+</sup>
11256
11257static contains(rect: common2D.Rect, other: common2D.Rect): boolean
11258
11259判断一个矩形是否完全包含另外一个矩形。
11260
11261**系统能力:** SystemCapability.Graphics.Drawing
11262
11263**参数:**
11264
11265| 参数名 | 类型    | 必填 | 说明           |
11266| ------ | ------ | ---- | -------------- |
11267| rect   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 矩形对象。 |
11268| other   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 判断是否被包含的矩形对象。 |
11269
11270**返回值:**
11271
11272| 类型    | 说明                       |
11273| ------- | ------------------------- |
11274| boolean | 返回矩形是否完全包含另一个矩形的结果。true表示指定矩形在另一个矩形内部或者相等,false表示指定矩形在另一个矩形外部。空的矩形不包含任何矩形。|
11275
11276**示例:**
11277
11278```ts
11279import { drawing, common2D } from '@kit.ArkGraphics2D';
11280let rect = drawing.RectUtils.makeLtrb(10, 10, 20, 20);
11281let rect2 = drawing.RectUtils.makeLtrb(0, 0, 40, 40);
11282let isContains = drawing.RectUtils.contains(rect2, rect);
11283console.info('isContains: ', isContains);
11284```
11285
11286### contains<sup>20+</sup>
11287
11288static contains(rect: common2D.Rect, left: number, top: number, right: number, bottom: number): boolean
11289
11290判断一个矩形是否完全包含另外一个矩形(另一个矩形分别用左上右下坐标表示)。
11291
11292**系统能力:** SystemCapability.Graphics.Drawing
11293
11294**参数:**
11295
11296| 参数名 | 类型    | 必填 | 说明           |
11297| ------ | ------ | ---- | -------------- |
11298| rect   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 矩形对象。 |
11299| left   | number | 是   | 矩形的左上角x轴坐标,该参数为浮点数。0表示坐标原点,负数表示位于坐标原点左侧,正数表示位于坐标原点右侧。 |
11300| top    | number | 是   | 矩形的左上角y轴坐标,该参数为浮点数。0表示坐标原点,负数表示位于坐标原点上侧,正数表示位于坐标原点下侧。 |
11301| right  | number | 是   | 矩形的右下角x轴坐标,该参数为浮点数。0表示坐标原点,负数表示位于坐标原点左侧,正数表示位于坐标原点右侧。 |
11302| bottom | number | 是   | 矩形的右下角y轴坐标,该参数为浮点数。0表示坐标原点,负数表示位于坐标原点上侧,正数表示位于坐标原点下侧。 |
11303
11304**返回值:**
11305
11306| 类型    | 说明                       |
11307| ------- | ------------------------- |
11308| boolean | 返回矩形是否完全包含由左上右下坐标组成的矩形的结果。true表示指定左上右下坐标组成的矩形在矩形的内部或者相等,false表示指定左上右下坐标组成的矩形在矩形的外部。空的矩形不包含任何矩形。|
11309
11310**示例:**
11311
11312```ts
11313import { drawing, common2D } from '@kit.ArkGraphics2D';
11314let rect = drawing.RectUtils.makeLtrb(0, 0, 100, 100);
11315let isContains = drawing.RectUtils.contains(rect, 10, 20, 30, 40);
11316console.info('isContains :', isContains);
11317```
11318
11319### contains<sup>20+</sup>
11320
11321static contains(rect: common2D.Rect, x: number, y: number): boolean
11322
11323判断一个矩形是否完全包含一个点。
11324
11325**系统能力:** SystemCapability.Graphics.Drawing
11326
11327**参数:**
11328
11329| 参数名 | 类型    | 必填 | 说明           |
11330| ------ | ------ | ---- | -------------- |
11331| rect   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 矩形对象。 |
11332| x   | number | 是   | 要判断点的x轴坐标,该参数为浮点数。0表示坐标原点,负数表示位于坐标原点左侧,正数表示位于坐标原点右侧。 |
11333| y    | number | 是  | 要判断点的y轴坐标,该参数为浮点数。0表示坐标原点,负数表示位于坐标原点上侧,正数表示位于坐标原点下侧。 |
11334
11335**返回值:**
11336
11337| 类型    | 说明                       |
11338| ------- | ------------------------- |
11339| boolean | 返回矩形是否完全包含x、y组成的点的结果。true表示矩形完全包含x、y组成的点,false表示矩形不完全包含x、y组成的点。左边界和上边界属于矩形内部,右边界和下边界不属于矩形内部。空的矩形不包含任何点。|
11340
11341**示例:**
11342
11343```ts
11344import { drawing, common2D } from '@kit.ArkGraphics2D';
11345let rect = drawing.RectUtils.makeLtrb(0, 0, 100, 100);
11346let isContains = drawing.RectUtils.contains(rect, 10, 20);
11347console.info('isContains: ', isContains);
11348```
11349
11350### inset<sup>20+</sup>
11351
11352static inset(rect: common2D.Rect, left: number, top: number, right: number, bottom: number): void
11353
11354将指定矩形的左边界、上边界、右边界和下边界分别和传入的"左上右下"的值相加。
11355
11356**系统能力:** SystemCapability.Graphics.Drawing
11357
11358**参数:**
11359
11360| 参数名 | 类型    | 必填 | 说明           |
11361| ------ | ------ | ---- | -------------- |
11362| rect   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 矩形对象。 |
11363| left   | number | 是   | 添加到矩形左边界的值(矩形左上角横坐标),该参数为浮点数。0表示不进行任何运算,正数表示进行相加运算,负数表示相减运算。 |
11364| top    | number | 是   | 添加到矩形上边界的值(矩形左上角纵坐标),该参数为浮点数。0表示不进行任何运算,正数表示进行相加运算,负数表示相减运算。 |
11365| right  | number | 是   | 添加到矩形右边界的值(矩形右下角横坐标),该参数为浮点数。0表示不进行任何运算,正数表示进行相加运算,负数表示相减运算。 |
11366| bottom | number | 是   | 添加到矩形下边界的值(矩形右下角纵坐标),该参数为浮点数。0表示不进行任何运算,正数表示进行相加运算,负数表示相减运算。 |
11367
11368**示例:**
11369
11370```ts
11371import { drawing, common2D } from '@kit.ArkGraphics2D';
11372let rect = drawing.RectUtils.makeLtrb(10, 10, 20, 20);
11373drawing.RectUtils.inset(rect, 10, -20, 30, 60);
11374console.info('rect.left:', rect.left);
11375console.info('rect.top: ', rect.top);
11376console.info('rect.right: ', rect.right);
11377console.info('rect.bottom: ', rect.bottom);
11378```
11379
11380### intersect<sup>20+</sup>
11381
11382static intersect(rect: common2D.Rect, other: common2D.Rect): boolean
11383
11384计算两个矩形的交集区域,并将交集结果更新到第一个入参代表的矩形区域。
11385
11386**系统能力:** SystemCapability.Graphics.Drawing
11387
11388**参数:**
11389
11390| 参数名 | 类型    | 必填 | 说明           |
11391| ------ | ------ | ---- | -------------- |
11392| rect   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 用于计算交集的原矩形。 |
11393| other   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是  | 用于计算交集的另一个矩形。 |
11394
11395**返回值:**
11396
11397| 类型    | 说明                       |
11398| ------- | ------------------------- |
11399| boolean |  返回两个矩形是否有交集的结果。true表示两个矩形有交集,false表示两个矩形没有交集。 |
11400
11401**示例:**
11402
11403```ts
11404import { drawing, common2D } from '@kit.ArkGraphics2D';
11405let rect = drawing.RectUtils.makeLtrb(0, 0, 20, 20);
11406let rect2 = drawing.RectUtils.makeLtrb(10, 10, 40, 40);
11407let isIntersect = drawing.RectUtils.intersect(rect, rect2);
11408console.info('isIntersect :', isIntersect);
11409console.info('rect.left:', rect.left);
11410console.info('rect.top: ', rect.top);
11411console.info('rect.right: ', rect.right);
11412console.info('rect.bottom: ', rect.bottom);
11413```
11414
11415### isIntersect<sup>20+</sup>
11416
11417static isIntersect(rect: common2D.Rect, other: common2D.Rect): boolean
11418
11419判断两个矩形是否相交。
11420
11421**系统能力:** SystemCapability.Graphics.Drawing
11422
11423**参数:**
11424
11425| 参数名 | 类型    | 必填 | 说明           |
11426| ------ | ------ | ---- | -------------- |
11427| rect   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 用于计算交集的原矩形。 |
11428| other   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是  | 用于计算交集的另一个矩形。 |
11429
11430**返回值:**
11431
11432| 类型    | 说明                       |
11433| ------- | ------------------------- |
11434| boolean |  返回两个矩形是否有交集的结果。true表示指定矩形与原矩形相交,false表示指定矩形和原矩形没有交集。两矩形仅边重叠或点相交返回false。|
11435
11436**示例:**
11437
11438```ts
11439import { drawing, common2D } from '@kit.ArkGraphics2D';
11440let rect = drawing.RectUtils.makeLtrb(0, 0, 20, 20);
11441let rect2 = drawing.RectUtils.makeLtrb(10, 10, 40, 40);
11442let isIntersect = drawing.RectUtils.isIntersect(rect, rect2);
11443console.info('isIntersect :', isIntersect);
11444```
11445
11446### union<sup>20+</sup>
11447
11448static union(rect: common2D.Rect, other: common2D.Rect): void
11449
11450计算矩形的并集区域,并将并集结果更新到第一个入参表示的矩形区域。如果第一个入参矩形为空,则将并集结果更新到第二个入参代表的矩形区域;如果第二个入参的矩形为空,则不进行任何操作。
11451
11452**系统能力:** SystemCapability.Graphics.Drawing
11453
11454**参数:**
11455
11456| 参数名 | 类型    | 必填 | 说明           |
11457| ------ | ------ | ---- | -------------- |
11458| rect   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 用于计算并集的原矩形。 |
11459| other   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是  | 用于计算并集的另一个矩形。 |
11460
11461**示例:**
11462
11463```ts
11464import { drawing, common2D } from '@kit.ArkGraphics2D';
11465let rect = drawing.RectUtils.makeLtrb(0, 0, 20, 20);
11466let rect2 = drawing.RectUtils.makeLtrb(10, 10, 40, 40);
11467drawing.RectUtils.union(rect, rect2);
11468console.info('rect.left:', rect.left);
11469console.info('rect.top: ', rect.top);
11470console.info('rect.right: ', rect.right);
11471console.info('rect.bottom: ', rect.bottom);
11472```
11473
11474### isEmpty<sup>20+</sup>
11475
11476static isEmpty(rect: common2D.Rect): boolean
11477
11478判断矩形是否为空(左边界大于等于右边界或者上边界大于等于下边界)。
11479
11480**系统能力:** SystemCapability.Graphics.Drawing
11481
11482**参数:**
11483
11484| 参数名 | 类型    | 必填 | 说明            |
11485| ------ | ------ | ---- | --------------  |
11486| rect   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 用于判断的矩形对象。 |
11487
11488**返回值:**
11489
11490| 类型    | 说明                       |
11491| ------- | ------------------------- |
11492| boolean | 返回矩形是否为空的结果。true表示矩形是空,false表示矩形不为空。       |
11493
11494**示例:**
11495
11496```ts
11497import { drawing, common2D } from '@kit.ArkGraphics2D';
11498let rect = drawing.RectUtils.makeEmpty();
11499let isEmpty = drawing.RectUtils.isEmpty(rect);
11500console.info('isEmpty :', isEmpty);
11501let rect2 = drawing.RectUtils.makeLtrb(0, 0, 20, 20);
11502isEmpty = drawing.RectUtils.isEmpty(rect);
11503console.info('isEmpty :', isEmpty);
11504```
11505
11506### offset<sup>20+</sup>
11507
11508static offset(rect: common2D.Rect, dx: number, dy: number): void
11509
11510对矩形进行平移。
11511
11512**系统能力:** SystemCapability.Graphics.Drawing
11513
11514**参数:**
11515
11516| 参数名 | 类型    | 必填 | 说明           |
11517| ------ | ------ | ---- | -------------- |
11518| rect   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 发生偏移的矩形区域。 |
11519| dx   | number | 是    | 水平方向平移的距离,该参数为浮点数。0表示不平移,负数表示向左平移,正数表示向右平移。 |
11520| dy    | number | 是   | 竖直方向平移的距离,该参数为浮点数。0表示不平移,负数表示向上平移,正数表示向右平移。 |
11521
11522**示例:**
11523
11524```ts
11525import { drawing, common2D } from '@kit.ArkGraphics2D';
11526let rect = drawing.RectUtils.makeLtrb(0, 0, 20, 20);
11527drawing.RectUtils.offset(rect, 10, 20);
11528console.info('rect.left:', rect.left);
11529console.info('rect.top: ', rect.top);
11530console.info('rect.right: ', rect.right);
11531console.info('rect.bottom: ', rect.bottom);
11532```
11533
11534### offsetTo<sup>20+</sup>
11535
11536static offsetTo(rect: common2D.Rect, newLeft: number, newTop: number): void
11537
11538将矩形平移到指定位置。
11539
11540**系统能力:** SystemCapability.Graphics.Drawing
11541
11542**参数:**
11543
11544| 参数名 | 类型    | 必填 | 说明           |
11545| ------ | ------ | ---- | -------------- |
11546| rect   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 发生偏移的矩形区域。 |
11547| newLeft   | number | 是   | 要平移到的对应位置的x轴坐标,浮点数。0表示坐标原点,负数位于坐标原点左侧,正数位于坐标原点右侧。 |
11548| newTop    | number | 是   | 要平移到的对应位置的y轴坐标,浮点数。0表示坐标原点,负数位于坐标原点上侧,正数位于坐标原点下侧。 |
11549
11550**示例:**
11551
11552```ts
11553import { drawing, common2D } from '@kit.ArkGraphics2D';
11554let rect = drawing.RectUtils.makeLtrb(40, 40, 20, 20);
11555drawing.RectUtils.offsetTo(rect, 10, 20);
11556console.info('rect.left:', rect.left);
11557console.info('rect.top: ', rect.top);
11558console.info('rect.right: ', rect.right);
11559console.info('rect.bottom: ', rect.bottom);
11560```
11561
11562### setRect<sup>20+</sup>
11563
11564static setRect(rect: common2D.Rect, other: common2D.Rect): void
11565
11566使用另一个矩形对当前矩形进行赋值。
11567
11568**系统能力:** SystemCapability.Graphics.Drawing
11569
11570**参数:**
11571
11572| 参数名 | 类型    | 必填 | 说明           |
11573| ------ | ------ | ---- | -------------- |
11574| rect   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   |  原矩形。 |
11575| other   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 用于赋值的矩形。 |
11576
11577**示例:**
11578
11579```ts
11580import { drawing, common2D } from '@kit.ArkGraphics2D';
11581let rect = drawing.RectUtils.makeLtrb(10, 20, 30, 40);
11582let rect2 = drawing.RectUtils.makeEmpty();
11583drawing.RectUtils.setRect(rect2, rect);
11584console.info('rect2.left:', rect2.left);
11585console.info('rect2.top: ', rect2.top);
11586console.info('rect2.right: ', rect2.right);
11587console.info('rect2.bottom: ', rect2.bottom);
11588```
11589
11590### setLtrb<sup>20+</sup>
11591
11592static setLtrb(rect: common2D.Rect, left: number, top: number, right: number, bottom: number): void
11593
11594使用传入的"上下左右"的值更新当前矩形的上下左右边界值。
11595
11596**系统能力**:SystemCapability.Graphics.Drawing
11597
11598**参数:**
11599
11600| 参数名 | 类型    | 必填 | 说明           |
11601| ------ | ------ | ---- | -------------- |
11602| rect   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 矩形对象。 |
11603| left   | number | 是   | 矩形的左上角x轴坐标,该参数为浮点数。0表示坐标原点,负数表示位于坐标原点左侧,正数表示位于坐标原点右侧。 |
11604| top    | number | 是   | 矩形的左上角y轴坐标,该参数为浮点数。0表示坐标原点,负数表示位于坐标原点上侧,正数表示位于坐标原点下侧。 |
11605| right  | number | 是   | 矩形的右下角x轴坐标,该参数为浮点数。0表示坐标原点,负数表示位于坐标原点左侧,正数表示位于坐标原点右侧。 |
11606| bottom | number | 是   | 矩形的右下角y轴坐标,该参数为浮点数。0表示坐标原点,负数表示位于坐标原点上侧,正数表示位于坐标原点下侧。 |
11607
11608**示例:**
11609
11610```ts
11611import { drawing, common2D } from '@kit.ArkGraphics2D';
11612let rect = drawing.RectUtils.makeEmpty();
11613drawing.RectUtils.setLtrb(rect, 10, 20, 30, 60);
11614console.info('rect.left:', rect.left);
11615console.info('rect.top: ', rect.top);
11616console.info('rect.right: ', rect.right);
11617console.info('rect.bottom: ', rect.bottom);
11618```
11619
11620### setEmpty<sup>20+</sup>
11621
11622static setEmpty(rect: common2D.Rect): void
11623
11624将矩形的上下左右边界都设为0。
11625
11626**系统能力:** SystemCapability.Graphics.Drawing
11627
11628**参数:**
11629
11630| 参数名 | 类型    | 必填 | 说明            |
11631| ------ | ------ | ---- | --------------  |
11632| rect   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 用于设置为空的矩形对象。 |
11633
11634**示例:**
11635
11636```ts
11637import { drawing, common2D } from '@kit.ArkGraphics2D';
11638let rect = drawing.RectUtils.makeLtrb(10, 20, 20, 30);
11639drawing.RectUtils.setEmpty(rect)
11640console.info('rect.left:', rect.left);
11641console.info('rect.top: ', rect.top);
11642console.info('rect.right: ', rect.right);
11643console.info('rect.bottom: ', rect.bottom);
11644```
11645
11646### sort<sup>20+</sup>
11647
11648static sort(rect: common2D.Rect): void
11649
11650如果矩形存在反转的情况(即左边界大于右边界或上边界大于下边界),则对矩形的上下(左右)边界值进行交换,使得上边界小于下边界(左边界小于右边界)。
11651
11652如果矩形不存在反转的情况(即左边界小于等于右边界或上边界小于等于下边界),不做任何操作。
11653
11654**系统能力:** SystemCapability.Graphics.Drawing
11655
11656**参数:**
11657
11658| 参数名 | 类型    | 必填 | 说明            |
11659| ------ | ------ | ---- | --------------  |
11660| rect   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 用于设置的矩形对象。 |
11661
11662**示例:**
11663
11664```ts
11665import { drawing, common2D } from '@kit.ArkGraphics2D';
11666let rect = drawing.RectUtils.makeLtrb(20, 40, 30, 30);
11667drawing.RectUtils.sort(rect);
11668console.info('rect.left:', rect.left);
11669console.info('rect.top: ', rect.top);
11670console.info('rect.right: ', rect.right);
11671console.info('rect.bottom: ', rect.bottom);
11672```
11673
11674### isEqual<sup>20+</sup>
11675
11676static isEqual(rect: common2D.Rect, other: common2D.Rect): boolean
11677
11678判断两个矩形是否相等。
11679
11680**系统能力:** SystemCapability.Graphics.Drawing
11681
11682**参数:**
11683
11684| 参数名 | 类型    | 必填 | 说明           |
11685| ------ | ------ | ---- | -------------- |
11686| rect   | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是    | 需要判断的原矩形。 |
11687| other  | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是   | 需要判断的另一矩形。 |
11688
11689**返回值:**
11690
11691| 类型    | 说明                       |
11692| ------- | ------------------------- |
11693| boolean | 返回两个矩形是否相等的结果。true表示两个矩形相等,false表示两个矩形不相等。 |
11694
11695**示例:**
11696
11697```ts
11698import { drawing, common2D } from '@kit.ArkGraphics2D';
11699let rect = drawing.RectUtils.makeLtrb(10, 20, 20, 30);
11700let rect2 = drawing.RectUtils.makeEmpty();
11701let isEqual = drawing.RectUtils.isEqual(rect, rect2);
11702console.info('isEqual :', isEqual);
11703```