1# @ohos.graphics.drawing (绘制模块) 2 3drawing模块提供了基本的绘制能力,如绘制矩形、圆形、点、直线、自定义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混合模式枚举。混合模式的操作会为两种颜色(源色、目标色)生成一种新的颜色。 这些操作在红、绿、蓝3个颜色通道上是相同的(透明度有另外的处理规则)。 对于这些,我们使用透明度通道作为示例,而不是单独命名每个通道。 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,设置为全透明。 |  | 38| SRC | 1 | r = s(result的4个通道,都等于source的4个通道,即结果等于源。),使用源像素替换目标像素。 |  | 39| DST | 2 | r = d(result的4个通道,都等于destination的4个通道,即结果等于目标。),保持目标像素不变。 |  | 40| SRC_OVER | 3 | r = s + (1 - sa) * d,在目标像素上方绘制源像素,考虑源像素的透明度。 |  | 41| DST_OVER | 4 | r = d + (1 - da) * s,在源像素上方绘制目标像素,考虑目标像素的透明度。 |  | 42| SRC_IN | 5 | r = s * da,仅保留源像素与目标不透明部分的交集。 |  | 43| DST_IN | 6 | r = d * sa,仅保留目标像素与源不透明部分的交集。 |  | 44| SRC_OUT | 7 | r = s * (1 - da),保留源像素中不与目标重叠的部分。 |  | 45| DST_OUT | 8 | r = d * (1 - sa),保留目标像素中不与源重叠的部分。 |  | 46| SRC_ATOP | 9 | r = s * da + d * (1 - sa),源像素覆盖在目标像素上,仅在目标不透明部分显示源像素。 |  | 47| DST_ATOP | 10 | r = d * sa + s * (1 - da),目标像素覆盖在源像素上,仅在源不透明部分显示目标像素。 |  | 48| XOR | 11 | r = s * (1 - da) + d * (1 - sa),仅显示源像素和目标像素中不重叠的部分。 |  | 49| PLUS | 12 | r = min(s + d, 1),源和目标像素的颜色值相加。 |  | 50| MODULATE | 13 | r = s * d,源和目标像素的颜色值相乘。 |  | 51| SCREEN | 14 | 滤色模式,r = s + d - s * d,反转源和目标像素的颜色值,相乘后再反转,结果通常更亮。 |  | 52| OVERLAY | 15 | 叠加模式,根据目标像素的亮度,选择性地应用MULTIPLY或SCREEN模式,增强对比度。 |  | 53| DARKEN | 16 | 变暗模式,rc = s + d - max(s * da, d * sa), ra = s + (1 - sa) * d,取源和目标像素中较暗的颜色值。 |  | 54| LIGHTEN | 17 | 变亮模式,rc = s + d - min(s * da, d * sa), ra = s + (1 - sa) * d,取源和目标像素中较亮的颜色值。 |  | 55| COLOR_DODGE | 18 | 颜色减淡模式,通过减小对比度使目标像素变亮以反映源像素。 |  | 56| COLOR_BURN | 19 | 颜色加深模式,通过增加对比度使目标像素变暗以反映源像素。 |  | 57| HARD_LIGHT | 20 | 强光模式,根据源像素的亮度,选择性地应用MULTIPLY或SCREEN模式。 |  | 58| SOFT_LIGHT | 21 | 柔光模式,根据源像素的亮度,柔和地变亮或变暗目标像素。 |  | 59| DIFFERENCE | 22 | 差值模式,rc = s + d - 2 * (min(s * da, d * sa)), ra = s + (1 - sa) * d,计算源和目标像素颜色值的差异。 |  | 60| EXCLUSION | 23 | 排除模式,rc = s + d - two(s * d), ra = s + (1 - sa) * d,类似于DIFFERENCE,但对比度较低。 |  | 61| MULTIPLY | 24 | 正片叠底,r = s * (1 - da) + d * (1 - sa) + s * d,源和目标像素的颜色值相乘,结果通常更暗。 |  | 62| HUE | 25 | 色相模式,使用源像素的色相,目标像素的饱和度和亮度。 |  | 63| SATURATION | 26 | 饱和度模式,使用源像素的饱和度,目标像素的色相和亮度。 |  | 64| COLOR | 27 | 颜色模式,使用源像素的色相和饱和度,目标像素的亮度。 |  | 65| LUMINOSITY | 28 | 亮度模式,使用源像素的亮度,目标像素的色相和饱和度。 |  | 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迭代器包含的路径操作类型枚举。 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表示路径操作迭代器。 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'; 155let path: drawing.Path = new drawing.Path(); 156let iter: drawing.PathIterator = new drawing.PathIterator(path); 157``` 158 159### next<sup>18+</sup> 160 161next(points: Array<common2D.Point>, offset?: number): PathIteratorVerb 162 163返回当前路径的下一个操作,并将迭代器置于该操作。 164 165**系统能力:** SystemCapability.Graphics.Drawing 166 167**参数:** 168 169| 参数名 | 类型 | 必填 | 说明 | 170| -------- | -------------------------------------------- | ---- | ------------------------------- | 171| points | Array\<[common2D.Point](js-apis-graphics-common2D.md#point)> | 是 | 坐标点数组,数组长度需要大于等于4,在操作后数组会被重写,数组中坐标点数对的数量取决于路径操作类型。具体来说:MOVE操作会在坐标点数组中填入1组坐标点;LINE操作会在坐标点数组中填入2组坐标点;QUAD操作会在坐标点数组中填入3组坐标点;CONIC操作会在坐标点数组中填入3.5组坐标点,即3组坐标点加圆锥曲线的权重;CUBIC操作会在坐标点数组中填入4组坐标点;CLOSE、DONE操作不会在坐标点数组中填入坐标点。因此坐标点数组长度至少为偏移量加上4。 | 172| offset | number | 否 | 数组中写入位置相对起始点的偏移量,默认为0,取值范围为[0, size-4],size是指坐标点数组长度。 | 173 174**返回值:** 175 176| 类型 | 说明 | 177| --------------------- | -------------- | 178| [PathIteratorVerb](#pathiteratorverb18) | 迭代器包含的路径操作类型。 | 179 180**错误码:** 181 182以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 183 184| 错误码ID | 错误信息 | 185| ------- | --------------------------------------------| 186| 401 | Parameter error.Possible causes:1. Mandatory parameters are left unspecified;2. Incorrect parameter types; 3. Parameter verification failed. | 187 188**示例:** 189 190```ts 191import { common2D, drawing } from '@kit.ArkGraphics2D'; 192let path: drawing.Path = new drawing.Path(); 193path.moveTo(10, 20); 194let iter: drawing.PathIterator = new drawing.PathIterator(path); 195let verbStr: Array<string> = ["MOVE", "LINE", "QUAD", "CONIC", "CUBIC", "CLOSE", "DONE"]; 196let pointCount: Array<number> = [1,2,3,4,4,0,0]; //1,2,3,3.5,4,0,0 197let points: Array<common2D.Point> = [{x: 0, y: 0}, {x: 0, y: 0}, {x: 0, y: 0}, {x: 0, y: 0}]; 198let offset = 0; 199let verb = iter.next(points, offset); 200let outputMessage: string = "pathIteratorNext: "; 201outputMessage += "verb =" + verbStr[verb] + "; has " + pointCount[verb] + " pairs: "; 202for (let j = 0; j < pointCount[verb] + offset; j++) { 203 outputMessage += "[" + points[j].x + ", " + points[j].y + "]"; 204} 205console.info(outputMessage); 206``` 207 208### peek<sup>18+</sup> 209 210peek(): PathIteratorVerb 211 212返回当前路径的下一个操作,迭代器仍在原操作。 213 214**系统能力:** SystemCapability.Graphics.Drawing 215 216**返回值:** 217 218| 类型 | 说明 | 219| --------------------- | -------------- | 220| [PathIteratorVerb](#pathiteratorverb18) | 迭代器包含的路径操作类型。 | 221 222**示例:** 223 224```ts 225import { drawing } from '@kit.ArkGraphics2D'; 226let path: drawing.Path = new drawing.Path(); 227let iter: drawing.PathIterator = new drawing.PathIterator(path); 228let res = iter.peek(); 229``` 230 231### hasNext<sup>18+</sup> 232 233hasNext(): boolean 234 235判断路径操作迭代器中是否还有其他操作。 236 237**系统能力:** SystemCapability.Graphics.Drawing 238 239**返回值:** 240 241| 类型 | 说明 | 242| ------- | -------------- | 243| boolean | 判断路径操作迭代器中是否还有其他操作。true表示有,false表示没有。 | 244 245**示例:** 246 247```ts 248import { drawing } from '@kit.ArkGraphics2D'; 249let path: drawing.Path = new drawing.Path(); 250let iter: drawing.PathIterator = new drawing.PathIterator(path); 251let res = iter.hasNext(); 252``` 253 254## Path 255 256由直线、圆弧、二阶贝塞尔、三阶贝塞尔组成的复合几何路径。 257 258### constructor<sup>12+</sup> 259 260constructor() 261 262构造一个路径。 263 264**系统能力:** SystemCapability.Graphics.Drawing 265 266**示例:** 267 268```ts 269import { drawing } from '@kit.ArkGraphics2D'; 270let path: drawing.Path = new drawing.Path(); 271``` 272 273### constructor<sup>12+</sup> 274 275constructor(path: Path) 276 277构造一个已有路径的副本。 278 279**系统能力:** SystemCapability.Graphics.Drawing 280 281**参数:** 282 283| 参数名 | 类型 | 必填 | 说明 | 284| -------- | -------------------------------------------- | ---- | ------------------------------- | 285| path | [Path](#path) | 是 | 待复制的路径对象。 | 286 287**示例:** 288 289```ts 290import { drawing } from '@kit.ArkGraphics2D'; 291let path: drawing.Path = new drawing.Path(); 292path.moveTo(0, 0); 293path.lineTo(0, 700); 294path.lineTo(700, 0); 295path.close(); 296let path1: drawing.Path = new drawing.Path(path); 297``` 298 299### moveTo 300 301moveTo(x: number, y: number) : void 302 303用于设置自定义路径的起始点位置。 304 305**系统能力**:SystemCapability.Graphics.Drawing 306 307**参数:** 308 309| 参数名 | 类型 | 必填 | 说明 | 310| ------ | ------ | ---- | ----------------------- | 311| x | number | 是 | 起始点的x轴坐标,该参数为浮点数。 | 312| y | number | 是 | 起始点的y轴坐标,该参数为浮点数。 | 313 314**错误码:** 315 316以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 317 318| 错误码ID | 错误信息 | 319| ------- | --------------------------------------------| 320| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 321 322**示例:** 323 324```ts 325import { drawing } from '@kit.ArkGraphics2D'; 326let path = new drawing.Path(); 327path.moveTo(10,10); 328``` 329 330### lineTo 331 332lineTo(x: number, y: number) : void 333 334用于添加一条从路径的最后点位置(若路径没有内容则默认为 (0, 0))到目标点位置的线段。 335 336**系统能力**:SystemCapability.Graphics.Drawing 337 338**参数:** 339 340| 参数名 | 类型 | 必填 | 说明 | 341| ------ | ------ | ---- | ----------------------- | 342| x | number | 是 | 目标点的x轴坐标,该参数为浮点数。 | 343| y | number | 是 | 目标点的y轴坐标,该参数为浮点数。 | 344 345**错误码:** 346 347以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 348 349| 错误码ID | 错误信息 | 350| ------- | --------------------------------------------| 351| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 352 353**示例:** 354 355```ts 356import { drawing } from '@kit.ArkGraphics2D'; 357let path = new drawing.Path(); 358path.moveTo(10,10); 359path.lineTo(10, 15); 360``` 361 362### arcTo 363 364arcTo(x1: number, y1: number, x2: number, y2: number, startDeg: number, sweepDeg: number): void 365 366用于给路径添加一段弧线,绘制弧线的方式为角度弧,该方式首先会指定一个矩形边框,矩形边框会包裹椭圆, 然后会指定一个起始角度和扫描度数,从起始角度扫描截取的椭圆周长一部分即为绘制的弧线。另外会默认添加一条从路径的最后点位置到弧线起始点位置的线段。 367 368**系统能力**:SystemCapability.Graphics.Drawing 369 370**参数:** 371 372| 参数名 | 类型 | 必填 | 说明 | 373| -------- | ------ | ---- | -------------------------- | 374| x1 | number | 是 | 矩形左上角的x坐标,该参数为浮点数。 | 375| y1 | number | 是 | 矩形左上角的y坐标,该参数为浮点数。 | 376| x2 | number | 是 | 矩形右下角的x坐标,该参数为浮点数。 | 377| y2 | number | 是 | 矩形右下角的y坐标,该参数为浮点数。 | 378| startDeg | number | 是 | 起始的角度。角度的起始方向(0°)为x轴正方向。 | 379| sweepDeg | number | 是 | 扫描的度数,为正数时顺时针扫描,为负数时逆时针扫描。实际扫描的度数为该入参对360取模的结果。 | 380 381**错误码:** 382 383以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 384 385| 错误码ID | 错误信息 | 386| ------- | --------------------------------------------| 387| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 388 389**示例:** 390 391```ts 392import { drawing } from '@kit.ArkGraphics2D'; 393let path = new drawing.Path(); 394path.moveTo(10,10); 395path.arcTo(10, 15, 10, 10, 10, 10); 396``` 397 398### quadTo 399 400quadTo(ctrlX: number, ctrlY: number, endX: number, endY: number): void 401 402用于添加一条从路径最后点位置(若路径没有内容则默认为 (0, 0))到目标点位置的二阶贝塞尔圆滑曲线。 403 404**系统能力**:SystemCapability.Graphics.Drawing 405 406**参数:** 407 408| 参数名 | 类型 | 必填 | 说明 | 409| ------ | ------ | ---- | --------------------- | 410| ctrlX | number | 是 | 控制点的x坐标,该参数为浮点数。 | 411| ctrlY | number | 是 | 控制点的y坐标,该参数为浮点数。 | 412| endX | number | 是 | 目标点的x坐标,该参数为浮点数。 | 413| endY | number | 是 | 目标点的y坐标,该参数为浮点数。 | 414 415**错误码:** 416 417以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 418 419| 错误码ID | 错误信息 | 420| ------- | --------------------------------------------| 421| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 422 423**示例:** 424 425```ts 426import { drawing } from '@kit.ArkGraphics2D'; 427let path = new drawing.Path(); 428path.moveTo(10,10); 429path.quadTo(10, 15, 10, 10); 430``` 431 432### conicTo<sup>12+</sup> 433 434conicTo(ctrlX: number, ctrlY: number, endX: number, endY: number, weight: number): void 435 436在当前路径上添加一条路径终点(若路径没有内容则默认为 (0, 0))到目标点位置的圆锥曲线,其控制点为 (ctrlX, ctrlY),结束点为 (endX, endY)。 437 438**系统能力**:SystemCapability.Graphics.Drawing 439 440**参数:** 441 442| 参数名 | 类型 | 必填 | 说明 | 443| ------ | ------ | ---- | --------------------- | 444| ctrlX | number | 是 | 控制点的x坐标,该参数为浮点数。 | 445| ctrlY | number | 是 | 控制点的y坐标,该参数为浮点数。 | 446| endX | number | 是 | 目标点的x坐标,该参数为浮点数。 | 447| endY | number | 是 | 目标点的y坐标,该参数为浮点数。 | 448| weight | number | 是 | 表示曲线的权重,决定了曲线的形状,越大越接近控制点。若小于等于0则等同于使用[lineTo](#lineto)添加一条到结束点的线段,若为1则等同于[quadTo](#quadto),该参数为浮点数。 | 449 450**错误码:** 451 452以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 453 454| 错误码ID | 错误信息 | 455| ------- | --------------------------------------------| 456| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 457 458**示例:** 459 460```ts 461import { drawing } from '@kit.ArkGraphics2D'; 462 463const path = new drawing.Path(); 464path.conicTo(200, 400, 100, 200, 0); 465``` 466 467### cubicTo 468 469cubicTo(ctrlX1: number, ctrlY1: number, ctrlX2: number, ctrlY2: number, endX: number, endY: number): void 470 471用于添加一条从路径最后点位置(若路径没有内容则默认为 (0, 0))到目标点位置的三阶贝塞尔圆滑曲线。 472 473**系统能力**:SystemCapability.Graphics.Drawing 474 475**参数:** 476 477| 参数名 | 类型 | 必填 | 说明 | 478| ------ | ------ | ---- | --------------------------- | 479| ctrlX1 | number | 是 | 第一个控制点的x坐标,该参数为浮点数。 | 480| ctrlY1 | number | 是 | 第一个控制点的y坐标,该参数为浮点数。 | 481| ctrlX2 | number | 是 | 第二个控制点的x坐标,该参数为浮点数。 | 482| ctrlY2 | number | 是 | 第二个控制点的y坐标,该参数为浮点数。 | 483| endX | number | 是 | 目标点的x坐标,该参数为浮点数。 | 484| endY | number | 是 | 目标点的y坐标,该参数为浮点数。 | 485 486**错误码:** 487 488以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 489 490| 错误码ID | 错误信息 | 491| ------- | --------------------------------------------| 492| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 493 494**示例:** 495 496```ts 497import { drawing } from '@kit.ArkGraphics2D'; 498let path = new drawing.Path(); 499path.moveTo(10,10); 500path.cubicTo(100, 100, 80, 150, 300, 150); 501``` 502 503### rMoveTo<sup>12+</sup> 504 505rMoveTo(dx : number, dy : number): void 506 507设置一个相对于当前路径终点(若路径没有内容则默认为 (0, 0))的路径起始点位置。 508 509**系统能力**:SystemCapability.Graphics.Drawing 510 511**参数:** 512 513| 参数名 | 类型 | 必填 | 说明 | 514| ------ | ------ | ---- | ----------------------- | 515| dx | number | 是 | 路径新起始点相对于当前路径终点的x轴偏移量,正数往x轴正方向偏移,负数往x轴负方向偏移,该参数为浮点数。 | 516| dy | number | 是 | 路径新起始点相对于当前路径终点的y轴偏移量,正数往y轴正方向偏移,负数往y轴负方向偏移,该参数为浮点数。 | 517 518**错误码:** 519 520以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 521 522| 错误码ID | 错误信息 | 523| ------- | --------------------------------------------| 524| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 525 526**示例:** 527 528```ts 529import { drawing } from '@kit.ArkGraphics2D'; 530 531const path = new drawing.Path(); 532path.rMoveTo(10, 10); 533``` 534 535### rLineTo<sup>12+</sup> 536 537rLineTo(dx : number, dy : number): void 538 539使用相对位置在当前路径上添加一条当前路径终点(若路径没有内容则默认为 (0, 0))到目标点位置的线段。 540 541**系统能力**:SystemCapability.Graphics.Drawing 542 543**参数:** 544 545| 参数名 | 类型 | 必填 | 说明 | 546| ------ | ------ | ---- | ----------------------- | 547| dx | number | 是 | 目标点相对于当前路径终点的x轴偏移量,正数往x轴正方向偏移,负数往x轴负方向偏移,该参数为浮点数。 | 548| dy | number | 是 | 目标点相对于当前路径终点的y轴偏移量,正数往y轴正方向偏移,负数往y轴负方向偏移,该参数为浮点数。 | 549 550**错误码:** 551 552以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 553 554| 错误码ID | 错误信息 | 555| ------- | --------------------------------------------| 556| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 557 558**示例:** 559 560```ts 561import { drawing } from '@kit.ArkGraphics2D'; 562 563const path = new drawing.Path(); 564path.rLineTo(400, 200); 565``` 566 567### rQuadTo<sup>12+</sup> 568 569rQuadTo(dx1: number, dy1: number, dx2: number, dy2: number): void 570 571使用相对位置在当前路径上添加一条当前路径终点(若路径没有内容则默认为 (0, 0))到目标点位置的二阶贝塞尔曲线。 572 573**系统能力**:SystemCapability.Graphics.Drawing 574 575**参数:** 576 577| 参数名 | 类型 | 必填 | 说明 | 578| ------ | ------ | ---- | --------------------- | 579| dx1 | number | 是 | 控制点相对于路径终点的x轴偏移量,正数往x轴正方向偏移,负数往x轴负方向偏移,该参数为浮点数。 | 580| dy1 | number | 是 | 控制点相对于路径终点的y轴偏移量,正数往y轴正方向偏移,负数往y轴负方向偏移,该参数为浮点数。 | 581| dx2 | number | 是 | 目标点相对于路径终点的x轴偏移量,正数往x轴正方向偏移,负数往x轴负方向偏移,该参数为浮点数。 | 582| dy2 | number | 是 | 目标点相对于路径终点的y轴偏移量,正数往y轴正方向偏移,负数往y轴负方向偏移,该参数为浮点数。 | 583 584**错误码:** 585 586以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 587 588| 错误码ID | 错误信息 | 589| ------- | --------------------------------------------| 590| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 591 592**示例:** 593 594```ts 595import { drawing } from '@kit.ArkGraphics2D'; 596 597const path = new drawing.Path(); 598path.rQuadTo(100, 0, 0, 200); 599``` 600 601### rConicTo<sup>12+</sup> 602 603rConicTo(ctrlX: number, ctrlY: number, endX: number, endY: number, weight: number): void 604 605使用相对位置在当前路径上添加一条路径终点(若路径没有内容则默认为 (0, 0))到目标点位置的圆锥曲线。 606 607**系统能力**:SystemCapability.Graphics.Drawing 608 609**参数:** 610 611| 参数名 | 类型 | 必填 | 说明 | 612| ------ | ------ | ---- | --------------------- | 613| ctrlX | number | 是 | 控制点相对于路径终点的x轴偏移量,正数往x轴正方向偏移,负数往x轴负方向偏移,该参数为浮点数。 | 614| ctrlY | number | 是 | 控制点相对于路径终点的y轴偏移量,正数往y轴正方向偏移,负数往y轴负方向偏移,该参数为浮点数。 | 615| endX | number | 是 | 目标点相对于路径终点的x轴偏移量,正数往x轴正方向偏移,负数往x轴负方向偏移,该参数为浮点数。 | 616| endY | number | 是 | 目标点相对于路径终点的y轴偏移量,正数往y轴正方向偏移,负数往y轴负方向偏移,该参数为浮点数。 | 617| weight | number | 是 | 表示曲线的权重,决定了曲线的形状,越大越接近控制点。若小于等于0则等同于使用[rLineTo](#rlineto12)添加一条到结束点的线段,若为1则等同于[rQuadTo](#rquadto12),该参数为浮点数。 | 618 619**错误码:** 620 621以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 622 623| 错误码ID | 错误信息 | 624| ------- | --------------------------------------------| 625| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 626 627**示例:** 628 629```ts 630import { drawing } from '@kit.ArkGraphics2D'; 631 632const path = new drawing.Path(); 633path.rConicTo(200, 400, 100, 200, 0); 634``` 635 636### rCubicTo<sup>12+</sup> 637 638rCubicTo(ctrlX1: number, ctrlY1: number, ctrlX2: number, ctrlY2: number, endX: number, endY: number): void 639 640使用相对位置在当前路径上添加一条当前路径终点(若路径没有内容则默认为 (0, 0))到目标点位置的三阶贝塞尔曲线。 641 642**系统能力**:SystemCapability.Graphics.Drawing 643 644**参数:** 645 646| 参数名 | 类型 | 必填 | 说明 | 647| ------ | ------ | ---- | --------------------------- | 648| ctrlX1 | number | 是 | 第一个控制点相对于路径终点的x轴偏移量,正数往x轴正方向偏移,负数往x轴负方向偏移,该参数为浮点数。 | 649| ctrlY1 | number | 是 | 第一个控制点相对于路径终点的y轴偏移量,正数往y轴正方向偏移,负数往y轴负方向偏移,该参数为浮点数。 | 650| ctrlX2 | number | 是 | 第二个控制点相对于路径终点的x轴偏移量,正数往x轴正方向偏移,负数往x轴负方向偏移,该参数为浮点数。 | 651| ctrlY2 | number | 是 | 第二个控制点相对于路径终点的y轴偏移量,正数往y轴正方向偏移,负数往y轴负方向偏移,该参数为浮点数。 | 652| endX | number | 是 | 目标点相对于路径终点的x轴偏移量,正数往x轴正方向偏移,负数往x轴负方向偏移,该参数为浮点数。 | 653| endY | number | 是 | 目标点相对于路径终点的y轴偏移量,正数往y轴正方向偏移,负数往y轴负方向偏移,该参数为浮点数。 | 654 655**错误码:** 656 657以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 658 659| 错误码ID | 错误信息 | 660| ------- | --------------------------------------------| 661| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 662 663**示例:** 664 665```ts 666import { drawing } from '@kit.ArkGraphics2D'; 667 668const path = new drawing.Path(); 669path.rCubicTo(200, 0, 0, 200, -20, 0); 670``` 671 672### addArc<sup>12+</sup> 673 674addArc(rect: common2D.Rect, startAngle: number, sweepAngle: number): void 675 676向路径添加一段圆弧。 677当startAngle和sweepAngle同时满足以下两种情况时,添加整个椭圆而不是圆弧: 6781.startAngle对90取余接近于0; 6792.sweepAngle不在(-360, 360)区间内。 680其余情况sweepAngle会对360取余后添加圆弧。 681 682**系统能力**:SystemCapability.Graphics.Drawing 683 684**参数:** 685 686| 参数名 | 类型 | 必填 | 说明 | 687| ----------- | ---------------------------------------- | ---- | ------------------- | 688| rect | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是 | 包含弧的椭圆的矩形边界。 | 689| startAngle | number | 是 | 弧的起始角度,单位为度,0度为x轴正方向,该参数为浮点数。 | 690| sweepAngle | number | 是 | 扫描角度,单位为度。正数表示顺时针方向,负数表示逆时针方向,该参数为浮点数。 | 691 692**错误码:** 693 694以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 695 696| 错误码ID | 错误信息 | 697| ------- | --------------------------------------------| 698| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 699 700**示例:** 701 702```ts 703import { common2D, drawing } from '@kit.ArkGraphics2D'; 704 705let path = new drawing.Path(); 706const rect: common2D.Rect = {left:100, top:100, right:500, bottom:500}; 707path.addArc(rect, 90, 180); 708``` 709 710### addCircle<sup>12+</sup> 711 712addCircle(x: number, y: number, radius: number, pathDirection?: PathDirection): void 713 714按指定方向,向路径添加圆形,圆的起点位于(x + radius, y)。 715 716**系统能力**:SystemCapability.Graphics.Drawing 717 718**参数:** 719 720| 参数名 | 类型 | 必填 | 说明 | 721| ----------- | ---------------------------------------- | ---- | ------------------- | 722| x | number | 是 | 表示圆心的x轴坐标,该参数为浮点数。 | 723| y | number | 是 | 表示圆心的y轴坐标,该参数为浮点数。 | 724| radius | number | 是 | 表示圆形的半径,该参数为浮点数,小于等于0时不会有任何效果。 | 725| pathDirection | [PathDirection](#pathdirection12) | 否 | 表示路径方向,默认为顺时针方向。 | 726 727**错误码:** 728 729以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 730 731| 错误码ID | 错误信息 | 732| ------- | --------------------------------------------| 733| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types; 3. Parameter verification failed. | 734 735**示例:** 736 737```ts 738 739import { drawing } from '@kit.ArkGraphics2D'; 740 741let path = new drawing.Path(); 742path.addCircle(100, 200, 50, drawing.PathDirection.CLOCKWISE); 743``` 744 745### addOval<sup>12+</sup> 746 747addOval(rect: common2D.Rect, start: number, pathDirection?: PathDirection): void 748 749按指定方向,将椭圆添加到路径中,其中矩形对象作为椭圆的外切矩形区域。 750 751**系统能力**:SystemCapability.Graphics.Drawing 752 753**参数:** 754 755| 参数名 | 类型 | 必填 | 说明 | 756| ----------- | ---------------------------------------- | ---- | ------------------- | 757| rect | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是 | 椭圆的矩形边界。 | 758| start | number | 是 | 表示椭圆初始点的索引,0,1,2,3分别对应椭圆的上端点,右端点,下端点,左端点,该参数为不小于0的整数,大于等于4时会对4取余。 | 759| pathDirection | [PathDirection](#pathdirection12) | 否 | 表示路径方向,默认为顺时针方向。 | 760 761**错误码:** 762 763以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 764 765| 错误码ID | 错误信息 | 766| ------- | --------------------------------------------| 767| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types; 3. Parameter verification failed.| 768 769**示例:** 770 771```ts 772import { common2D, drawing } from '@kit.ArkGraphics2D'; 773 774let path = new drawing.Path(); 775const rect: common2D.Rect = {left:100, top:100, right:500, bottom:500}; 776path.addOval(rect, 5, drawing.PathDirection.CLOCKWISE); 777``` 778 779### addRect<sup>12+</sup> 780 781addRect(rect: common2D.Rect, pathDirection?: PathDirection): void 782 783按指定方向,将矩形添加到路径中,添加的路径的起始点为矩形左上角。 784 785**系统能力**:SystemCapability.Graphics.Drawing 786 787**参数:** 788 789| 参数名 | 类型 | 必填 | 说明 | 790| ----------- | ---------------------------------------- | ---- | ------------------- | 791| rect | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是 | 向路径中添加的矩形轮廓。 | 792| pathDirection | [PathDirection](#pathdirection12) | 否 | 表示路径方向,默认为顺时针方向。 | 793 794**错误码:** 795 796以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 797 798| 错误码ID | 错误信息 | 799| ------- | --------------------------------------------| 800| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types; 3. Parameter verification failed.| 801 802**示例:** 803 804```ts 805import { common2D, drawing } from '@kit.ArkGraphics2D'; 806 807let path = new drawing.Path(); 808const rect: common2D.Rect = {left:100, top:100, right:500, bottom:500}; 809path.addRect(rect, drawing.PathDirection.CLOCKWISE); 810``` 811 812### addRoundRect<sup>12+</sup> 813 814addRoundRect(roundRect: RoundRect, pathDirection?: PathDirection): void 815 816按指定方向,向路径添加圆角矩形轮廓。路径添加方向为顺时针时,起始点位于圆角矩形左下方圆角与左边界的交点;路径添加方向为逆时针时,起始点位于圆角矩形左上方圆角与左边界的交点。 817 818**系统能力**:SystemCapability.Graphics.Drawing 819 820**参数:** 821 822| 参数名 | 类型 | 必填 | 说明 | 823| ----------- | ---------------------------------------- | ---- | ------------------- | 824| roundRect | [RoundRect](#roundrect12) | 是 | 圆角矩形对象。 | 825| pathDirection | [PathDirection](#pathdirection12) | 否 | 表示路径方向,默认为顺时针方向。 | 826 827**错误码:** 828 829以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 830 831| 错误码ID | 错误信息 | 832| ------- | --------------------------------------------| 833| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types; 3. Parameter verification failed.| 834 835**示例:** 836 837```ts 838import { common2D, drawing } from '@kit.ArkGraphics2D'; 839 840let path = new drawing.Path(); 841const rect: common2D.Rect = {left:100, top:100, right:500, bottom:500}; 842let roundRect = new drawing.RoundRect(rect, 50, 50); 843path.addRoundRect(roundRect, drawing.PathDirection.CLOCKWISE); 844``` 845 846### addPath<sup>12+</sup> 847 848addPath(path: Path, matrix?: Matrix | null): void 849 850将源路径进行矩阵变换后,添加到当前路径中。 851 852**系统能力**:SystemCapability.Graphics.Drawing 853 854**参数:** 855 856| 参数名 | 类型 | 必填 | 说明 | 857| ----------- | ---------------------------------------- | ---- | ------------------- | 858| path | [Path](#path) | 是 | 表示源路径对象。 | 859| matrix | [Matrix](#matrix12)\|null | 否 | 表示矩阵对象,默认为单位矩阵。 | 860 861**错误码:** 862 863以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 864 865| 错误码ID | 错误信息 | 866| ------- | --------------------------------------------| 867| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 868 869**示例:** 870 871```ts 872import { common2D, drawing } from '@kit.ArkGraphics2D'; 873 874let path = new drawing.Path(); 875let matrix = new drawing.Matrix(); 876const rect: common2D.Rect = {left:100, top:100, right:500, bottom:500}; 877let roundRect = new drawing.RoundRect(rect, 50, 50); 878path.addRoundRect(roundRect, drawing.PathDirection.CLOCKWISE); 879let dstPath = new drawing.Path(); 880dstPath.addPath(path, matrix); 881``` 882 883### transform<sup>12+</sup> 884 885transform(matrix: Matrix): void 886 887对路径进行矩阵变换。 888 889**系统能力**:SystemCapability.Graphics.Drawing 890 891**参数:** 892 893| 参数名 | 类型 | 必填 | 说明 | 894| ----------- | ---------------------------------------- | ---- | ------------------- | 895| matrix | [Matrix](#matrix12) | 是 | 表示矩阵对象。 | 896 897**错误码:** 898 899以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 900 901| 错误码ID | 错误信息 | 902| ------- | --------------------------------------------| 903| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 904 905**示例:** 906 907```ts 908import { common2D, drawing } from '@kit.ArkGraphics2D'; 909 910let path = new drawing.Path(); 911let matrix = new drawing.Matrix(); 912matrix.setScale(1.5, 1.5, 10, 10); 913const rect: common2D.Rect = {left:100, top:100, right:500, bottom:500}; 914let roundRect = new drawing.RoundRect(rect, 50, 50); 915path.addRoundRect(roundRect, drawing.PathDirection.CLOCKWISE); 916path.transform(matrix); 917``` 918 919### contains<sup>12+</sup> 920 921contains(x: number, y: number): boolean 922 923判断指定坐标点是否被路径包含,判定是否被路径包含的规则参考[PathFillType](#pathfilltype12)。 924 925**系统能力:** SystemCapability.Graphics.Drawing 926 927**参数:** 928 929| 参数名 | 类型 | 必填 | 说明 | 930| ------ | ------ | ---- | ----------------------- | 931| x | number | 是 | x轴上坐标点,该参数必须为浮点数。 | 932| y | number | 是 | y轴上坐标点,该参数必须为浮点数。 | 933 934**返回值:** 935 936| 类型 | 说明 | 937| ------- | -------------- | 938| boolean | 返回指定坐标点是否在路径内。true表示点在路径内,false表示点不在路径内。 | 939 940**错误码:** 941 942以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 943 944| 错误码ID | 错误信息 | 945| ------- | --------------------------------------------| 946| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 947 948**示例:** 949 950```ts 951import { common2D, drawing } from '@kit.ArkGraphics2D'; 952 953const path = new drawing.Path(); 954let rect : common2D.Rect = {left: 50, top: 50, right: 250, bottom: 250}; 955path.addRect(rect, drawing.PathDirection.CLOCKWISE); 956console.info("test contains: " + path.contains(0, 0)); 957console.info("test contains: " + path.contains(60, 60)); 958``` 959 960### setFillType<sup>12+</sup> 961 962setFillType(pathFillType: PathFillType): void 963 964设置路径的填充类型,这个决定了路径内部区域的定义方式。例如,使用 Winding 填充类型时,路径内部区域由路径环绕的次数决定,而使用 EvenOdd 填充类型时,路径内部区域由路径环绕的次数是否为奇数决定。 965 966**系统能力**:SystemCapability.Graphics.Drawing 967 968**参数:** 969 970| 参数名 | 类型 | 必填 | 说明 | 971| ----------- | ---------------------------------------- | ---- | ------------------- | 972| pathFillType | [PathFillType](#pathfilltype12) | 是 | 表示路径填充规则。 | 973 974**错误码:** 975 976以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 977 978| 错误码ID | 错误信息 | 979| ------- | --------------------------------------------| 980| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types; 3. Parameter verification failed.| 981 982**示例:** 983 984```ts 985import { drawing } from '@kit.ArkGraphics2D'; 986 987const path = new drawing.Path(); 988path.setFillType(drawing.PathFillType.WINDING); 989``` 990 991### getBounds<sup>12+</sup> 992 993getBounds(): common2D.Rect 994 995获取包含路径的最小矩形边界。 996 997**系统能力**:SystemCapability.Graphics.Drawing 998 999**返回值:** 1000 1001| 类型 | 说明 | 1002| -------------------------------------------------- | ---------------------- | 1003| [common2D.Rect](js-apis-graphics-common2D.md#rect) | 包含路径的最小矩形区域。 | 1004 1005**示例:** 1006 1007```ts 1008import { common2D, drawing } from '@kit.ArkGraphics2D'; 1009 1010const path = new drawing.Path(); 1011path.lineTo(50, 40) 1012let rect : common2D.Rect = {left: 0, top: 0, right: 0, bottom: 0}; 1013rect = path.getBounds(); 1014console.info("test rect.left: " + rect.left); 1015console.info("test rect.top: " + rect.top); 1016console.info("test rect.right: " + rect.right); 1017console.info("test rect.bottom: " + rect.bottom); 1018``` 1019 1020### addPolygon<sup>12+</sup> 1021 1022addPolygon(points: Array\<common2D.Point>, close: boolean): void 1023 1024通过坐标点列表添加多条连续的线段。 1025 1026**系统能力**:SystemCapability.Graphics.Drawing 1027 1028**参数:** 1029 1030| 参数名 | 类型 | 必填 | 说明 | 1031| ------ | ------ | ---- | ----------------------- | 1032| points | Array\<[common2D.Point](js-apis-graphics-common2D.md#point)> | 是 | 坐标点数组。 | 1033| close | boolean | 是 | 表示是否将路径闭合,即是否添加路径起始点到终点的连线。true表示将路径闭合,false表示不将路径闭合。 | 1034 1035**错误码:** 1036 1037以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 1038 1039| 错误码ID | 错误信息 | 1040| ------- | --------------------------------------------| 1041| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 1042 1043**示例:** 1044 1045```ts 1046import { common2D, drawing } from '@kit.ArkGraphics2D'; 1047 1048let pointsArray = new Array<common2D.Point>(); 1049const point1: common2D.Point = { x: 200, y: 200 }; 1050const point2: common2D.Point = { x: 400, y: 200 }; 1051const point3: common2D.Point = { x: 100, y: 400 }; 1052const point4: common2D.Point = { x: 300, y: 400 }; 1053pointsArray.push(point1); 1054pointsArray.push(point2); 1055pointsArray.push(point3); 1056pointsArray.push(point4); 1057const path = new drawing.Path(); 1058path.addPolygon(pointsArray, false); 1059``` 1060 1061### offset<sup>12+</sup> 1062 1063offset(dx: number, dy: number): Path 1064 1065将路径沿着x轴和y轴方向偏移一定距离并保存在返回的路径对象中。 1066 1067**系统能力**:SystemCapability.Graphics.Drawing 1068 1069**参数:** 1070 1071| 参数名 | 类型 | 必填 | 说明 | 1072| ------ | ------ | ---- | ----------------------- | 1073| dx | number | 是 | x轴方向偏移量,正数往x轴正方向偏移,负数往x轴负方向偏移,该参数为浮点数。 | 1074| dy | number | 是 | y轴方向偏移量,正数往y轴正方向偏移,负数往y轴负方向偏移,该参数为浮点数。 | 1075 1076**返回值:** 1077 1078| 类型 | 说明 | 1079| ------ | ------------------ | 1080| [Path](#path) | 返回当前路径偏移(dx,dy)后生成的新路径对象。 | 1081 1082**错误码:** 1083 1084以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 1085 1086| 错误码ID | 错误信息 | 1087| ------- | --------------------------------------------| 1088| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 1089 1090**示例:** 1091 1092```ts 1093import { drawing } from '@kit.ArkGraphics2D'; 1094 1095const path = new drawing.Path(); 1096path.moveTo(200, 200); 1097path.lineTo(300, 300); 1098const dst = path.offset(200, 200); 1099``` 1100 1101### op<sup>12+</sup> 1102 1103op(path: Path, pathOp: PathOp): boolean 1104 1105将当前路径置为和path按照指定的路径操作类型合并后的结果。 1106 1107**系统能力**:SystemCapability.Graphics.Drawing 1108 1109**参数:** 1110 1111| 参数名 | 类型 | 必填 | 说明 | 1112| ------ | ------ | ---- | ----------------------- | 1113| path | [Path](#path) | 是 | 路径对象,用于与当前路径合并。 | 1114| pathOp | [PathOp](#pathop12) | 是 | 路径操作类型枚举。 | 1115 1116**返回值:** 1117 1118| 类型 | 说明 | 1119| ------ | ------------------ | 1120| boolean | 返回路径合并是否成功的结果。true表示合并成功,false表示合并失败。 | 1121 1122**错误码:** 1123 1124以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 1125 1126| 错误码ID | 错误信息 | 1127| ------- | --------------------------------------------| 1128| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 1129 1130**示例:** 1131 1132```ts 1133import { drawing } from '@kit.ArkGraphics2D'; 1134 1135const path = new drawing.Path(); 1136const path2 = new drawing.Path(); 1137path.addCircle(100, 200, 100, drawing.PathDirection.CLOCKWISE); 1138console.info("get pathOp: ", path2.op(path, drawing.PathOp.DIFFERENCE)); 1139``` 1140 1141### close 1142 1143close(): void 1144 1145用于闭合路径,会添加一条从路径起点位置到最后点位置的线段。 1146 1147**系统能力**:SystemCapability.Graphics.Drawing 1148 1149**示例:** 1150 1151```ts 1152import { drawing } from '@kit.ArkGraphics2D'; 1153let path = new drawing.Path(); 1154path.moveTo(10,10); 1155path.cubicTo(10, 10, 10, 10, 15, 15); 1156path.close(); 1157``` 1158 1159### reset 1160 1161reset(): void 1162 1163用于重置自定义路径数据。 1164 1165**系统能力**:SystemCapability.Graphics.Drawing 1166 1167**示例:** 1168 1169```ts 1170import { drawing } from '@kit.ArkGraphics2D'; 1171let path = new drawing.Path(); 1172path.moveTo(10,10); 1173path.cubicTo(10, 10, 10, 10, 15, 15); 1174path.reset(); 1175``` 1176 1177### getLength<sup>12+</sup> 1178 1179getLength(forceClosed: boolean): number 1180 1181用于获取路径长度。 1182 1183**系统能力**:SystemCapability.Graphics.Drawing 1184 1185**参数:** 1186 1187| 参数名| 类型 | 必填| 说明 | 1188| ----- | ------ | ---- | --------- | 1189| forceClosed | boolean | 是 | 表示是否按照闭合路径测量,true表示测量时路径会被强制视为已闭合,false表示会根据路径的实际闭合状态测量。| 1190 1191**返回值:** 1192 1193| 类型 | 说明 | 1194| ------ | ---- | 1195| number | 路径长度。| 1196 1197**示例:** 1198 1199```ts 1200import { drawing } from '@kit.ArkGraphics2D' 1201let path = new drawing.Path(); 1202path.arcTo(20, 20, 180, 180, 180, 90); 1203let len = path.getLength(false); 1204console.info("path length = " + len); 1205``` 1206 1207### getPositionAndTangent<sup>12+</sup> 1208 1209getPositionAndTangent(forceClosed: boolean, distance: number, position: common2D.Point, tangent: common2D.Point): boolean 1210 1211获取距路径起始点指定距离的坐标点和切线值。 1212 1213**系统能力**:SystemCapability.Graphics.Drawing 1214 1215**参数:** 1216 1217| 参数名 | 类型 | 必填 | 说明 | 1218| -------- | -------------------------------------------- | ---- | ------------------------------- | 1219| forceClosed | boolean | 是 | 表示是否按照闭合路径测量,true表示测量时路径会被强制视为已闭合,false表示会根据路径的实际闭合状态测量。 | 1220| distance | number | 是 | 表示与路径起始点的距离,小于0时会被视作0,大于路径长度时会被视作路径长度。该参数为浮点数。 | 1221| position | [common2D.Point](js-apis-graphics-common2D.md#point) | 是 | 存储获取到的距离路径起始点distance处的点的坐标。 | 1222| tangent | [common2D.Point](js-apis-graphics-common2D.md#point) | 是 | 存储获取到的距离路径起始点distance处的点的的切线值,tangent.x表示该点切线的余弦值,tangent.y表示该点切线的正弦值。 | 1223 1224**返回值:** 1225 1226| 类型 | 说明 | 1227| --------------------- | -------------- | 1228| boolean |表示是否成功获取距离路径起始点distance处的点的坐标和正切值的结果。true表示获取成功,false表示获取失败,position和tangent不会被改变。 | 1229 1230**错误码:** 1231 1232以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 1233 1234| 错误码ID | 错误信息 | 1235| ------- | --------------------------------------------| 1236| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 1237 1238**示例:** 1239 1240```ts 1241import { common2D, drawing } from '@kit.ArkGraphics2D'; 1242let path: drawing.Path = new drawing.Path(); 1243path.moveTo(0, 0); 1244path.lineTo(0, 700); 1245path.lineTo(700, 0); 1246let position: common2D.Point = { x: 0.0, y: 0.0 }; 1247let tangent: common2D.Point = { x: 0.0, y: 0.0 }; 1248if (path.getPositionAndTangent(false, 0.1, position, tangent)) { 1249 console.info("getPositionAndTangent-----position: "+ position.x); 1250 console.info("getPositionAndTangent-----position: "+ position.y); 1251 console.info("getPositionAndTangent-----tangent: "+ tangent.x); 1252 console.info("getPositionAndTangent-----tangent: "+ tangent.y); 1253} 1254``` 1255 1256### getSegment<sup>18+</sup> 1257 1258getSegment(forceClosed: boolean, start: number, stop: number, startWithMoveTo: boolean, dst: Path): boolean 1259 1260截取路径的片段并追加到目标路径上。 1261 1262**系统能力**:SystemCapability.Graphics.Drawing 1263 1264**参数:** 1265 1266| 参数名 | 类型 | 必填 | 说明 | 1267| -------- | -------------------------------------------- | ---- | ------------------------------- | 1268| forceClosed | boolean | 是 | 表示是否按照闭合路径测量,true表示测量时路径会被强制视为已闭合,false表示会根据路径的实际闭合状态测量。 | 1269| start | number | 是 | 表示与路径起始点的距离,距离路径起始点start距离的位置即为截取路径片段的起始点,小于0时会被视作0,大于等于stop时会截取失败。该参数为浮点数。 | 1270| stop | number | 是 | 表示与路径起始点的距离,距离路径起始点stop距离的位置即为截取路径片段的终点,小于等于start时会截取失败,大于路径长度时会被视作路径长度。该参数为浮点数。 | 1271| startWithMoveTo | boolean | 是 | 表示是否在目标路径执行[moveTo](#moveto)移动到截取路径片段的起始点位置。true表示执行,false表示不执行。 | 1272| dst | [Path](#path) | 是 | 目标路径,截取成功时会将得到的路径片段追加到目标路径上,截取失败时不做改变。 | 1273 1274**返回值:** 1275 1276| 类型 | 说明 | 1277| --------------------- | -------------- | 1278| boolean |表示是否成功截取路径片段。true表示截取成功,false表示截取失败。 | 1279 1280**示例:** 1281 1282```ts 1283import { drawing } from '@kit.ArkGraphics2D'; 1284let path: drawing.Path = new drawing.Path(); 1285path.moveTo(0, 0); 1286path.lineTo(0, 700); 1287path.lineTo(700, 0); 1288let dstPath: drawing.Path = new drawing.Path(); 1289console.info("getSegment-----result: "+ path.getSegment(true, 10.0, 20.0, true, dstPath)); 1290``` 1291 1292### isClosed<sup>12+</sup> 1293 1294isClosed(): 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: drawing.Path = new drawing.Path(); 1311path.moveTo(0, 0); 1312path.lineTo(0, 700); 1313if (path.isClosed()) { 1314 console.info("path is closed."); 1315} else { 1316 console.info("path is not closed."); 1317} 1318``` 1319 1320### getMatrix<sup>12+</sup> 1321 1322getMatrix(forceClosed: boolean, distance: number, matrix: Matrix, flags: PathMeasureMatrixFlags): boolean 1323 1324获取距路径起始点指定距离的相应变换矩阵。 1325 1326**系统能力**:SystemCapability.Graphics.Drawing 1327 1328**参数:** 1329 1330| 参数名 | 类型 | 必填 | 说明 | 1331| -------- | -------------------------------------------- | ---- | ------------------------------- | 1332| forceClosed | boolean | 是 | 表示是否按照闭合路径测量,true表示测量时路径会被强制视为已闭合,false表示会根据路径的实际闭合状态测量。 | 1333| distance | number | 是 | 表示与路径起始点的距离,小于0时会被视作0,大于路径长度时会被视作路径长度。该参数为浮点数。 | 1334| matrix | [Matrix](#matrix12) | 是 | 矩阵对象,用于存储得到的矩阵。 | 1335| flags | [PathMeasureMatrixFlags](#pathmeasurematrixflags12) | 是 | 矩阵信息维度枚举。 | 1336 1337**返回值:** 1338 1339| 类型 | 说明 | 1340| --------------------- | -------------- | 1341| boolean | 返回获取变换矩阵是否成功的结果,true表示获取成功,false表示获取失败。 | 1342 1343**错误码:** 1344 1345以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 1346 1347| 错误码ID | 错误信息 | 1348| ------- | --------------------------------------------| 1349| 401 | Parameter error. Possible causes: Mandatory parameters are left unspecified. | 1350 1351**示例:** 1352 1353```ts 1354import { drawing } from '@kit.ArkGraphics2D'; 1355let path: drawing.Path = new drawing.Path(); 1356let matrix = new drawing.Matrix(); 1357if(path.getMatrix(false, 10, matrix, drawing.PathMeasureMatrixFlags.GET_TANGENT_MATRIX)) { 1358 console.info("path.getMatrix return true"); 1359} else { 1360 console.info("path.getMatrix return false"); 1361} 1362``` 1363 1364### buildFromSvgString<sup>12+</sup> 1365 1366buildFromSvgString(str: string): boolean 1367 1368解析SVG字符串表示的路径。 1369 1370**系统能力**:SystemCapability.Graphics.Drawing 1371 1372**参数:** 1373 1374| 参数名 | 类型 | 必填 | 说明 | 1375| -------- | -------------------------------------------- | ---- | ------------------------------- | 1376| str | string | 是 | SVG格式的字符串,用于描述绘制路径。 | 1377 1378**返回值:** 1379 1380| 类型 | 说明 | 1381| --------------------- | -------------- | 1382| boolean | 返回解析SVG字符串是否成功的结果,true表示解析成功,false表示解析失败。 | 1383 1384**错误码:** 1385 1386以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 1387 1388| 错误码ID | 错误信息 | 1389| ------- | --------------------------------------------| 1390| 401 | Parameter error. Possible causes: Mandatory parameters are left unspecified. | 1391 1392**示例:** 1393 1394```ts 1395import { drawing } from '@kit.ArkGraphics2D'; 1396let path: drawing.Path = new drawing.Path(); 1397let svgStr: string = "M150 100 L75 300 L225 300 Z"; 1398if(path.buildFromSvgString(svgStr)) { 1399 console.info("buildFromSvgString return true"); 1400} else { 1401 console.info("buildFromSvgString return false"); 1402} 1403``` 1404 1405### getPathIterator<sup>18+</sup> 1406 1407getPathIterator(): PathIterator 1408 1409返回该路径的操作迭代器。 1410 1411**系统能力:** SystemCapability.Graphics.Drawing 1412 1413**返回值:** 1414 1415| 类型 | 说明 | 1416| --------------------- | -------------- | 1417| [PathIterator](#pathiterator18) | 该路径的迭代器对象。 | 1418 1419**示例:** 1420 1421```ts 1422import { drawing } from '@kit.ArkGraphics2D'; 1423let path: drawing.Path = new drawing.Path(); 1424let iter = path.getPathIterator(); 1425``` 1426 1427## Canvas 1428 1429承载绘制内容与绘制状态的载体。 1430 1431> **说明:** 1432> 1433> 画布自带一个黑色,开启反走样,不具备其他任何样式效果的默认画刷,当且仅当画布中主动设置的画刷和画笔都不存在时生效。 1434 1435### constructor 1436 1437constructor(pixelmap: image.PixelMap) 1438 1439Canvas对象的构造函数。 1440 1441**系统能力**:SystemCapability.Graphics.Drawing 1442 1443**参数:** 1444 1445| 参数名 | 类型 | 必填 | 说明 | 1446| -------- | -------------------------------------------- | ---- | -------------- | 1447| pixelmap | [image.PixelMap](../apis-image-kit/js-apis-image.md#pixelmap7) | 是 | 构造函数入参。 | 1448 1449**错误码:** 1450 1451以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 1452 1453| 错误码ID | 错误信息 | 1454| ------- | --------------------------------------------| 1455| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 1456 1457**示例:** 1458 1459```ts 1460import { drawing } from '@kit.ArkGraphics2D'; 1461import { image } from '@kit.ImageKit'; 1462const color = new ArrayBuffer(96); 1463let opts : image.InitializationOptions = { 1464 editable: true, 1465 pixelFormat: 3, 1466 size: { 1467 height: 4, 1468 width: 6 1469 } 1470} 1471image.createPixelMap(color, opts).then((pixelMap) => { 1472 const canvas = new drawing.Canvas(pixelMap); 1473}) 1474``` 1475 1476### drawRect 1477 1478drawRect(rect: common2D.Rect): void 1479 1480用于绘制一个矩形,默认使用黑色填充。 1481 1482**系统能力**:SystemCapability.Graphics.Drawing 1483 1484**参数:** 1485 1486| 参数名 | 类型 | 必填 | 说明 | 1487| ------ | -------------------------------------------------- | ---- | -------------- | 1488| rect | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是 | 绘制的矩形区域。 | 1489 1490**错误码:** 1491 1492以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 1493 1494| 错误码ID | 错误信息 | 1495| ------- | --------------------------------------------| 1496| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 1497 1498**示例:** 1499 1500```ts 1501import { RenderNode } from '@kit.ArkUI'; 1502import { common2D, drawing } from '@kit.ArkGraphics2D'; 1503class DrawingRenderNode extends RenderNode { 1504 draw(context : DrawContext) { 1505 const canvas = context.canvas; 1506 const pen = new drawing.Pen(); 1507 pen.setStrokeWidth(5); 1508 pen.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 1509 canvas.attachPen(pen); 1510 canvas.drawRect({ left : 0, right : 10, top : 0, bottom : 10 }); 1511 canvas.detachPen(); 1512 } 1513} 1514``` 1515 1516### drawRect<sup>12+</sup> 1517 1518drawRect(left: number, top: number, right: number, bottom: number): void 1519 1520用于绘制一个矩形,默认使用黑色填充。性能优于[drawRect](#drawrect)接口,推荐使用本接口。 1521 1522**系统能力**:SystemCapability.Graphics.Drawing 1523 1524**参数:** 1525 1526| 参数名 | 类型 | 必填 | 说明 | 1527| ------ | ------ | ---- | -------------- | 1528| left | number | 是 | 矩形的左上角x轴坐标,该参数为浮点数。 | 1529| top | number | 是 | 矩形的左上角y轴坐标,该参数为浮点数。 | 1530| right | number | 是 | 矩形的右下角x轴坐标,该参数为浮点数。 | 1531| bottom | number | 是 | 矩形的右下角y轴坐标,该参数为浮点数。 | 1532 1533**错误码:** 1534 1535以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 1536 1537| 错误码ID | 错误信息 | 1538| ------- | --------------------------------------------| 1539| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 1540 1541**示例:** 1542 1543```ts 1544import { RenderNode } from '@kit.ArkUI'; 1545import { drawing } from '@kit.ArkGraphics2D'; 1546class DrawingRenderNode extends RenderNode { 1547 1548 draw(context : DrawContext) { 1549 const canvas = context.canvas; 1550 const pen = new drawing.Pen(); 1551 pen.setStrokeWidth(5); 1552 pen.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 1553 canvas.attachPen(pen); 1554 canvas.drawRect(0, 0, 10, 10); 1555 canvas.detachPen(); 1556 } 1557} 1558``` 1559 1560### drawRoundRect<sup>12+</sup> 1561 1562drawRoundRect(roundRect: RoundRect): void 1563 1564画一个圆角矩形。 1565 1566**系统能力**:SystemCapability.Graphics.Drawing 1567 1568**参数** 1569 1570| 参数名 | 类型 | 必填 | 说明 | 1571| ---------- | ----------------------- | ---- | ------------ | 1572| roundRect | [RoundRect](#roundrect12) | 是 | 圆角矩形对象。| 1573 1574**错误码:** 1575 1576以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 1577 1578| 错误码ID | 错误信息 | 1579| ------- | --------------------------------------------| 1580| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 1581 1582**示例** 1583 1584```ts 1585import { RenderNode } from '@kit.ArkUI'; 1586import { common2D, drawing } from '@kit.ArkGraphics2D'; 1587class DrawingRenderNode extends RenderNode { 1588 draw(context : DrawContext) { 1589 const canvas = context.canvas; 1590 let rect: common2D.Rect = { left : 100, top : 100, right : 400, bottom : 500 }; 1591 let roundRect = new drawing.RoundRect(rect, 10, 10); 1592 canvas.drawRoundRect(roundRect); 1593 } 1594} 1595``` 1596 1597### drawNestedRoundRect<sup>12+</sup> 1598 1599drawNestedRoundRect(outer: RoundRect, inner: RoundRect): void 1600 1601绘制两个嵌套的圆角矩形,外部矩形边界必须包含内部矩形边界,否则无绘制效果。 1602 1603**系统能力**:SystemCapability.Graphics.Drawing 1604 1605**参数** 1606 1607| 参数名 | 类型 | 必填 | 说明 | 1608| ------ | ----------------------- | ---- | ------------ | 1609| outer | [RoundRect](#roundrect12) | 是 | 圆角矩形对象,表示外部圆角矩形边界。| 1610| inner | [RoundRect](#roundrect12) | 是 | 圆角矩形对象,表示内部圆角矩形边界。| 1611 1612**错误码:** 1613 1614以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 1615 1616| 错误码ID | 错误信息 | 1617| ------- | --------------------------------------------| 1618| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 1619 1620**示例** 1621 1622```ts 1623import { RenderNode } from '@kit.ArkUI'; 1624import { common2D, drawing } from '@kit.ArkGraphics2D'; 1625class DrawingRenderNode extends RenderNode { 1626 draw(context : DrawContext) { 1627 const canvas = context.canvas; 1628 let inRect: common2D.Rect = { left : 200, top : 200, right : 400, bottom : 500 }; 1629 let outRect: common2D.Rect = { left : 100, top : 100, right : 400, bottom : 500 }; 1630 let outRoundRect = new drawing.RoundRect(outRect, 10, 10); 1631 let inRoundRect = new drawing.RoundRect(inRect, 10, 10); 1632 canvas.drawNestedRoundRect(outRoundRect, inRoundRect); 1633 canvas.drawRoundRect(outRoundRect); 1634 } 1635} 1636``` 1637 1638### drawBackground<sup>12+</sup> 1639 1640drawBackground(brush: Brush): void 1641 1642使用画刷填充画布的可绘制区域。 1643 1644**系统能力**:SystemCapability.Graphics.Drawing 1645 1646**参数** 1647 1648| 参数名 | 类型 | 必填 | 说明 | 1649| ------ | --------------- | ---- | ---------- | 1650| brush | [Brush](#brush) | 是 | 画刷对象。 | 1651 1652**错误码:** 1653 1654以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 1655 1656| 错误码ID | 错误信息 | 1657| ------- | --------------------------------------------| 1658| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 1659 1660**示例** 1661 1662```ts 1663import { RenderNode } from '@kit.ArkUI'; 1664import { common2D, drawing } from '@kit.ArkGraphics2D'; 1665class DrawingRenderNode extends RenderNode { 1666 draw(context : DrawContext) { 1667 const canvas = context.canvas; 1668 const brush = new drawing.Brush(); 1669 const color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 }; 1670 brush.setColor(color); 1671 canvas.drawBackground(brush); 1672 } 1673} 1674``` 1675 1676### drawShadow<sup>12+</sup> 1677 1678drawShadow(path: Path, planeParams: common2D.Point3d, devLightPos: common2D.Point3d, lightRadius: number, ambientColor: common2D.Color, spotColor: common2D.Color, flag: ShadowFlag) : void 1679 1680绘制射灯类型阴影,使用路径描述环境光阴影的轮廓。 1681 1682**系统能力**:SystemCapability.Graphics.Drawing 1683 1684**参数:** 1685 1686| 参数名 | 类型 | 必填 | 说明 | 1687| ------------ | ---------------------------------------- | ---- | ---------- | 1688| path | [Path](#path) | 是 | 路径对象,可生成阴影。 | 1689| planeParams | [common2D.Point3d](js-apis-graphics-common2D.md#point3d12) | 是 | 表示一个三维向量,用于计算遮挡物相对于画布在z轴上的偏移量,其值取决于x与y坐标。 | 1690| devLightPos | [common2D.Point3d](js-apis-graphics-common2D.md#point3d12) | 是 | 光线相对于画布的位置。 | 1691| lightRadius | number | 是 | 圆形灯半径,该参数为浮点数。 | 1692| ambientColor | [common2D.Color](js-apis-graphics-common2D.md#color) | 是 | 环境阴影颜色。 | 1693| spotColor | [common2D.Color](js-apis-graphics-common2D.md#color) | 是 | 点阴影颜色。 | 1694| flag | [ShadowFlag](#shadowflag12) | 是 | 阴影标志枚举。 | 1695 1696**错误码:** 1697 1698以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 1699 1700| 错误码ID | 错误信息 | 1701| ------- | --------------------------------------------| 1702| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 1703 1704**示例:** 1705 1706```ts 1707import { RenderNode } from '@kit.ArkUI'; 1708import { common2D, drawing } from '@kit.ArkGraphics2D'; 1709class DrawingRenderNode extends RenderNode { 1710 draw(context : DrawContext) { 1711 const canvas = context.canvas; 1712 const path = new drawing.Path(); 1713 path.addCircle(100, 200, 100, drawing.PathDirection.CLOCKWISE); 1714 let pen = new drawing.Pen(); 1715 pen.setAntiAlias(true); 1716 let pen_color : common2D.Color = { alpha: 0xFF, red: 0xFF, green: 0x00, blue: 0x00 }; 1717 pen.setColor(pen_color); 1718 pen.setStrokeWidth(10.0); 1719 canvas.attachPen(pen); 1720 let brush = new drawing.Brush(); 1721 let brush_color : common2D.Color = { alpha: 0xFF, red: 0x00, green: 0xFF, blue: 0x00 }; 1722 brush.setColor(brush_color); 1723 canvas.attachBrush(brush); 1724 let point1 : common2D.Point3d = {x: 100, y: 80, z:80}; 1725 let point2 : common2D.Point3d = {x: 200, y: 10, z:40}; 1726 let color1 : common2D.Color = {alpha: 0xFF, red:0, green:0, blue:0xFF}; 1727 let color2 : common2D.Color = {alpha: 0xFF, red:0xFF, green:0, blue:0}; 1728 let shadowFlag : drawing.ShadowFlag = drawing.ShadowFlag.ALL; 1729 canvas.drawShadow(path, point1, point2, 30, color1, color2, shadowFlag); 1730 } 1731} 1732``` 1733 1734### drawShadow<sup>18+</sup> 1735 1736drawShadow(path: Path, planeParams: common2D.Point3d, devLightPos: common2D.Point3d, lightRadius: number, ambientColor: common2D.Color | number, spotColor: common2D.Color | number, flag: ShadowFlag) : void 1737 1738绘制射灯类型阴影,使用路径描述环境光阴影的轮廓。 1739 1740**系统能力**:SystemCapability.Graphics.Drawing 1741 1742**参数:** 1743 1744| 参数名 | 类型 | 必填 | 说明 | 1745| ------------ | ---------------------------------------- | ---- | ---------- | 1746| path | [Path](#path) | 是 | 路径对象,可生成阴影。 | 1747| planeParams | [common2D.Point3d](js-apis-graphics-common2D.md#point3d12) | 是 | 表示一个三维向量,用于计算z轴方向的偏移量。 | 1748| devLightPos | [common2D.Point3d](js-apis-graphics-common2D.md#point3d12) | 是 | 光线相对于画布的位置。 | 1749| lightRadius | number | 是 | 圆形灯半径,该参数为浮点数。 | 1750| ambientColor |[common2D.Color](js-apis-graphics-common2D.md#color) \| number | 是 | 环境阴影颜色,可以用16进制ARGB格式的32位无符号整数表示。 | 1751| spotColor |[common2D.Color](js-apis-graphics-common2D.md#color) \| number | 是 | 点阴影颜色,可以用16进制ARGB格式的32位无符号整数表示。 | 1752| flag | [ShadowFlag](#shadowflag12) | 是 | 阴影标志枚举。 | 1753 1754**错误码:** 1755 1756以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 1757 1758| 错误码ID | 错误信息 | 1759| ------- | --------------------------------------------| 1760| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 1761 1762**示例:** 1763 1764```ts 1765import { RenderNode } from '@kit.ArkUI'; 1766import { common2D, drawing } from '@kit.ArkGraphics2D'; 1767class DrawingRenderNode extends RenderNode { 1768 draw(context : DrawContext) { 1769 const canvas = context.canvas; 1770 const path = new drawing.Path(); 1771 path.addCircle(300, 600, 100, drawing.PathDirection.CLOCKWISE); 1772 let point1 : common2D.Point3d = {x: 100, y: 80, z:80}; 1773 let point2 : common2D.Point3d = {x: 200, y: 10, z:40}; 1774 let shadowFlag : drawing.ShadowFlag = drawing.ShadowFlag.ALL; 1775 canvas.drawShadow(path, point1, point2, 30, 0xFF0000FF, 0xFFFF0000, shadowFlag); 1776 } 1777} 1778``` 1779 1780### getLocalClipBounds<sup>12+</sup> 1781 1782getLocalClipBounds(): common2D.Rect 1783 1784获取画布裁剪区域的边界。 1785 1786**系统能力**:SystemCapability.Graphics.Drawing 1787 1788**返回值:** 1789 1790| 类型 | 说明 | 1791| ---------------------------------------- | -------- | 1792| [common2D.Rect](js-apis-graphics-common2D.md#rect) | 返回画布裁剪区域的矩形边界。 | 1793 1794**示例:** 1795 1796```ts 1797import { RenderNode } from '@kit.ArkUI'; 1798import { common2D, drawing } from '@kit.ArkGraphics2D'; 1799class DrawingRenderNode extends RenderNode { 1800 draw(context : DrawContext) { 1801 const canvas = context.canvas; 1802 let clipRect: common2D.Rect = { 1803 left : 150, top : 150, right : 300, bottom : 400 1804 }; 1805 canvas.clipRect(clipRect,drawing.ClipOp.DIFFERENCE, true); 1806 console.info("test rect.left: " + clipRect.left); 1807 console.info("test rect.top: " + clipRect.top); 1808 console.info("test rect.right: " + clipRect.right); 1809 console.info("test rect.bottom: " + clipRect.bottom); 1810 canvas.getLocalClipBounds(); 1811 } 1812} 1813``` 1814 1815### getTotalMatrix<sup>12+</sup> 1816 1817getTotalMatrix(): Matrix 1818 1819获取画布矩阵。 1820 1821**系统能力**:SystemCapability.Graphics.Drawing 1822 1823**返回值:** 1824 1825| 类型 | 说明 | 1826| ----------------- | -------- | 1827| [Matrix](#matrix12) |返回画布矩阵。 | 1828 1829**示例:** 1830 1831```ts 1832import { RenderNode } from '@kit.ArkUI'; 1833import { drawing } from '@kit.ArkGraphics2D'; 1834class DrawingRenderNode extends RenderNode { 1835 draw(context : DrawContext) { 1836 const canvas = context.canvas; 1837 let matrix = new drawing.Matrix(); 1838 matrix.setMatrix([5, 0, 0, 0, 1, 1, 0, 0, 1]); 1839 canvas.setMatrix(matrix); 1840 let matrixResult =canvas.getTotalMatrix(); 1841 } 1842} 1843``` 1844 1845### drawCircle 1846 1847drawCircle(x: number, y: number, radius: number): void 1848 1849用于画一个圆形。如果半径小于等于零,则不绘制任何内容。默认使用黑色填充。 1850 1851**系统能力**:SystemCapability.Graphics.Drawing 1852 1853**参数:** 1854 1855| 参数名 | 类型 | 必填 | 说明 | 1856| ------ | ------ | ---- | ------------------- | 1857| x | number | 是 | 圆心的x坐标,该参数为浮点数。 | 1858| y | number | 是 | 圆心的y坐标,该参数为浮点数。 | 1859| radius | number | 是 | 圆的半径,大于0的浮点数。 | 1860 1861**错误码:** 1862 1863以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 1864 1865| 错误码ID | 错误信息 | 1866| ------- | --------------------------------------------| 1867| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 1868 1869**示例:** 1870 1871```ts 1872import { RenderNode } from '@kit.ArkUI'; 1873import { drawing } from '@kit.ArkGraphics2D'; 1874class DrawingRenderNode extends RenderNode { 1875 draw(context : DrawContext) { 1876 const canvas = context.canvas; 1877 const pen = new drawing.Pen(); 1878 pen.setStrokeWidth(5); 1879 pen.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 1880 canvas.attachPen(pen); 1881 canvas.drawCircle(10, 10, 2); 1882 canvas.detachPen(); 1883 } 1884} 1885``` 1886 1887### drawImage 1888 1889drawImage(pixelmap: image.PixelMap, left: number, top: number, samplingOptions?: SamplingOptions): void 1890 1891用于画一张图片,图片的左上角坐标为(left, top)。 1892 1893**系统能力**:SystemCapability.Graphics.Drawing 1894 1895**参数:** 1896 1897| 参数名 | 类型 | 必填 | 说明 | 1898| -------- | -------------------------------------------- | ---- | ------------------------------- | 1899| pixelmap | [image.PixelMap](../apis-image-kit/js-apis-image.md#pixelmap7) | 是 | 图片的PixelMap。 | 1900| left | number | 是 | 图片位置的左上角x轴坐标,该参数为浮点数。 | 1901| top | number | 是 | 图片位置的左上角y轴坐标,该参数为浮点数。 | 1902| samplingOptions<sup>12+</sup> | [SamplingOptions](#samplingoptions12) | 否 | 采样选项对象,默认为不使用任何参数构造的原始采样选项对象。 | 1903 1904**错误码:** 1905 1906以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 1907 1908| 错误码ID | 错误信息 | 1909| ------- | --------------------------------------------| 1910| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 1911 1912**示例:** 1913 1914```ts 1915import { RenderNode } from '@kit.ArkUI'; 1916import { image } from '@kit.ImageKit'; 1917import { drawing } from '@kit.ArkGraphics2D'; 1918class DrawingRenderNode extends RenderNode { 1919 pixelMap: image.PixelMap | null = null; 1920 1921 async draw(context : DrawContext) { 1922 const canvas = context.canvas; 1923 let options = new drawing.SamplingOptions(drawing.FilterMode.FILTER_MODE_NEAREST); 1924 if (this.pixelMap != null) { 1925 canvas.drawImage(this.pixelMap, 0, 0, options); 1926 } 1927 } 1928} 1929``` 1930 1931### drawImageRect<sup>12+</sup> 1932 1933drawImageRect(pixelmap: image.PixelMap, dstRect: common2D.Rect, samplingOptions?: SamplingOptions): void 1934 1935将图片绘制到画布的指定区域上。 1936 1937**系统能力**:SystemCapability.Graphics.Drawing 1938 1939**参数:** 1940 1941| 参数名 | 类型 | 必填 | 说明 | 1942| -------- | -------------------------------------------- | ---- | ------------------------------- | 1943| pixelmap | [image.PixelMap](../apis-image-kit/js-apis-image.md#pixelmap7) | 是 | 图片的PixelMap。 | 1944| dstRect | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是 | 矩形对象,用于指定画布上图片的绘制区域。 | 1945| samplingOptions | [SamplingOptions](#samplingoptions12) | 否 | 采样选项对象,默认为不使用任何参数构造的原始采样选项对象。 | 1946 1947**错误码:** 1948 1949以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 1950 1951| 错误码ID | 错误信息 | 1952| ------- | --------------------------------------------| 1953| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 1954 1955**示例:** 1956 1957```ts 1958import { RenderNode } from '@kit.ArkUI'; 1959import { image } from '@kit.ImageKit'; 1960import { common2D, drawing } from '@kit.ArkGraphics2D'; 1961class DrawingRenderNode extends RenderNode { 1962pixelMap: image.PixelMap | null = null; 1963 draw(context : DrawContext) { 1964 const canvas = context.canvas; 1965 let pen = new drawing.Pen(); 1966 canvas.attachPen(pen); 1967 let rect: common2D.Rect = { left: 0, top: 0, right: 200, bottom: 200 }; 1968 canvas.drawImageRect(this.pixelMap, rect); 1969 canvas.detachPen(); 1970 } 1971} 1972``` 1973 1974### drawImageRectWithSrc<sup>12+</sup> 1975 1976drawImageRectWithSrc(pixelmap: image.PixelMap, srcRect: common2D.Rect, dstRect: common2D.Rect, samplingOptions?: SamplingOptions, constraint?: SrcRectConstraint): void 1977 1978将图片的指定区域绘制到画布的指定区域。 1979 1980**系统能力**:SystemCapability.Graphics.Drawing 1981 1982**参数:** 1983 1984| 参数名 | 类型 | 必填 | 说明 | 1985| -------- | -------------------------------------------- | ---- | ------------------------------- | 1986| pixelmap | [image.PixelMap](../apis-image-kit/js-apis-image.md#pixelmap7) | 是 | 图片的PixelMap。 | 1987| srcRect | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是 | 矩形对象,用于指定图片的待绘制区域。 | 1988| dstRect | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是 | 矩形对象,用于指定画布上图片的绘制区域。 | 1989| samplingOptions | [SamplingOptions](#samplingoptions12) | 否 | 采样选项对象,默认为不使用任何参数构造的原始采样选项对象。 | 1990| constraint | [SrcRectConstraint](#srcrectconstraint12) | 否 | 源矩形区域约束类型,默认为STRICT。 | 1991 1992**错误码:** 1993 1994以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 1995 1996| 错误码ID | 错误信息 | 1997| ------- | --------------------------------------------| 1998| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 1999 2000**示例:** 2001 2002```ts 2003import { RenderNode } from '@kit.ArkUI'; 2004import { image } from '@kit.ImageKit'; 2005import { common2D, drawing } from '@kit.ArkGraphics2D'; 2006class DrawingRenderNode extends RenderNode { 2007pixelMap: image.PixelMap | null = null; 2008 draw(context : DrawContext) { 2009 const canvas = context.canvas; 2010 let pen = new drawing.Pen(); 2011 canvas.attachPen(pen); 2012 let srcRect: common2D.Rect = { left: 0, top: 0, right: 100, bottom: 100 }; 2013 let dstRect: common2D.Rect = { left: 100, top: 100, right: 200, bottom: 200 }; 2014 canvas.drawImageRectWithSrc(this.pixelMap, srcRect, dstRect); 2015 canvas.detachPen(); 2016 } 2017} 2018``` 2019 2020### drawColor 2021 2022drawColor(color: common2D.Color, blendMode?: BlendMode): void 2023 2024绘制背景颜色。 2025 2026**系统能力**:SystemCapability.Graphics.Drawing 2027 2028**参数:** 2029 2030| 参数名 | 类型 | 必填 | 说明 | 2031| --------- | ---------------------------------------------------- | ---- | -------------------------------- | 2032| color | [common2D.Color](js-apis-graphics-common2D.md#color) | 是 | ARGB格式的颜色,每个颜色通道是0到255之间的整数。 | 2033| blendMode | [BlendMode](#blendmode) | 否 | 颜色混合模式,默认模式为SRC_OVER。 | 2034 2035**错误码:** 2036 2037以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 2038 2039| 错误码ID | 错误信息 | 2040| ------- | --------------------------------------------| 2041| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 2042 2043**示例:** 2044 2045```ts 2046import { RenderNode } from '@kit.ArkUI'; 2047import { common2D, drawing } from '@kit.ArkGraphics2D'; 2048class DrawingRenderNode extends RenderNode { 2049 draw(context : DrawContext) { 2050 const canvas = context.canvas; 2051 let color: common2D.Color = { 2052 alpha : 255, 2053 red: 0, 2054 green: 10, 2055 blue: 10 2056 } 2057 canvas.drawColor(color, drawing.BlendMode.CLEAR); 2058 } 2059} 2060``` 2061 2062### drawColor<sup>12+</sup> 2063 2064drawColor(alpha: number, red: number, green: number, blue: number, blendMode?: BlendMode): void 2065 2066绘制背景颜色。性能优于[drawColor](#drawcolor)接口,推荐使用本接口。 2067 2068**系统能力**:SystemCapability.Graphics.Drawing 2069 2070**参数:** 2071 2072| 参数名 | 类型 | 必填 | 说明 | 2073| --------- | ----------------------- | ---- | ------------------------------------------------- | 2074| alpha | number | 是 | ARGB格式颜色的透明度通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。 | 2075| red | number | 是 | ARGB格式颜色的红色通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。 | 2076| green | number | 是 | ARGB格式颜色的绿色通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。 | 2077| blue | number | 是 | ARGB格式颜色的蓝色通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。 | 2078| blendMode | [BlendMode](#blendmode) | 否 | 颜色混合模式,默认模式为SRC_OVER。 | 2079 2080**错误码:** 2081 2082以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 2083 2084| 错误码ID | 错误信息 | 2085| ------- | --------------------------------------------| 2086| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 2087 2088**示例:** 2089 2090```ts 2091import { RenderNode } from '@kit.ArkUI'; 2092import { drawing } from '@kit.ArkGraphics2D'; 2093class DrawingRenderNode extends RenderNode { 2094 draw(context : DrawContext) { 2095 const canvas = context.canvas; 2096 canvas.drawColor(255, 0, 10, 10, drawing.BlendMode.CLEAR); 2097 } 2098} 2099``` 2100 2101### drawColor<sup>18+</sup> 2102 2103drawColor(color: number, blendMode?: BlendMode): void 2104 2105绘制背景颜色。 2106 2107**系统能力**:SystemCapability.Graphics.Drawing 2108 2109**参数:** 2110 2111| 参数名 | 类型 | 必填 | 说明 | 2112| --------- | ---------------------------------------------------- | ---- | -------------------------------- | 2113| color | number | 是 | 16进制ARGB格式的颜色。 | 2114| blendMode | [BlendMode](#blendmode) | 否 | 颜色混合模式,默认模式为SRC_OVER。 | 2115 2116**错误码:** 2117 2118以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 2119 2120| 错误码ID | 错误信息 | 2121| ------- | --------------------------------------------| 2122| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 2123 2124**示例:** 2125 2126```ts 2127import { RenderNode } from '@kit.ArkUI'; 2128import { drawing } from '@kit.ArkGraphics2D'; 2129class DrawingRenderNode extends RenderNode { 2130 draw(context : DrawContext) { 2131 const canvas = context.canvas; 2132 canvas.drawColor(0xff000a0a, drawing.BlendMode.CLEAR); 2133 } 2134} 2135``` 2136 2137### drawPixelMapMesh<sup>12+</sup> 2138 2139drawPixelMapMesh(pixelmap: image.PixelMap, meshWidth: number, meshHeight: number, vertices: Array\<number>, vertOffset: number, colors: Array\<number>, colorOffset: number): void 2140 2141在网格上绘制像素图,网格均匀分布在像素图上。 2142 2143**系统能力**:SystemCapability.Graphics.Drawing 2144 2145**参数:** 2146 2147| 参数名 | 类型 | 必填 | 说明 | 2148| ----------- | ------------- | ---- | ------------------------------- | 2149| pixelmap | [image.PixelMap](../apis-image-kit/js-apis-image.md#pixelmap7) | 是 | 用于绘制网格的像素图。 | 2150| meshWidth | number | 是 | 网格中的列数,大于0的整数。 | 2151| meshHeight | number | 是 | 网格中的行数,大于0的整数。 | 2152| vertices | Array\<number> | 是 | 顶点数组,指定网格的绘制位置,浮点数组,大小必须为((meshWidth+1) * (meshHeight+1) + vertOffset) * 2。 | 2153| vertOffset | number | 是 | 绘图前要跳过的vert元素数,大于等于0的整数。 | 2154| colors | Array\<number> | 是 | 颜色数组,在每个顶点指定一种颜色,整数数组,可为null,大小必须为(meshWidth+1) * (meshHeight+1) + colorOffset。 | 2155| colorOffset | number | 是 | 绘制前要跳过的颜色元素数,大于等于0的整数。 | 2156 2157**错误码:** 2158 2159以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 2160 2161| 错误码ID | 错误信息 | 2162| ------- | --------------------------------------------| 2163| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 2164 2165**示例:** 2166 2167```ts 2168import { RenderNode } from '@kit.ArkUI'; 2169import { image } from '@kit.ImageKit'; 2170import { drawing } from '@kit.ArkGraphics2D'; 2171class DrawingRenderNode extends RenderNode { 2172 pixelMap: image.PixelMap | null = null; 2173 2174 async draw(context : DrawContext) { 2175 const canvas = context.canvas; 2176 if (this.pixelMap != null) { 2177 const brush = new drawing.Brush(); // 只支持brush,使用pen没有绘制效果。 2178 canvas.attachBrush(brush); 2179 let verts : Array<number> = [0, 0, 50, 0, 410, 0, 0, 180, 50, 180, 410, 180, 0, 360, 50, 360, 410, 360]; // 18 2180 canvas.drawPixelMapMesh(this.pixelMap, 2, 2, verts, 0, null, 0); 2181 canvas.detachBrush(); 2182 } 2183 } 2184} 2185``` 2186 2187### clear<sup>12+</sup> 2188 2189clear(color: common2D.Color): void 2190 2191使用指定颜色填充画布上的裁剪区域。 2192 2193**系统能力**:SystemCapability.Graphics.Drawing 2194 2195**参数:** 2196 2197| 参数名 | 类型 | 必填 | 说明 | 2198| --------- | ---------------------------------------------------- | ---- | -------------------------------- | 2199| color | [common2D.Color](js-apis-graphics-common2D.md#color) | 是 | ARGB格式的颜色,每个颜色通道是0到255之间的整数。 | 2200 2201**错误码:** 2202 2203以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 2204 2205| 错误码ID | 错误信息 | 2206| ------- | --------------------------------------------| 2207| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 2208 2209**示例:** 2210 2211```ts 2212import { RenderNode } from '@kit.ArkUI'; 2213import { common2D, drawing } from '@kit.ArkGraphics2D'; 2214class DrawingRenderNode extends RenderNode { 2215 draw(context : DrawContext) { 2216 const canvas = context.canvas; 2217 let color: common2D.Color = {alpha: 255, red: 255, green: 0, blue: 0}; 2218 canvas.clear(color); 2219 } 2220} 2221``` 2222 2223### clear<sup>18+</sup> 2224 2225clear(color: common2D.Color | number): void 2226 2227使用指定颜色填充画布上的裁剪区域。 2228 2229**系统能力**:SystemCapability.Graphics.Drawing 2230 2231**参数:** 2232 2233| 参数名 | 类型 | 必填 | 说明 | 2234| --------- | ---------------------------------------------------- | ---- | -------------------------------- | 2235| color | [common2D.Color](js-apis-graphics-common2D.md#color) \| number| 是 | 颜色,可以用16进制ARGB格式的无符号整数表示。 | 2236 2237**示例:** 2238 2239```ts 2240import { RenderNode } from '@kit.ArkUI'; 2241import { drawing } from '@kit.ArkGraphics2D'; 2242class DrawingRenderNode extends RenderNode { 2243 draw(context : DrawContext) { 2244 const canvas = context.canvas; 2245 let color: number = 0xffff0000; 2246 canvas.clear(color); 2247 } 2248} 2249``` 2250 2251### getWidth<sup>12+</sup> 2252 2253getWidth(): number 2254 2255获取画布的宽度。 2256 2257**系统能力**:SystemCapability.Graphics.Drawing 2258 2259**返回值:** 2260 2261| 类型 | 必填 | 说明 | 2262| ------ | ---- | -------------- | 2263| number | 是 | 返回画布的宽度,该参数为浮点数。 | 2264 2265**示例:** 2266 2267```ts 2268import { RenderNode } from '@kit.ArkUI'; 2269import { drawing } from '@kit.ArkGraphics2D'; 2270class DrawingRenderNode extends RenderNode { 2271 draw(context : DrawContext) { 2272 const canvas = context.canvas; 2273 let width = canvas.getWidth(); 2274 console.info('get canvas width:' + width); 2275 } 2276} 2277``` 2278 2279### getHeight<sup>12+</sup> 2280 2281getHeight(): number 2282 2283获取画布的高度。 2284 2285**系统能力**:SystemCapability.Graphics.Drawing 2286 2287**返回值:** 2288 2289| 类型 | 必填 | 说明 | 2290| ------ | ---- | -------------- | 2291| number | 是 | 返回画布的高度,该参数为浮点数。 | 2292 2293**示例:** 2294 2295```ts 2296import { RenderNode } from '@kit.ArkUI'; 2297import { drawing } from '@kit.ArkGraphics2D'; 2298class DrawingRenderNode extends RenderNode { 2299 draw(context : DrawContext) { 2300 const canvas = context.canvas; 2301 let height = canvas.getHeight(); 2302 console.log('get canvas height:' + height); 2303 } 2304} 2305``` 2306 2307### drawOval<sup>12+</sup> 2308 2309drawOval(oval: common2D.Rect): void 2310 2311在画布上绘制一个椭圆,椭圆的形状和位置由定义椭圆边界的矩形参数定义。 2312 2313**系统能力**:SystemCapability.Graphics.Drawing 2314 2315**参数** 2316 2317| 参数名 | 类型 | 必填 | 说明 | 2318| ------ | -------------------------------------------------- | ---- | -------------- | 2319| oval | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是 | 矩形区域,该矩形的内切椭圆即为待绘制椭圆。 | 2320 2321**错误码:** 2322 2323以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 2324 2325| 错误码ID | 错误信息 | 2326| ------- | --------------------------------------------| 2327| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 2328 2329**示例** 2330 2331```ts 2332import { RenderNode } from '@kit.ArkUI'; 2333import { common2D, drawing } from '@kit.ArkGraphics2D'; 2334class DrawingRenderNode extends RenderNode { 2335 draw(context : DrawContext) { 2336 const canvas = context.canvas; 2337 const pen = new drawing.Pen(); 2338 pen.setStrokeWidth(5); 2339 const color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 }; 2340 pen.setColor(color); 2341 canvas.attachPen(pen); 2342 const rect: common2D.Rect = {left:100, top:50, right:400, bottom:500}; 2343 canvas.drawOval(rect); 2344 canvas.detachPen(); 2345 } 2346} 2347``` 2348 2349### drawArc<sup>12+</sup> 2350 2351drawArc(arc: common2D.Rect, startAngle: number, sweepAngle: number): void 2352 2353在画布上绘制一段圆弧。该方法允许指定圆弧的起始角度、扫描角度。当扫描角度的绝对值大于360度时,该方法绘制的是一个椭圆。 2354 2355**系统能力**:SystemCapability.Graphics.Drawing 2356 2357**参数** 2358 2359| 参数名 | 类型 | 必填 | 说明 | 2360| ------ | -------------------------------------------------- | ---- | -------------- | 2361| arc | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是 | 包含要绘制的圆弧的椭圆的矩形边界。 | 2362| startAngle | number | 是 | 弧的起始角度,单位为度,该参数为浮点数。0度时起始点位于椭圆的右端点,正数时以顺时针方向放置起始点,负数时以逆时针方向放置起始点。 | 2363| sweepAngle | number | 是 | 弧的扫描角度,单位为度,该参数为浮点数。为正数时顺时针扫描,为负数时逆时针扫描。它的有效范围在-360度到360度之间,当绝对值大于360度时,该方法绘制的是一个椭圆。 | 2364 2365**错误码:** 2366 2367以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 2368 2369| 错误码ID | 错误信息 | 2370| ------- | --------------------------------------------| 2371| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 2372 2373**示例** 2374 2375```ts 2376import { RenderNode } from '@kit.ArkUI'; 2377import { common2D, drawing } from '@kit.ArkGraphics2D'; 2378class DrawingRenderNode extends RenderNode { 2379 draw(context : DrawContext) { 2380 const canvas = context.canvas; 2381 const pen = new drawing.Pen(); 2382 pen.setStrokeWidth(5); 2383 const color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 }; 2384 pen.setColor(color); 2385 canvas.attachPen(pen); 2386 const rect: common2D.Rect = {left:100, top:50, right:400, bottom:200}; 2387 canvas.drawArc(rect, 90, 180); 2388 canvas.detachPen(); 2389 } 2390} 2391``` 2392 2393### drawPoint 2394 2395drawPoint(x: number, y: number): void 2396 2397用于绘制一个点。 2398 2399**系统能力**:SystemCapability.Graphics.Drawing 2400 2401**参数:** 2402 2403| 参数名 | 类型 | 必填 | 说明 | 2404| ------ | ------ | ---- | ------------------- | 2405| x | number | 是 | 点的x轴坐标,该参数为浮点数。 | 2406| y | number | 是 | 点的y轴坐标,该参数为浮点数。 | 2407 2408**错误码:** 2409 2410以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 2411 2412| 错误码ID | 错误信息 | 2413| ------- | --------------------------------------------| 2414| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 2415 2416**示例:** 2417 2418```ts 2419import { RenderNode } from '@kit.ArkUI'; 2420import { drawing } from '@kit.ArkGraphics2D'; 2421class DrawingRenderNode extends RenderNode { 2422 draw(context : DrawContext) { 2423 const canvas = context.canvas; 2424 const pen = new drawing.Pen(); 2425 pen.setStrokeWidth(5); 2426 pen.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 2427 canvas.attachPen(pen); 2428 canvas.drawPoint(10, 10); 2429 canvas.detachPen(); 2430 } 2431} 2432``` 2433 2434### drawPoints<sup>12+</sup> 2435 2436drawPoints(points: Array\<common2D.Point>, mode?: PointMode): void 2437 2438在画布上绘制一组点、线段或多边形。通过指定点的数组和绘制模式来决定如何绘制这些点。 2439 2440**系统能力**:SystemCapability.Graphics.Drawing 2441 2442**参数:** 2443 2444| 参数名 | 类型 | 必填 | 说明 | 2445| ---- | ---------------------------------------- | ---- | --------- | 2446| points | Array\<[common2D.Point](js-apis-graphics-common2D.md#point)> | 是 | 要绘制的点的数组。长度不能为0。 | 2447| mode | [PointMode](#pointmode12) | 否 | 绘制数组中的点的方式,默认为drawing.PointMode.POINTS。 | 2448 2449**错误码:** 2450 2451以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 2452 2453| 错误码ID | 错误信息 | 2454| ------- | --------------------------------------------| 2455| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types; 3. Parameter verification failed.| 2456 2457**示例:** 2458 2459```ts 2460import { RenderNode } from '@kit.ArkUI'; 2461import { common2D, drawing } from '@kit.ArkGraphics2D'; 2462class DrawingRenderNode extends RenderNode { 2463 draw(context : DrawContext) { 2464 const canvas = context.canvas; 2465 const pen = new drawing.Pen(); 2466 pen.setStrokeWidth(30); 2467 const color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 }; 2468 pen.setColor(color); 2469 canvas.attachPen(pen); 2470 canvas.drawPoints([{x: 100, y: 200}, {x: 150, y: 230}, {x: 200, y: 300}], drawing.PointMode.POINTS); 2471 canvas.detachPen(); 2472 } 2473} 2474``` 2475 2476### drawPath 2477 2478drawPath(path: Path): void 2479 2480用于绘制一个自定义路径,该路径包含了一组路径轮廓,每个路径轮廓可以是开放的或封闭的。 2481 2482**系统能力**:SystemCapability.Graphics.Drawing 2483 2484**参数:** 2485 2486| 参数名 | 类型 | 必填 | 说明 | 2487| ------ | ------------- | ---- | ------------------ | 2488| path | [Path](#path) | 是 | 要绘制的路径对象。 | 2489 2490**错误码:** 2491 2492以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 2493 2494| 错误码ID | 错误信息 | 2495| ------- | --------------------------------------------| 2496| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 2497 2498**示例:** 2499 2500```ts 2501import { RenderNode } from '@kit.ArkUI'; 2502import { drawing } from '@kit.ArkGraphics2D'; 2503class DrawingRenderNode extends RenderNode { 2504 draw(context : DrawContext) { 2505 const canvas = context.canvas; 2506 const pen = new drawing.Pen(); 2507 pen.setStrokeWidth(5); 2508 pen.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 2509 let path = new drawing.Path(); 2510 path.moveTo(10,10); 2511 path.cubicTo(10, 10, 10, 10, 15, 15); 2512 path.close(); 2513 canvas.attachPen(pen); 2514 canvas.drawPath(path); 2515 canvas.detachPen(); 2516 } 2517} 2518``` 2519 2520### drawLine 2521 2522drawLine(x0: number, y0: number, x1: number, y1: number): void 2523 2524用于画一条直线段,从指定的起点到指点的终点。如果直线段的起点和终点是同一个点,无法绘制。 2525 2526**系统能力**:SystemCapability.Graphics.Drawing 2527 2528**参数:** 2529 2530| 参数名 | 类型 | 必填 | 说明 | 2531| ------ | ------ | ---- | ----------------------- | 2532| x0 | number | 是 | 线段起点的X坐标,该参数为浮点数。 | 2533| y0 | number | 是 | 线段起点的Y坐标,该参数为浮点数。 | 2534| x1 | number | 是 | 线段终点的X坐标,该参数为浮点数。 | 2535| y1 | number | 是 | 线段终点的Y坐标,该参数为浮点数。 | 2536 2537**错误码:** 2538 2539以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 2540 2541| 错误码ID | 错误信息 | 2542| ------- | --------------------------------------------| 2543| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 2544 2545**示例:** 2546 2547```ts 2548import { RenderNode } from '@kit.ArkUI'; 2549import { drawing } from '@kit.ArkGraphics2D'; 2550class DrawingRenderNode extends RenderNode { 2551 draw(context : DrawContext) { 2552 const canvas = context.canvas; 2553 const pen = new drawing.Pen(); 2554 pen.setStrokeWidth(5); 2555 pen.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 2556 canvas.attachPen(pen); 2557 canvas.drawLine(0, 0, 20, 20); 2558 canvas.detachPen(); 2559 } 2560} 2561``` 2562 2563### drawTextBlob 2564 2565drawTextBlob(blob: TextBlob, x: number, y: number): void 2566 2567用于绘制一段文字。若构造blob的字体不支持待绘制字符,则该部分字符无法绘制。 2568 2569**系统能力**:SystemCapability.Graphics.Drawing 2570 2571**参数:** 2572 2573| 参数名 | 类型 | 必填 | 说明 | 2574| ------ | --------------------- | ---- | ------------------------------------------ | 2575| blob | [TextBlob](#textblob) | 是 | TextBlob对象。 | 2576| x | number | 是 | 所绘制出的文字基线(下图蓝线)的左端点(下图红点)的横坐标,该参数为浮点数。 | 2577| y | number | 是 | 所绘制出的文字基线(下图蓝线)的左端点(下图红点)的纵坐标,该参数为浮点数。 | 2578 2579 2580 2581**错误码:** 2582 2583以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 2584 2585| 错误码ID | 错误信息 | 2586| ------- | --------------------------------------------| 2587| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 2588 2589**示例:** 2590 2591```ts 2592import { RenderNode } from '@kit.ArkUI'; 2593import { drawing } from '@kit.ArkGraphics2D'; 2594class DrawingRenderNode extends RenderNode { 2595 draw(context : DrawContext) { 2596 const canvas = context.canvas; 2597 const brush = new drawing.Brush(); 2598 brush.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 2599 const font = new drawing.Font(); 2600 font.setSize(20); 2601 const textBlob = drawing.TextBlob.makeFromString("Hello, drawing", font, drawing.TextEncoding.TEXT_ENCODING_UTF8); 2602 canvas.attachBrush(brush); 2603 canvas.drawTextBlob(textBlob, 20, 20); 2604 canvas.detachBrush(); 2605 } 2606} 2607``` 2608 2609### drawSingleCharacter<sup>12+</sup> 2610 2611drawSingleCharacter(text: string, font: Font, x: number, y: number): void 2612 2613用于绘制单个字符。当前字型中的字体不支持待绘制字符时,退化到使用系统字体绘制字符。 2614 2615**系统能力**:SystemCapability.Graphics.Drawing 2616 2617**参数** 2618 2619| 参数名 | 类型 | 必填 | 说明 | 2620| ------ | ------------------- | ---- | ----------- | 2621| text | string | 是 | 待绘制的单个字符,字符串的长度必须为1。 | 2622| font | [Font](#font) | 是 | 字型对象。 | 2623| x | number | 是 | 所绘制出的字符基线(下图蓝线)的左端点(下图红点)的横坐标,该参数为浮点数。 | 2624| y | number | 是 | 所绘制出的字符基线(下图蓝线)的左端点(下图红点)的纵坐标,该参数为浮点数。 | 2625 2626 2627 2628**错误码:** 2629 2630以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 2631 2632| 错误码ID | 错误信息 | 2633| ------- | --------------------------------------------| 2634| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 2635 2636**示例** 2637 2638```ts 2639import { RenderNode } from '@kit.ArkUI'; 2640import { drawing } from '@kit.ArkGraphics2D'; 2641 2642class DrawingRenderNode extends RenderNode { 2643 draw(context : DrawContext) { 2644 const canvas = context.canvas; 2645 const brush = new drawing.Brush(); 2646 brush.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 2647 const font = new drawing.Font(); 2648 font.setSize(20); 2649 canvas.attachBrush(brush); 2650 canvas.drawSingleCharacter("你", font, 100, 100); 2651 canvas.drawSingleCharacter("好", font, 120, 100); 2652 canvas.detachBrush(); 2653 } 2654} 2655``` 2656 2657### drawRegion<sup>12+</sup> 2658 2659drawRegion(region: Region): void 2660 2661用于绘制一个区域。 2662 2663**系统能力**:SystemCapability.Graphics.Drawing 2664 2665**参数** 2666 2667| 参数名 | 类型 | 必填 | 说明 | 2668| ------ | ------------------- | ---- | ----------- | 2669| region | [Region](#region12) | 是 | 绘制的区域。 | 2670 2671**错误码:** 2672 2673以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 2674 2675| 错误码ID | 错误信息 | 2676| ------- | --------------------------------------------| 2677| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 2678 2679**示例** 2680 2681```ts 2682import { RenderNode } from '@kit.ArkUI'; 2683import { drawing } from '@kit.ArkGraphics2D'; 2684class DrawingRenderNode extends RenderNode { 2685 draw(context : DrawContext) { 2686 const canvas = context.canvas; 2687 const pen = new drawing.Pen(); 2688 let region = new drawing.Region(); 2689 pen.setStrokeWidth(10); 2690 pen.setColor({ alpha: 255, red: 255, green: 0, blue: 0 }); 2691 canvas.attachPen(pen); 2692 region.setRect(100, 100, 400, 400); 2693 canvas.drawRegion(region); 2694 canvas.detachPen(); 2695 } 2696} 2697``` 2698 2699### attachPen 2700 2701attachPen(pen: Pen): void 2702 2703绑定画笔给画布,画布将使用画笔的样式和颜色去绘制图形形状的轮廓。 2704 2705> **说明:** 2706> 2707> 执行该方法后,若pen的效果发生改变并且开发者希望该变化生效于接下来的绘制动作,需要再次执行该方法以确保变化生效。 2708 2709**系统能力**:SystemCapability.Graphics.Drawing 2710 2711**参数:** 2712 2713| 参数名 | 类型 | 必填 | 说明 | 2714| ------ | ----------- | ---- | ---------- | 2715| pen | [Pen](#pen) | 是 | 画笔对象。 | 2716 2717**错误码:** 2718 2719以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 2720 2721| 错误码ID | 错误信息 | 2722| ------- | --------------------------------------------| 2723| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 2724 2725**示例:** 2726 2727```ts 2728import { RenderNode } from '@kit.ArkUI'; 2729import { drawing } from '@kit.ArkGraphics2D'; 2730class DrawingRenderNode extends RenderNode { 2731 draw(context : DrawContext) { 2732 const canvas = context.canvas; 2733 const pen = new drawing.Pen(); 2734 pen.setStrokeWidth(5); 2735 pen.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 2736 canvas.attachPen(pen); 2737 canvas.drawRect({ left : 0, right : 10, top : 0, bottom : 10 }); 2738 canvas.detachPen(); 2739 } 2740} 2741``` 2742 2743### attachBrush 2744 2745attachBrush(brush: Brush): void 2746 2747绑定画刷给画布,画布将使用画刷的样式和颜色去绘制图形形状,并在其内部进行填充。 2748 2749> **说明:** 2750> 2751> 执行该方法后,若brush的效果发生改变并且开发者希望该变化生效于接下来的绘制动作,需要再次执行该方法以确保变化生效。 2752 2753**系统能力**:SystemCapability.Graphics.Drawing 2754 2755**参数:** 2756 2757| 参数名 | 类型 | 必填 | 说明 | 2758| ------ | --------------- | ---- | ---------- | 2759| brush | [Brush](#brush) | 是 | 画刷对象。 | 2760 2761**错误码:** 2762 2763以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 2764 2765| 错误码ID | 错误信息 | 2766| ------- | --------------------------------------------| 2767| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 2768 2769**示例:** 2770 2771```ts 2772import { RenderNode } from '@kit.ArkUI'; 2773import { drawing } from '@kit.ArkGraphics2D'; 2774class DrawingRenderNode extends RenderNode { 2775 draw(context : DrawContext) { 2776 const canvas = context.canvas; 2777 const brush = new drawing.Brush(); 2778 brush.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 2779 canvas.attachBrush(brush); 2780 canvas.drawRect({ left : 0, right : 10, top : 0, bottom : 10 }); 2781 canvas.detachBrush(); 2782 } 2783} 2784``` 2785 2786### detachPen 2787 2788detachPen(): void 2789 2790用于去除掉画布中的画笔,画布将不再使用画笔去绘制图形形状的轮廓。 2791 2792**系统能力**:SystemCapability.Graphics.Drawing 2793 2794**示例:** 2795 2796```ts 2797import { RenderNode } from '@kit.ArkUI'; 2798import { drawing } from '@kit.ArkGraphics2D'; 2799class DrawingRenderNode extends RenderNode { 2800 draw(context : DrawContext) { 2801 const canvas = context.canvas; 2802 const pen = new drawing.Pen(); 2803 pen.setStrokeWidth(5); 2804 pen.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 2805 canvas.attachPen(pen); 2806 canvas.drawRect({ left : 0, right : 10, top : 0, bottom : 10 }); 2807 canvas.detachPen(); 2808 } 2809} 2810``` 2811 2812### detachBrush 2813 2814detachBrush(): void 2815 2816用于去除掉画布中的画刷,画布将不再使用画刷去绘制图形形状,也不会进行填充。 2817 2818**系统能力**:SystemCapability.Graphics.Drawing 2819 2820**示例:** 2821 2822```ts 2823import { RenderNode } from '@kit.ArkUI'; 2824import { drawing } from '@kit.ArkGraphics2D'; 2825class DrawingRenderNode extends RenderNode { 2826 draw(context : DrawContext) { 2827 const canvas = context.canvas; 2828 const brush = new drawing.Brush(); 2829 brush.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 2830 canvas.attachBrush(brush); 2831 canvas.drawRect({ left : 0, right : 10, top : 0, bottom : 10 }); 2832 canvas.detachBrush(); 2833 } 2834} 2835``` 2836 2837### clipPath<sup>12+</sup> 2838 2839clipPath(path: Path, clipOp?: ClipOp, doAntiAlias?: boolean): void 2840 2841用于裁剪一个自定义路径。 2842 2843**系统能力**:SystemCapability.Graphics.Drawing 2844 2845**参数:** 2846 2847| 参数名 | 类型 | 必填 | 说明 | 2848| ------------ | ----------------- | ---- | ------------------------------------| 2849| path | [Path](#path) | 是 | 路径对象。 | 2850| clipOp | [ClipOp](#clipop12) | 否 | 裁剪方式。默认为INTERSECT。 | 2851| doAntiAlias | boolean | 否 | 表示是否使能抗锯齿绘制。true表示使能,false表示不使能。默认为false。 | 2852 2853**错误码:** 2854 2855以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 2856 2857| 错误码ID | 错误信息 | 2858| ------- | --------------------------------------------| 2859| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 2860 2861**示例:** 2862 2863```ts 2864import { RenderNode } from '@kit.ArkUI'; 2865import { common2D, drawing } from '@kit.ArkGraphics2D'; 2866class DrawingRenderNode extends RenderNode { 2867 draw(context : DrawContext) { 2868 const canvas = context.canvas; 2869 let path = new drawing.Path(); 2870 path.moveTo(10, 10); 2871 path.cubicTo(100, 100, 80, 150, 300, 150); 2872 path.close(); 2873 canvas.clipPath(path, drawing.ClipOp.INTERSECT, true); 2874 canvas.clear({alpha: 255, red: 255, green: 0, blue: 0}); 2875 } 2876} 2877``` 2878 2879### clipRect<sup>12+</sup> 2880 2881clipRect(rect: common2D.Rect, clipOp?: ClipOp, doAntiAlias?: boolean): void 2882 2883用于裁剪一个矩形。 2884 2885**系统能力**:SystemCapability.Graphics.Drawing 2886 2887**参数:** 2888 2889| 参数名 | 类型 | 必填 | 说明 | 2890| ----------- | ---------------------------------------- | ---- | ------------------- | 2891| rect | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是 | 需要裁剪的矩形区域。 | 2892| clipOp | [ClipOp](#clipop12) | 否 | 裁剪方式。默认为INTERSECT。 | 2893| doAntiAlias | boolean | 否 | 表示是否使能抗锯齿绘制。true表示使能,false表示不使能。默认为false。 | 2894 2895**错误码:** 2896 2897以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 2898 2899| 错误码ID | 错误信息 | 2900| ------- | --------------------------------------------| 2901| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 2902 2903**示例:** 2904 2905```ts 2906import { RenderNode } from '@kit.ArkUI'; 2907import { common2D, drawing } from '@kit.ArkGraphics2D'; 2908class DrawingRenderNode extends RenderNode { 2909 draw(context : DrawContext) { 2910 const canvas = context.canvas; 2911 canvas.clipRect({left : 10, right : 500, top : 300, bottom : 900}, drawing.ClipOp.DIFFERENCE, true); 2912 canvas.clear({alpha: 255, red: 255, green: 0, blue: 0}); 2913 } 2914} 2915``` 2916 2917### save<sup>12+</sup> 2918 2919save(): number 2920 2921用于保存当前画布的状态(画布矩阵)到栈顶。需要与恢复接口[restore](#restore12)配合使用。 2922 2923**系统能力**:SystemCapability.Graphics.Drawing 2924 2925**返回值:** 2926 2927| 类型 | 说明 | 2928| ------ | ------------------ | 2929| number | 画布状态个数,该参数为正整数。 | 2930 2931**示例:** 2932 2933```ts 2934import { RenderNode } from '@kit.ArkUI'; 2935import { common2D, drawing } from '@kit.ArkGraphics2D'; 2936class DrawingRenderNode extends RenderNode { 2937 draw(context : DrawContext) { 2938 const canvas = context.canvas; 2939 let rect: common2D.Rect = {left: 10, right: 200, top: 100, bottom: 300}; 2940 canvas.drawRect(rect); 2941 let saveCount = canvas.save(); 2942 } 2943} 2944``` 2945 2946### saveLayer<sup>12+</sup> 2947 2948saveLayer(rect?: common2D.Rect | null, brush?: Brush | null): number 2949 2950保存当前画布的矩阵和裁剪区域,并为后续绘制分配位图。调用恢复接口[restore](#restore12)将会舍弃对矩阵和裁剪区域做的更改,并绘制位图。 2951 2952**系统能力**:SystemCapability.Graphics.Drawing 2953 2954**参数:** 2955 2956| 参数名 | 类型 | 必填 | 说明 | 2957| ---- | ------ | ---- | ----------------- | 2958| rect | [common2D.Rect](js-apis-graphics-common2D.md#rect)\|null | 否 | 矩形对象,用于限制图层大小,默认为当前画布大小。 | 2959| brush | [Brush](#brush)\|null | 否 | 画刷对象,绘制位图时会应用画刷对象的透明度,颜色滤波器效果和混合模式,默认不设置额外效果。 | 2960 2961**返回值:** 2962 2963| 类型 | 说明 | 2964| ------ | ------------------ | 2965| number | 返回调用前保存的画布状态数,该参数为正整数。 | 2966 2967**错误码:** 2968 2969以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 2970 2971| 错误码ID | 错误信息 | 2972| ------- | --------------------------------------------| 2973| 401 | Parameter error. Possible causes: Mandatory parameters are left unspecified. | 2974 2975**示例:** 2976 2977```ts 2978import { RenderNode } from '@kit.ArkUI'; 2979import { common2D, drawing } from '@kit.ArkGraphics2D'; 2980class DrawingRenderNode extends RenderNode { 2981 draw(context : DrawContext) { 2982 const canvas = context.canvas; 2983 canvas.saveLayer(null, null); 2984 const brushRect = new drawing.Brush(); 2985 const colorRect: common2D.Color = {alpha: 255, red: 255, green: 255, blue: 0}; 2986 brushRect.setColor(colorRect); 2987 canvas.attachBrush(brushRect); 2988 const rect: common2D.Rect = {left:100, top:100, right:500, bottom:500}; 2989 canvas.drawRect(rect); 2990 2991 const brush = new drawing.Brush(); 2992 brush.setBlendMode(drawing.BlendMode.DST_OUT); 2993 canvas.saveLayer(rect, brush); 2994 2995 const brushCircle = new drawing.Brush(); 2996 const colorCircle: common2D.Color = {alpha: 255, red: 0, green: 0, blue: 255}; 2997 brushCircle.setColor(colorCircle); 2998 canvas.attachBrush(brushCircle); 2999 canvas.drawCircle(500, 500, 200); 3000 canvas.restore(); 3001 canvas.restore(); 3002 canvas.detachBrush(); 3003 } 3004} 3005``` 3006 3007### scale<sup>12+</sup> 3008 3009scale(sx: number, sy: number): void 3010 3011用于画布缩放。 3012 3013**系统能力**:SystemCapability.Graphics.Drawing 3014 3015**参数:** 3016 3017| 参数名 | 类型 | 必填 | 说明 | 3018| ---- | ------ | ---- | ----------------- | 3019| sx | number | 是 | x轴方向的缩放比例,该参数为浮点数。 | 3020| sy | number | 是 | y轴方向的缩放比例,该参数为浮点数。 | 3021 3022**错误码:** 3023 3024以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 3025 3026| 错误码ID | 错误信息 | 3027| ------- | --------------------------------------------| 3028| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 3029 3030**示例:** 3031 3032```ts 3033import { RenderNode } from '@kit.ArkUI'; 3034import { common2D, drawing } from '@kit.ArkGraphics2D'; 3035class DrawingRenderNode extends RenderNode { 3036 draw(context : DrawContext) { 3037 const canvas = context.canvas; 3038 const pen = new drawing.Pen(); 3039 pen.setStrokeWidth(5); 3040 pen.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 3041 canvas.attachPen(pen); 3042 canvas.scale(2, 0.5); 3043 canvas.drawRect({left : 10, right : 500, top : 300, bottom : 900}); 3044 canvas.detachPen(); 3045 } 3046} 3047``` 3048 3049### skew<sup>12+</sup> 3050 3051skew(sx: number, sy: number) : void 3052 3053用于画布倾斜变换,包括水平轴和垂直轴上的偏移。 3054 3055**系统能力**:SystemCapability.Graphics.Drawing 3056 3057**参数:** 3058 3059| 参数名 | 类型 | 必填 | 说明 | 3060| ---- | ------ | ---- | ----------------- | 3061| sx | number | 是 | x轴上的倾斜量,该参数为浮点数。正值会使绘制沿y轴增量方向向右倾斜;负值会使绘制沿y轴增量方向向左倾斜。 | 3062| sy | number | 是 | y轴上的倾斜量,该参数为浮点数。正值会使绘制沿x轴增量方向向下倾斜;负值会使绘制沿x轴增量方向向上倾斜。 | 3063 3064**错误码:** 3065 3066以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 3067 3068| 错误码ID | 错误信息 | 3069| ------- | --------------------------------------------| 3070| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 3071 3072**示例:** 3073 3074```ts 3075import { RenderNode } from '@kit.ArkUI'; 3076import { common2D, drawing } from '@kit.ArkGraphics2D'; 3077class DrawingRenderNode extends RenderNode { 3078 draw(context : DrawContext) { 3079 const canvas = context.canvas; 3080 const pen = new drawing.Pen(); 3081 pen.setStrokeWidth(5); 3082 pen.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 3083 canvas.attachPen(pen); 3084 canvas.skew(0.1, 0.1); 3085 canvas.drawRect({left : 10, right : 500, top : 300, bottom : 900}); 3086 canvas.detachPen(); 3087 } 3088} 3089``` 3090 3091### rotate<sup>12+</sup> 3092 3093rotate(degrees: number, sx: number, sy: number) : void 3094 3095用于画布旋转一定的角度。 3096 3097**系统能力**:SystemCapability.Graphics.Drawing 3098 3099**参数:** 3100 3101| 参数名 | 类型 | 必填 | 说明 | 3102| ---- | ------ | ------ | ------------------------ | 3103| degrees | number | 是 | 旋转角度,单位为度,该参数为浮点数,正数为顺时针旋转,负数为逆时针旋转。 | 3104| sx | number | 是 | 旋转中心的横坐标,该参数为浮点数。 | 3105| sy | number | 是 | 旋转中心的纵坐标,该参数为浮点数。 | 3106 3107**错误码:** 3108 3109以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 3110 3111| 错误码ID | 错误信息 | 3112| ------- | --------------------------------------------| 3113| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 3114 3115**示例:** 3116 3117```ts 3118import { RenderNode } from '@kit.ArkUI'; 3119import { common2D, drawing } from '@kit.ArkGraphics2D'; 3120class DrawingRenderNode extends RenderNode { 3121 draw(context : DrawContext) { 3122 const canvas = context.canvas; 3123 const pen = new drawing.Pen(); 3124 pen.setStrokeWidth(5); 3125 pen.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 3126 canvas.attachPen(pen); 3127 canvas.rotate(30, 100, 100); 3128 canvas.drawRect({left : 10, right : 500, top : 300, bottom : 900}); 3129 canvas.detachPen(); 3130 } 3131} 3132``` 3133 3134### translate<sup>12+</sup> 3135 3136translate(dx: number, dy: number): void 3137 3138用于平移画布一段距离。 3139 3140**系统能力**:SystemCapability.Graphics.Drawing 3141 3142**参数:** 3143 3144| 参数名 | 类型 | 必填 | 说明 | 3145| ----- | ------ | ---- | ------------------- | 3146| dx | number | 是 | x轴方向的移动距离,该参数为浮点数。 | 3147| dy | number | 是 | y轴方向的移动距离,该参数为浮点数。 | 3148 3149**错误码:** 3150 3151以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 3152 3153| 错误码ID | 错误信息 | 3154| ------- | --------------------------------------------| 3155| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 3156 3157**示例:** 3158 3159```ts 3160import { RenderNode } from '@kit.ArkUI'; 3161import { common2D, drawing } from '@kit.ArkGraphics2D'; 3162class DrawingRenderNode extends RenderNode { 3163 draw(context : DrawContext) { 3164 const canvas = context.canvas; 3165 const pen = new drawing.Pen(); 3166 pen.setStrokeWidth(5); 3167 pen.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 3168 canvas.attachPen(pen); 3169 canvas.translate(10, 10); 3170 canvas.drawRect({left : 10, right : 500, top : 300, bottom : 900}); 3171 canvas.detachPen(); 3172 } 3173} 3174``` 3175 3176### getSaveCount<sup>12+</sup> 3177 3178getSaveCount(): number 3179 3180用于获取栈中保存的画布状态(画布矩阵)的数量。 3181 3182**系统能力**:SystemCapability.Graphics.Drawing 3183 3184**返回值:** 3185 3186| 类型 | 说明 | 3187| ------ | ------------------------------------ | 3188| number | 已保存的画布状态的数量,该参数为正整数。 | 3189 3190**示例:** 3191 3192```ts 3193import { RenderNode } from '@kit.ArkUI'; 3194import { common2D, drawing } from '@kit.ArkGraphics2D'; 3195class DrawingRenderNode extends RenderNode { 3196 draw(context : DrawContext) { 3197 const canvas = context.canvas; 3198 const pen = new drawing.Pen(); 3199 pen.setStrokeWidth(5); 3200 pen.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 3201 canvas.attachPen(pen); 3202 canvas.drawRect({left: 10, right: 200, top: 100, bottom: 300}); 3203 canvas.save(); 3204 canvas.drawRect({left : 10, right : 500, top : 300, bottom : 900}); 3205 canvas.getSaveCount(); 3206 canvas.detachPen(); 3207 } 3208} 3209``` 3210 3211### restoreToCount<sup>12+</sup> 3212 3213restoreToCount(count: number): void 3214 3215用于恢复到指定数量的画布状态(画布矩阵)。 3216 3217**系统能力**:SystemCapability.Graphics.Drawing 3218 3219**参数:** 3220 3221| 参数名 | 类型 | 必填 | 说明 | 3222| ----- | ------ | ---- | ----------------------------- | 3223| count | number | 是 | 要恢复的画布状态深度,该参数为整数。小于等于1时,恢复为初始状态;大于已保存的画布状态数量时,不执行任何操作。 | 3224 3225**错误码:** 3226 3227以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 3228 3229| 错误码ID | 错误信息 | 3230| ------- | --------------------------------------------| 3231| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 3232 3233**示例:** 3234 3235```ts 3236import { RenderNode } from '@kit.ArkUI'; 3237import { common2D, drawing } from '@kit.ArkGraphics2D'; 3238class DrawingRenderNode extends RenderNode { 3239 draw(context : DrawContext) { 3240 const canvas = context.canvas; 3241 const pen = new drawing.Pen(); 3242 pen.setStrokeWidth(5); 3243 pen.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 3244 canvas.attachPen(pen); 3245 canvas.drawRect({left: 10, right: 200, top: 100, bottom: 300}); 3246 canvas.save(); 3247 canvas.drawRect({left: 10, right: 200, top: 100, bottom: 500}); 3248 canvas.save(); 3249 canvas.drawRect({left: 100, right: 300, top: 100, bottom: 500}); 3250 canvas.save(); 3251 canvas.restoreToCount(2); 3252 canvas.drawRect({left : 10, right : 500, top : 300, bottom : 900}); 3253 canvas.detachPen(); 3254 } 3255} 3256``` 3257 3258### restore<sup>12+</sup> 3259 3260restore(): void 3261 3262用于恢复保存在栈顶的画布状态(画布矩阵)。 3263 3264**系统能力**:SystemCapability.Graphics.Drawing 3265 3266**示例:** 3267 3268```ts 3269import { RenderNode } from '@kit.ArkUI'; 3270import { common2D, drawing } from '@kit.ArkGraphics2D'; 3271class DrawingRenderNode extends RenderNode { 3272 draw(context : DrawContext) { 3273 const canvas = context.canvas; 3274 const pen = new drawing.Pen(); 3275 pen.setStrokeWidth(5); 3276 pen.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 3277 canvas.attachPen(pen); 3278 canvas.restore(); 3279 canvas.detachPen(); 3280 } 3281} 3282``` 3283 3284### concatMatrix<sup>12+</sup> 3285 3286concatMatrix(matrix: Matrix): void 3287 3288画布现有矩阵左乘以传入矩阵,不影响该接口之前的绘制操作。 3289 3290**系统能力**:SystemCapability.Graphics.Drawing 3291 3292**参数:** 3293 3294| 参数名 | 类型 | 必填 | 说明 | 3295| ------ | ----------------- | ---- | ----- | 3296| matrix | [Matrix](#matrix12) | 是 | 矩阵对象。 | 3297 3298**错误码:** 3299 3300以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 3301 3302| 错误码ID | 错误信息 | 3303| ------- | --------------------------------------------| 3304| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 3305 3306**示例:** 3307 3308```ts 3309import { RenderNode } from '@kit.ArkUI'; 3310import { drawing } from '@kit.ArkGraphics2D'; 3311class DrawingRenderNode extends RenderNode { 3312 draw(context : DrawContext) { 3313 const canvas = context.canvas; 3314 let matrix = new drawing.Matrix(); 3315 matrix.setMatrix([5, 0, 0, 0, 1, 2, 0, 0, 1]); 3316 canvas.concatMatrix(matrix); 3317 canvas.drawRect({left: 10, right: 200, top: 100, bottom: 500}); 3318 } 3319} 3320``` 3321 3322### setMatrix<sup>12+</sup> 3323 3324setMatrix(matrix: Matrix): void 3325 3326设置画布的矩阵。 3327 3328**系统能力**:SystemCapability.Graphics.Drawing 3329 3330**参数:** 3331 3332| 参数名 | 类型 | 必填 | 说明 | 3333| ------ | ----------------- | ---- | ----- | 3334| matrix | [Matrix](#matrix12) | 是 | 矩阵对象。 | 3335 3336**错误码:** 3337 3338以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 3339 3340| 错误码ID | 错误信息 | 3341| ------- | --------------------------------------------| 3342| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 3343 3344**示例:** 3345 3346```ts 3347import { RenderNode } from '@kit.ArkUI'; 3348import { drawing } from '@kit.ArkGraphics2D'; 3349class DrawingRenderNode extends RenderNode { 3350 draw(context : DrawContext) { 3351 const canvas = context.canvas; 3352 let matrix = new drawing.Matrix() 3353 matrix.setMatrix([5, 0, 0, 0, 1, 1, 0, 0, 1]); 3354 canvas.setMatrix(matrix); 3355 canvas.drawRect({left: 10, right: 200, top: 100, bottom: 500}); 3356 } 3357} 3358``` 3359 3360### isClipEmpty<sup>12+</sup> 3361 3362isClipEmpty(): boolean 3363 3364用于判断裁剪后可绘制区域是否为空。 3365 3366**系统能力**:SystemCapability.Graphics.Drawing 3367 3368**返回值:** 3369 3370| 类型 | 说明 | 3371| --------------------- | -------------- | 3372| boolean | 返回画布的可绘制区域是否为空的结果,true表示为空,false表示不为空。 | 3373 3374**示例:** 3375 3376```ts 3377import { RenderNode } from '@kit.ArkUI'; 3378import { drawing } from '@kit.ArkGraphics2D'; 3379class DrawingRenderNode extends RenderNode { 3380 draw(context : DrawContext) { 3381 const canvas = context.canvas; 3382 if (canvas.isClipEmpty()) { 3383 console.info("canvas.isClipEmpty() returned true"); 3384 } else { 3385 console.info("canvas.isClipEmpty() returned false"); 3386 } 3387 } 3388} 3389``` 3390 3391### clipRegion<sup>12+</sup> 3392 3393clipRegion(region: Region, clipOp?: ClipOp): void 3394 3395在画布上裁剪一个区域。 3396 3397**系统能力**:SystemCapability.Graphics.Drawing 3398 3399**参数:** 3400 3401| 参数名 | 类型 | 必填 | 说明 | 3402| --------------- | ------- | ---- | ----------------------------------------------------------- | 3403| region | [Region](#region12) | 是 | 区域对象,表示裁剪范围。 | 3404| clipOp | [ClipOp](#clipop12) | 否 | 裁剪方式,默认为INTERSECT。 | 3405 3406**错误码:** 3407 3408以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 3409 3410| 错误码ID | 错误信息 | 3411| ------- | --------------------------------------------| 3412| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 3413 3414**示例:** 3415 3416```ts 3417import { RenderNode } from '@kit.ArkUI'; 3418import { common2D, drawing } from '@kit.ArkGraphics2D'; 3419class DrawingRenderNode extends RenderNode { 3420 draw(context : DrawContext) { 3421 const canvas = context.canvas; 3422 let region : drawing.Region = new drawing.Region(); 3423 region.setRect(0, 0, 500, 500); 3424 canvas.clipRegion(region); 3425 let color: common2D.Color = {alpha: 255, red: 255, green: 0, blue: 0}; 3426 canvas.clear(color); 3427 } 3428} 3429``` 3430 3431### clipRoundRect<sup>12+</sup> 3432 3433clipRoundRect(roundRect: RoundRect, clipOp?: ClipOp, doAntiAlias?: boolean): void 3434 3435在画布上裁剪一个圆角矩形。 3436 3437**系统能力**:SystemCapability.Graphics.Drawing 3438 3439**参数:** 3440 3441| 参数名 | 类型 | 必填 | 说明 | 3442| --------------- | ------- | ---- | ----------------------------------------------------------- | 3443| roundRect | [RoundRect](#roundrect12) | 是 | 圆角矩形对象,表示裁剪范围。 | 3444| clipOp | [ClipOp](#clipop12) | 否 | 裁剪方式,默认为INTERSECT。 | 3445| doAntiAlias | boolean | 否 | 表示是否使能抗锯齿。true表示使能,false表示不使能。默认为false。 | 3446 3447**错误码:** 3448 3449以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 3450 3451| 错误码ID | 错误信息 | 3452| ------- | --------------------------------------------| 3453| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 3454 3455**示例:** 3456 3457```ts 3458import { RenderNode } from '@kit.ArkUI'; 3459import { common2D, drawing } from '@kit.ArkGraphics2D'; 3460class DrawingRenderNode extends RenderNode { 3461 draw(context : DrawContext) { 3462 const canvas = context.canvas; 3463 let rect: common2D.Rect = { left: 10, top: 100, right: 200, bottom: 300 }; 3464 let roundRect = new drawing.RoundRect(rect, 10, 10); 3465 canvas.clipRoundRect(roundRect); 3466 let color: common2D.Color = {alpha: 255, red: 255, green: 0, blue: 0}; 3467 canvas.clear(color); 3468 } 3469} 3470``` 3471 3472### resetMatrix<sup>12+</sup> 3473 3474resetMatrix(): void 3475 3476重置当前画布的矩阵为单位矩阵。 3477 3478**系统能力**:SystemCapability.Graphics.Drawing 3479 3480**示例:** 3481 3482```ts 3483import { RenderNode } from '@kit.ArkUI'; 3484import { drawing } from '@kit.ArkGraphics2D'; 3485class DrawingRenderNode extends RenderNode { 3486 draw(context : DrawContext) { 3487 const canvas = context.canvas; 3488 canvas.scale(4, 6); 3489 canvas.resetMatrix(); 3490 } 3491} 3492``` 3493 3494### quickRejectPath<sup>18+</sup> 3495 3496quickRejectPath(path: Path): boolean 3497 3498判断路径与画布区域是否不相交。画布区域包含边界。 3499 3500**系统能力**:SystemCapability.Graphics.Drawing 3501 3502**参数:** 3503 3504| 参数名 | 类型 | 必填 | 说明 | 3505| ------ | ------------- | ---- | ------------------ | 3506| path | [Path](#path) | 是 | 路径对象。 | 3507 3508**返回值:** 3509 3510| 类型 | 说明 | 3511| --------------------- | -------------- | 3512| boolean | 返回路径是否与画布区域不相交的结果。true表示路径与画布区域不相交,false表示路径与画布区域相交。 | 3513 3514**示例:** 3515 3516```ts 3517import { RenderNode } from '@kit.ArkUI'; 3518import { drawing } from '@kit.ArkGraphics2D'; 3519 3520class DrawingRenderNode extends RenderNode { 3521 draw(context : DrawContext) { 3522 const canvas = context.canvas; 3523 let path = new drawing.Path(); 3524 path.moveTo(10, 10); 3525 path.cubicTo(10, 10, 10, 10, 15, 15); 3526 path.close(); 3527 if (canvas.quickRejectPath(path)) { 3528 console.info("canvas and path do not intersect."); 3529 } else { 3530 console.info("canvas and path intersect."); 3531 } 3532 } 3533} 3534``` 3535 3536### quickRejectRect<sup>18+</sup> 3537 3538quickRejectRect(rect: common2D.Rect): boolean 3539 3540判断矩形和画布区域是否不相交。画布区域包含边界。 3541 3542**系统能力**:SystemCapability.Graphics.Drawing 3543 3544**参数:** 3545 3546| 参数名 | 类型 | 必填 | 说明 | 3547| ------ | -------------------------------------------------- | ---- | -------------- | 3548| rect | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是 | 矩形区域。 | 3549 3550**返回值:** 3551 3552| 类型 | 说明 | 3553| --------------------- | -------------- | 3554| boolean | 返回矩形是否与画布区域不相交的结果。true表示矩形与画布区域不相交,false表示矩形与画布区域相交。 | 3555 3556**示例:** 3557 3558```ts 3559import { RenderNode } from '@kit.ArkUI'; 3560import { common2D, drawing } from '@kit.ArkGraphics2D'; 3561 3562class DrawingRenderNode extends RenderNode { 3563 draw(context : DrawContext) { 3564 const canvas = context.canvas; 3565 let rect: common2D.Rect = { left : 10, top : 20, right : 50, bottom : 30 }; 3566 if (canvas.quickRejectRect(rect)) { 3567 console.info("canvas and rect do not intersect."); 3568 } else { 3569 console.info("canvas and rect intersect."); 3570 } 3571 } 3572} 3573``` 3574 3575### drawArcWithCenter<sup>18+</sup> 3576 3577drawArcWithCenter(arc: common2D.Rect, startAngle: number, sweepAngle: number, useCenter: boolean): void 3578 3579在画布上绘制一段圆弧。该方法允许指定圆弧的起始角度、扫描角度以及圆弧的起点和终点是否连接圆弧的中心点。 3580 3581**系统能力**:SystemCapability.Graphics.Drawing 3582 3583**参数** 3584 3585| 参数名 | 类型 | 必填 | 说明 | 3586| ------ | -------------------------------------------------- | ---- | -------------- | 3587| arc | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是 | 包含要绘制的圆弧的椭圆的矩形边界。 | 3588| startAngle | number | 是 | 弧的起始角度,单位为度,该参数为浮点数。0度时起始点位于椭圆的右端点,为正数时以顺时针方向放置起始点,为负数时以逆时针方向放置起始点。 | 3589| sweepAngle | number | 是 | 弧的扫描角度,单位为度,该参数为浮点数。为正数时顺时针扫描,为负数时逆时针扫描。扫描角度可以超过360度,将绘制一个完整的椭圆。 | 3590| useCenter | boolean | 是 | 绘制时弧形的起点和终点是否连接弧形的中心点。true表示连接,false表示不连接。 | 3591 3592**示例** 3593 3594```ts 3595import { RenderNode } from '@kit.ArkUI'; 3596import { common2D, drawing } from '@kit.ArkGraphics2D'; 3597 3598class DrawingRenderNode extends RenderNode { 3599 draw(context : DrawContext) { 3600 const canvas = context.canvas; 3601 const pen = new drawing.Pen(); 3602 pen.setStrokeWidth(5); 3603 const color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 }; 3604 pen.setColor(color); 3605 canvas.attachPen(pen); 3606 const rect: common2D.Rect = { left: 100, top: 50, right: 400, bottom: 200 }; 3607 canvas.drawArcWithCenter(rect, 90, 180, false); 3608 canvas.detachPen(); 3609 } 3610} 3611``` 3612 3613### drawImageNine<sup>18+</sup> 3614 3615drawImageNine(pixelmap: image.PixelMap, center: common2D.Rect, dstRect: common2D.Rect, filterMode: FilterMode): void 3616 3617通过绘制两条水平线和两条垂直线将图像分割成9个部分:四个边,四个角和中心。<br> 3618若角落的4个区域尺寸不超过目标矩形,则会在不缩放的情况下被绘制在目标矩形,反之则会按比例缩放绘制在目标矩形;如果还有剩余空间,剩下的5个区域会通过拉伸或压缩来绘制,以便能够完全覆盖目标矩形。 3619 3620**系统能力**:SystemCapability.Graphics.Drawing 3621 3622**参数:** 3623 3624| 参数名 | 类型 | 必填 | 说明 | 3625| ------ | ------ | ---- | -------------- | 3626| pixelmap | [image.PixelMap](../apis-image-kit/js-apis-image.md#pixelmap7) | 是 | 用于绘制网格的像素图。 | 3627| center | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是 | 分割图像的中心矩形。矩形四条边所在的直线将图像分成了9个部分。 | 3628| dstRect | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是 | 在画布上绘制的目标矩形区域。 | 3629| filterMode | [FilterMode](#filtermode12) | 是 | 过滤模式。 | 3630 3631**错误码:** 3632 3633以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 3634 3635| 错误码ID | 错误信息 | 3636| ------- | --------------------------------------------| 3637| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 3638 3639**示例:** 3640 3641```ts 3642import { RenderNode } from '@kit.ArkUI'; 3643import { common2D, drawing } from '@kit.ArkGraphics2D'; 3644import { image } from '@kit.ImageKit'; 3645 3646class DrawingRenderNode extends RenderNode { 3647pixelMap: image.PixelMap | null = null; 3648 draw(context : DrawContext) { 3649 const canvas = context.canvas; 3650 canvas.drawImage(this.pixelMap, 0, 0); // 原图 3651 let center: common2D.Rect = { left: 20, top: 10, right: 50, bottom: 40 }; 3652 let dst: common2D.Rect = { left: 70, top: 0, right: 100, bottom: 30 }; 3653 let dst1: common2D.Rect = { left: 110, top: 0, right: 200, bottom: 90 }; 3654 canvas.drawImageNine(this.pixelMap, center, dst, drawing.FilterMode.FILTER_MODE_NEAREST); // 示例1 3655 canvas.drawImageNine(this.pixelMap, center, dst1, drawing.FilterMode.FILTER_MODE_NEAREST); // 示例2 3656 } 3657} 3658``` 3659 3660 3661### drawImageLattice<sup>18+</sup> 3662 3663drawImageLattice(pixelmap: image.PixelMap, lattice: Lattice, dstRect: common2D.Rect, filterMode: FilterMode): void 3664 3665将图像按照矩形网格对象的设置划分为多个网格,并把图像的每个部分按照网格对象的设置绘制到画布上的目标矩形区域。<br> 3666偶数行和列(起始计数为0)的每个交叉点都是固定的,若固定网格区域的尺寸不超过目标矩形,则会在不缩放的情况下被绘制在目标矩形,反之则会按比例缩放绘制在目标矩形;如果还有剩余空间,剩下的区域会通过拉伸或压缩来绘制,以便能够完全覆盖目标矩形。 3667 3668**系统能力**:SystemCapability.Graphics.Drawing 3669 3670**参数:** 3671 3672| 参数名 | 类型 | 必填 | 说明 | 3673| ------ | ------ | ---- | -------------- | 3674| pixelmap | [image.PixelMap](../apis-image-kit/js-apis-image.md#pixelmap7) | 是 | 用于绘制网格的像素图。 | 3675| lattice | [Lattice](#lattice12) | 是 | 矩形网格对象。 | 3676| dstRect | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是 | 目标矩形区域。 | 3677| filterMode | [FilterMode](#filtermode12) | 是 | 过滤模式。 | 3678 3679**错误码:** 3680 3681以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 3682 3683| 错误码ID | 错误信息 | 3684| ------- | --------------------------------------------| 3685| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 3686 3687**示例:** 3688 3689```ts 3690import { RenderNode } from '@kit.ArkUI'; 3691import { common2D, drawing } from '@kit.ArkGraphics2D'; 3692import { image } from '@kit.ImageKit'; 3693 3694class DrawingRenderNode extends RenderNode { 3695pixelMap: image.PixelMap | null = null; 3696 draw(context : DrawContext) { 3697 const canvas = context.canvas; 3698 canvas.drawImage(this.pixelMap, 0, 0); // 原图 3699 let xDivs: Array<number> = [28, 36, 44, 52]; 3700 let yDivs: Array<number> = [28, 36, 44, 52]; 3701 let lattice = drawing.Lattice.createImageLattice(xDivs, yDivs, 4, 4); 3702 let dst: common2D.Rect = { left: 100, top: 0, right: 164, bottom: 64 }; 3703 let dst1: common2D.Rect = { left: 200, top: 0, right: 360, bottom: 160 }; 3704 canvas.drawImageLattice(this.pixelMap, lattice, dst, drawing.FilterMode.FILTER_MODE_NEAREST); // 示例1 3705 canvas.drawImageLattice(this.pixelMap, lattice, dst1, drawing.FilterMode.FILTER_MODE_NEAREST); // 示例2 3706 } 3707} 3708``` 3709 3710 3711## ImageFilter<sup>12+</sup> 3712 3713图像滤波器。 3714 3715### createBlurImageFilter<sup>12+</sup> 3716 3717static createBlurImageFilter(sigmaX: number, sigmaY: number, tileMode: TileMode, imageFilter?: ImageFilter | null ): ImageFilter 3718 3719创建具有模糊效果的图像滤波器。 3720 3721**系统能力**:SystemCapability.Graphics.Drawing 3722 3723**参数:** 3724 3725| 参数名 | 类型 | 必填 | 说明 | 3726| --------------- | ------- | ---- | ----------------------------------------------------------- | 3727| sigmaX | number | 是 | 表示沿x轴方向上高斯模糊的标准差,必须大于0,该参数为浮点数。 | 3728| sigmaY | number | 是 | 表示沿y轴方向上高斯模糊的标准差,必须大于0,该参数为浮点数。 | 3729| tileMode | [TileMode](#tilemode12)| 是 | 表示在边缘处应用的平铺模式。 | 3730| imageFilter | [ImageFilter](#imagefilter12) \| null | 否 | 表示要和当前图像滤波器叠加的输入滤波器,默认为null,表示直接将当前图像滤波器作用于原始图像。 | 3731 3732**返回值:** 3733 3734| 类型 | 说明 | 3735| --------------------- | -------------- | 3736| [ImageFilter](#imagefilter12) | 返回创建的图像滤波器。 | 3737 3738**错误码:** 3739 3740以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 3741 3742| 错误码ID | 错误信息 | 3743| ------- | --------------------------------------------| 3744| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 3745 3746**示例:** 3747 3748```ts 3749import { drawing } from '@kit.ArkGraphics2D'; 3750let imgFilter = drawing.ImageFilter.createBlurImageFilter(5, 10, drawing.TileMode.CLAMP); 3751``` 3752 3753### createFromColorFilter<sup>12+</sup> 3754 3755static createFromColorFilter(colorFilter: ColorFilter, imageFilter?: ImageFilter | null): ImageFilter 3756 3757创建一个将颜色滤波器应用于传入的图像滤波器的图像滤波器。 3758 3759**系统能力**:SystemCapability.Graphics.Drawing 3760 3761**参数:** 3762 3763| 参数名 | 类型 | 必填 | 说明 | 3764| --------------- | ------- | ---- | ----------------------------------------------------------- | 3765| colorFilter | [ColorFilter](#colorfilter) | 是 | 表示颜色滤波器。 | 3766| imageFilter | [ImageFilter](#imagefilter12) \| null | 否 | 表示要和当前图像滤波器叠加的输入滤波器,默认为null,表示直接将当前图像滤波器作用于原始图像。 | 3767 3768**返回值:** 3769 3770| 类型 | 说明 | 3771| --------------------- | -------------- | 3772| [ImageFilter](#imagefilter12) | 返回创建的图像滤波器。 | 3773 3774**错误码:** 3775 3776以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 3777 3778| 错误码ID | 错误信息 | 3779| ------- | --------------------------------------------| 3780| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 3781 3782**示例:** 3783 3784```ts 3785import { drawing } from '@kit.ArkGraphics2D'; 3786let imgFilter = drawing.ImageFilter.createBlurImageFilter(5, 10, drawing.TileMode.CLAMP); 3787let clolorfilter = drawing.ColorFilter.createSRGBGammaToLinear(); 3788let imgFilter1 = drawing.ImageFilter.createFromColorFilter(clolorfilter, imgFilter); 3789``` 3790 3791## TextBlobRunBuffer 3792 3793描述一行文字中具有相同属性的连续字形。 3794 3795**系统能力**:SystemCapability.Graphics.Drawing 3796 3797| 名称 | 类型 | 可读 | 可写 | 说明 | 3798| --------- | ------ | ---- | ---- | ------------------------- | 3799| glyph | number | 是 | 是 | 存储文字的索引,该参数为整数,传入浮点类型时向下取整。 | 3800| positionX | number | 是 | 是 | 文本的起点x轴坐标,该参数为浮点数。 | 3801| positionY | number | 是 | 是 | 文本的起点y轴坐标,该参数为浮点数。 | 3802 3803## TextEncoding 3804 3805文本的编码类型枚举。 3806 3807**系统能力**:SystemCapability.Graphics.Drawing 3808 3809| 名称 | 值 | 说明 | 3810| ---------------------- | ---- | ------------------------------ | 3811| TEXT_ENCODING_UTF8 | 0 | 使用1个字节表示UTF-8或ASCII。 | 3812| TEXT_ENCODING_UTF16 | 1 | 使用2个字节表示大部分unicode。 | 3813| TEXT_ENCODING_UTF32 | 2 | 使用4个字节表示全部unicode。 | 3814| TEXT_ENCODING_GLYPH_ID | 3 | 使用2个字节表示glyph index。 | 3815 3816## ClipOp<sup>12+</sup> 3817画布裁剪方式的枚举。 3818 3819 3820**系统能力**:SystemCapability.Graphics.Drawing 3821 3822| 名称 | 值 | 说明 | 示意图 | 3823| ------------------ | ---- | ---------------- | -------- | 3824| DIFFERENCE | 0 | 将指定区域裁剪(取差集)。 |  | 3825| INTERSECT | 1 | 将指定区域保留(取交集)。 |  | 3826 3827> **说明:** 3828> 3829> 示意图展示的是以INTERSECT方式裁剪一个矩形后,使用不同枚举值在此基础上裁剪一个圆形的结果,其中绿色区域为最终得到的裁剪区域。 3830 3831## FilterMode<sup>12+</sup> 3832 3833过滤模式枚举。 3834 3835**系统能力**:SystemCapability.Graphics.Drawing 3836 3837| 名称 | 值 | 说明 | 3838| ------------------- | ---- | ------- | 3839| FILTER_MODE_NEAREST | 0 | 邻近过滤模式。 | 3840| FILTER_MODE_LINEAR | 1 | 线性过滤模式。 | 3841 3842## PathDirection<sup>12+</sup> 3843 3844添加闭合轮廓方向的枚举。 3845 3846**系统能力**:SystemCapability.Graphics.Drawing 3847 3848| 名称 | 值 | 说明 | 3849| ------------------- | ---- | ------- | 3850| CLOCKWISE | 0 | 顺时针方向添加闭合轮廓。 | 3851| COUNTER_CLOCKWISE | 1 | 逆时针方向添加闭合轮廓。 | 3852 3853## PathFillType<sup>12+</sup> 3854 3855定义路径的填充类型枚举。 3856 3857**系统能力**:SystemCapability.Graphics.Drawing 3858 3859| 名称 | 值 | 说明 | 3860| ------------------- | ---- | ------- | 3861| WINDING | 0 | 绘制区域中的任意一点,向任意方向射出一条射线,对于射线和路径的所有交点,初始计数为0,遇到每个顺时针的交点(路径从射线的左边向右穿过),计数加1,遇到每个逆时针的交点(路径从射线的右边向左穿过),计数减1,若最终的计数结果不为0,则认为这个点在路径内部,需要被涂色;若计数为0则不被涂色。 | 3862| EVEN_ODD | 1 | 绘制区域中的任意一点,向任意方向射出一条射线,若这条射线和路径相交的次数是奇数,则这个点被认为在路径内部,需要被涂色;若是偶数则不被涂色。 | 3863| INVERSE_WINDING | 2 | WINDING涂色规则取反。 | 3864| INVERSE_EVEN_ODD | 3 | EVEN_ODD涂色规则取反。 | 3865 3866> **说明:**<br> 3867> <br> 3868> 如图所示圆环为路径,箭头指示路径的方向,p为区域内任意一点,蓝色线条为点p出发的射线,黑色箭头所指为对应填充规则下使用蓝色填充路径的结果。WINDING填充规则下,射线与路径的交点计数为2,不为0,点p被涂色;EVEN_ODD填充规则下,射线与路径的相交次数为2,是偶数,点p不被涂色。 3869 3870## PointMode<sup>12+</sup> 3871 3872绘制数组点的方式的枚举。 3873 3874**系统能力**:SystemCapability.Graphics.Drawing 3875 3876| 名称 | 值 | 说明 | 3877| ------------------ | ---- | ------------- | 3878| POINTS | 0 | 分别绘制每个点。 | 3879| LINES | 1 | 将每对点绘制为线段。 | 3880| POLYGON | 2 | 将点阵列绘制为开放多边形。 | 3881 3882## FontEdging<sup>12+</sup> 3883 3884字型边缘效果类型枚举。 3885 3886**系统能力**:SystemCapability.Graphics.Drawing 3887 3888| 名称 | 值 | 说明 | 3889| ------------------- | ---- | ------- | 3890| ALIAS | 0 | 无抗锯齿处理。 | 3891| ANTI_ALIAS | 1 | 使用抗锯齿来平滑字型边缘。 | 3892| SUBPIXEL_ANTI_ALIAS | 2 | 使用次像素级别的抗锯齿来平滑字型边缘,可以获得更加平滑的字型渲染效果。 | 3893 3894## FontHinting<sup>12+</sup> 3895 3896字型轮廓效果类型枚举。 3897 3898**系统能力**:SystemCapability.Graphics.Drawing 3899 3900| 名称 | 值 | 说明 | 3901| ------------------- | ---- | ------- | 3902| NONE | 0 | 不修改字型轮廓。 | 3903| SLIGHT | 1 | 最小限度修改字型轮廓以改善对比度。 | 3904| NORMAL | 2 | 修改字型轮廓以提高对比度。 | 3905| FULL | 3 | 修改字型轮廓以获得最大对比度。 | 3906 3907## TextBlob 3908 3909由一个或多个具有相同字体的字符组成的字块。 3910 3911### makeFromPosText<sup>12+</sup> 3912 3913static makeFromPosText(text: string, len: number, points: common2D.Point[], font: Font): TextBlob 3914 3915使用文本创建TextBlob对象,TextBlob对象中每个字形的坐标由points中对应的坐标信息决定。 3916 3917**系统能力**:SystemCapability.Graphics.Drawing 3918 3919**参数:** 3920 3921| 参数名 | 类型 | 必填 | 说明 | 3922| -------- | ----------------------------- | ---- | -------------------------------------- | 3923| text | string | 是 | 绘制字形的文本内容。 | 3924| len | number | 是 | 字形个数,由[countText](#counttext12)获取,该参数为整数。 | 3925| points |[common2D.Point](js-apis-graphics-common2D.md#point)[] | 是 |点数组,用于指定每个字形的坐标,长度必须为len。| 3926| font | [Font](#font) | 是 | 字型对象。 | 3927 3928**返回值:** 3929 3930| 类型 | 说明 | 3931| --------------------- | -------------- | 3932| [TextBlob](#textblob) | TextBlob对象。 | 3933 3934 3935**错误码:** 3936 3937以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 3938 3939| 错误码ID | 错误信息 | 3940| ------- | --------------------------------------------| 3941| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types. | 3942 3943**示例:** 3944 3945```ts 3946import { RenderNode } from '@kit.ArkUI'; 3947import { drawing,common2D} from '@kit.ArkGraphics2D'; 3948 3949class DrawingRenderNode extends RenderNode { 3950 draw(context : DrawContext) { 3951 const canvas = context.canvas; 3952 let text : string = 'makeFromPosText'; 3953 let font : drawing.Font = new drawing.Font(); 3954 font.setSize(100); 3955 let length = font.countText(text); 3956 let points : common2D.Point[] = []; 3957 for (let i = 0; i !== length; ++i) { 3958 points.push({ x: i * 35, y: i * 35 }); 3959 } 3960 let textblob : drawing.TextBlob =drawing.TextBlob.makeFromPosText(text, points.length, points, font); 3961 canvas.drawTextBlob(textblob, 100, 100); 3962 } 3963} 3964``` 3965 3966### uniqueID<sup>12+</sup> 3967 3968uniqueID(): number 3969 3970获取文本的标识符,该标识符是唯一的非零值。 3971 3972**系统能力**:SystemCapability.Graphics.Drawing 3973 3974**返回值:** 3975 3976| 类型 | 说明 | 3977| --------------------- | -------------- | 3978| number | 返回TextBlob对象的唯一标识符。 | 3979 3980**示例:** 3981 3982```ts 3983import {drawing} from "@kit.ArkGraphics2D" 3984let text : string = 'TextBlobUniqueId'; 3985let font : drawing.Font = new drawing.Font(); 3986font.setSize(100); 3987let textBlob = drawing.TextBlob.makeFromString(text, font, 0); 3988let id = textBlob.uniqueID(); 3989console.info("uniqueID---------------" +id); 3990``` 3991 3992### makeFromString 3993 3994static makeFromString(text: string, font: Font, encoding?: TextEncoding): TextBlob 3995 3996将string类型的值转化成TextBlob对象。 3997 3998**系统能力**:SystemCapability.Graphics.Drawing 3999 4000**参数:** 4001 4002| 参数名 | 类型 | 必填 | 说明 | 4003| -------- | ----------------------------- | ---- | -------------------------------------- | 4004| text | string | 是 | 绘制字形的文本内容。 | 4005| font | [Font](#font) | 是 | 字型对象。 | 4006| encoding | [TextEncoding](#textencoding) | 否 | 编码类型,默认值为TEXT_ENCODING_UTF8。当前只有TEXT_ENCODING_UTF8生效,其余编码类型也会被视为TEXT_ENCODING_UTF8。 | 4007 4008**返回值:** 4009 4010| 类型 | 说明 | 4011| --------------------- | -------------- | 4012| [TextBlob](#textblob) | TextBlob对象。 | 4013 4014**错误码:** 4015 4016以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 4017 4018| 错误码ID | 错误信息 | 4019| ------- | --------------------------------------------| 4020| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 4021 4022**示例:** 4023 4024```ts 4025import { RenderNode } from '@kit.ArkUI'; 4026import { drawing } from '@kit.ArkGraphics2D'; 4027class DrawingRenderNode extends RenderNode { 4028 draw(context : DrawContext) { 4029 const canvas = context.canvas; 4030 const brush = new drawing.Brush(); 4031 brush.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 4032 const font = new drawing.Font(); 4033 font.setSize(20); 4034 const textBlob = drawing.TextBlob.makeFromString("drawing", font, drawing.TextEncoding.TEXT_ENCODING_UTF8); 4035 canvas.attachBrush(brush); 4036 canvas.drawTextBlob(textBlob, 20, 20); 4037 canvas.detachBrush(); 4038 } 4039} 4040``` 4041 4042### makeFromRunBuffer 4043 4044static makeFromRunBuffer(pos: Array\<TextBlobRunBuffer>, font: Font, bounds?: common2D.Rect): TextBlob 4045 4046基于RunBuffer信息创建一个Textblob对象。 4047 4048**系统能力**:SystemCapability.Graphics.Drawing 4049 4050**参数:** 4051 4052| 参数名 | 类型 | 必填 | 说明 | 4053| ------ | -------------------------------------------------- | ---- | ------------------------------ | 4054| pos | Array\<[TextBlobRunBuffer](#textblobrunbuffer)> | 是 | TextBlobRunBuffer数组。 | 4055| font | [Font](#font) | 是 | 字型对象。 | 4056| bounds | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 否 | 可选,如果不设置,则无边界框。 | 4057 4058**返回值:** 4059 4060| 类型 | 说明 | 4061| --------------------- | -------------- | 4062| [TextBlob](#textblob) | TextBlob对象。 | 4063 4064**错误码:** 4065 4066以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 4067 4068| 错误码ID | 错误信息 | 4069| ------- | --------------------------------------------| 4070| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 4071 4072**示例:** 4073 4074```ts 4075import { RenderNode } from '@kit.ArkUI'; 4076import { common2D, drawing } from '@kit.ArkGraphics2D'; 4077class DrawingRenderNode extends RenderNode { 4078 draw(context : DrawContext) { 4079 const canvas = context.canvas; 4080 const font = new drawing.Font(); 4081 font.setSize(20); 4082 let runBuffer : Array<drawing.TextBlobRunBuffer> = [ 4083 { glyph: 65, positionX: 0, positionY: 0 }, 4084 { glyph: 227, positionX: 14.9, positionY: 0 }, 4085 { glyph: 283, positionX: 25.84, positionY: 0 }, 4086 { glyph: 283, positionX: 30.62, positionY: 0 }, 4087 { glyph: 299, positionX: 35.4, positionY: 0} 4088 ]; 4089 const textBlob = drawing.TextBlob.makeFromRunBuffer(runBuffer, font, null); 4090 const brush = new drawing.Brush(); 4091 brush.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 4092 canvas.attachBrush(brush); 4093 canvas.drawTextBlob(textBlob, 20, 20); 4094 canvas.detachBrush(); 4095 } 4096} 4097``` 4098 4099### bounds 4100 4101bounds(): common2D.Rect 4102 4103获取文字边界框的矩形区域。 4104 4105**系统能力**:SystemCapability.Graphics.Drawing 4106 4107**返回值:** 4108 4109| 类型 | 说明 | 4110| -------------------------------------------------- | ---------------------- | 4111| [common2D.Rect](js-apis-graphics-common2D.md#rect) | 文字边界框的矩形区域。 | 4112 4113**示例:** 4114 4115```ts 4116import { common2D, drawing } from '@kit.ArkGraphics2D'; 4117const font = new drawing.Font(); 4118font.setSize(20); 4119const textBlob = drawing.TextBlob.makeFromString("drawing", font, drawing.TextEncoding.TEXT_ENCODING_UTF8); 4120let bounds = textBlob.bounds(); 4121``` 4122 4123## Typeface 4124 4125字体,如宋体、楷体等。 4126 4127### getFamilyName 4128 4129getFamilyName(): string 4130 4131获取字体的系列名称。 4132 4133**系统能力**:SystemCapability.Graphics.Drawing 4134 4135**返回值:** 4136 4137| 类型 | 说明 | 4138| ------ | -------------------- | 4139| string | 返回字体的系列名称。 | 4140 4141**示例:** 4142 4143```ts 4144import { drawing } from '@kit.ArkGraphics2D'; 4145const font = new drawing.Font(); 4146let typeface = font.getTypeface(); 4147let familyName = typeface.getFamilyName(); 4148``` 4149 4150### makeFromFile<sup>12+</sup> 4151 4152static makeFromFile(filePath: string): Typeface 4153 4154从指定字体文件,构造字体。 4155 4156**系统能力**:SystemCapability.Graphics.Drawing 4157 4158**参数:** 4159 4160| 参数名 | 类型 | 必填 | 说明 | 4161| ----------- | ---------------------------------------- | ---- | ------------------- | 4162| filePath | string | 是 | 表示字体资源存放的路径。应用沙箱路径和真实物理路径的对应关系请参考[应用沙箱路径和真实物理路径的对应关系](../../file-management/app-sandbox-directory.md#应用沙箱路径和真实物理路径的对应关系)。 | 4163 4164**返回值:** 4165 4166| 类型 | 说明 | 4167| ------ | -------------------- | 4168| [Typeface](#typeface) | 返回Typeface对象。 | 4169 4170**错误码:** 4171 4172以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 4173 4174| 错误码ID | 错误信息 | 4175| ------- | --------------------------------------------| 4176| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 4177 4178**示例:** 4179 4180```ts 4181import { RenderNode } from '@kit.ArkUI'; 4182import { drawing } from '@kit.ArkGraphics2D'; 4183class TextRenderNode extends RenderNode { 4184 async draw(context: DrawContext) { 4185 const canvas = context.canvas; 4186 let font = new drawing.Font(); 4187 let str = "/system/fonts/HarmonyOS_Sans_Italic.ttf"; 4188 const mytypeface = drawing.Typeface.makeFromFile(str); 4189 font.setTypeface(mytypeface); 4190 const textBlob = drawing.TextBlob.makeFromString("Hello World", font, drawing.TextEncoding.TEXT_ENCODING_UTF8); 4191 canvas.drawTextBlob(textBlob, 60, 100); 4192 } 4193} 4194``` 4195 4196### makeFromRawFile<sup>18+</sup> 4197 4198static makeFromRawFile(rawfile: Resource): Typeface 4199 4200使用指定字体文件构造字体,其中要求指定的字体文件保存在应用资源文件夹的rawfile路径下。 4201 4202**系统能力**:SystemCapability.Graphics.Drawing 4203 4204**参数:** 4205 4206| 参数名 | 类型 | 必填 | 说明 | 4207| ----------- | ---------------------------------------- | ---- | ------------------- | 4208| 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')``。 | 4209 4210**返回值:** 4211 4212| 类型 | 说明 | 4213| ------ | -------------------- | 4214| [Typeface](#typeface) | 返回Typeface对象(异常情况下会返回空指针)。 | 4215 4216**示例:** 4217 4218```ts 4219import { RenderNode } from '@kit.ArkUI'; 4220import { drawing } from '@kit.ArkGraphics2D'; 4221class TextRenderNode extends RenderNode { 4222 async draw(context: DrawContext) { 4223 const canvas = context.canvas; 4224 let font = new drawing.Font(); 4225 const mytypeface = drawing.Typeface.makeFromRawFile($rawfile('HarmonyOS_Sans_Bold.ttf')); 4226 font.setTypeface(mytypeface); 4227 const textBlob = drawing.TextBlob.makeFromString("Hello World", font, drawing.TextEncoding.TEXT_ENCODING_UTF8); 4228 canvas.drawTextBlob(textBlob, 60, 100); 4229 } 4230} 4231``` 4232 4233## Font 4234 4235描述字形绘制时所使用的属性,如大小、字体等。 4236 4237### isSubpixel<sup>12+</sup> 4238 4239isSubpixel(): boolean 4240 4241获取字型是否使用次像素渲染。 4242 4243**系统能力:** SystemCapability.Graphics.Drawing 4244 4245**返回值:** 4246 4247| 类型 | 说明 | 4248| ------ | -------------------- | 4249| boolean | 返回字型是否使用次像素渲染的结果,true表示使用,false表示不使用。 | 4250 4251**示例:** 4252 4253```ts 4254import {drawing} from '@kit.ArkGraphics2D'; 4255let font: drawing.Font = new drawing.Font(); 4256font.enableSubpixel(true) 4257console.info("values=" + font.isSubpixel()); 4258``` 4259 4260### isLinearMetrics<sup>12+</sup> 4261 4262isLinearMetrics(): boolean 4263 4264获取字型是否可以线性缩放。 4265 4266**系统能力:** SystemCapability.Graphics.Drawing 4267 4268**返回值:** 4269 4270| 类型 | 说明 | 4271| ------ | -------------------- | 4272| boolean | 返回字型是否可线性缩放的结果,true表示可线性缩放,false表示不可线性缩放。 | 4273 4274**示例:** 4275 4276```ts 4277import {drawing} from '@kit.ArkGraphics2D'; 4278let font: drawing.Font = new drawing.Font(); 4279font.enableLinearMetrics(true) 4280console.info("values=" + font.isLinearMetrics()); 4281``` 4282 4283### getSkewX<sup>12+</sup> 4284 4285getSkewX(): number 4286 4287获取字型在x轴方向上的倾斜度。 4288 4289**系统能力:** SystemCapability.Graphics.Drawing 4290 4291**返回值:** 4292 4293| 类型 | 说明 | 4294| ------ | -------------------- | 4295| number | 返回字型在x轴方向上的倾斜度。 | 4296 4297**示例:** 4298 4299```ts 4300import {drawing} from '@kit.ArkGraphics2D'; 4301let font: drawing.Font = new drawing.Font(); 4302font.setSkewX(-1) 4303console.info("values=" + font.getSkewX()); 4304``` 4305 4306### isEmbolden<sup>12+</sup> 4307 4308isEmbolden(): boolean 4309 4310获取字型是否设置了粗体效果。 4311 4312**系统能力:** SystemCapability.Graphics.Drawing 4313 4314**返回值:** 4315 4316| 类型 | 说明 | 4317| ------ | -------------------- | 4318| boolean | 返回字型是否设置粗体效果的结果,true表示设置了粗体效果,false表示未设置粗体效果。 | 4319 4320**示例:** 4321 4322```ts 4323import {drawing} from '@kit.ArkGraphics2D'; 4324let font: drawing.Font = new drawing.Font(); 4325font.enableEmbolden(true); 4326console.info("values=" + font.isEmbolden()); 4327``` 4328 4329### getScaleX<sup>12+</sup> 4330 4331getScaleX(): number 4332 4333获取字型在x轴方向上的缩放比例。 4334 4335**系统能力:** SystemCapability.Graphics.Drawing 4336 4337**返回值:** 4338 4339| 类型 | 说明 | 4340| ------ | -------------------- | 4341| number | 返回字型在x轴方向上的缩放比例。 | 4342 4343**示例:** 4344 4345```ts 4346import {drawing} from '@kit.ArkGraphics2D'; 4347let font: drawing.Font = new drawing.Font(); 4348font.setScaleX(2); 4349console.info("values=" + font.getScaleX()); 4350``` 4351 4352### getHinting<sup>12+</sup> 4353 4354getHinting(): FontHinting 4355 4356获取字型轮廓效果。 4357 4358**系统能力:** SystemCapability.Graphics.Drawing 4359 4360**返回值:** 4361 4362| 类型 | 说明 | 4363| ------ | -------------------- | 4364| [FontHinting](#fonthinting12) | 返回字型轮廓效果。 | 4365 4366**示例:** 4367 4368```ts 4369import {drawing} from '@kit.ArkGraphics2D'; 4370let font: drawing.Font = new drawing.Font(); 4371console.info("values=" + font.getHinting()); 4372``` 4373 4374### getEdging<sup>12+</sup> 4375 4376getEdging(): FontEdging 4377 4378获取字型边缘效果。 4379 4380**系统能力:** SystemCapability.Graphics.Drawing 4381 4382**返回值:** 4383 4384| 类型 | 说明 | 4385| ------ | -------------------- | 4386| [FontEdging](#fontedging12) | 返回字型边缘效果。 | 4387 4388**示例:** 4389 4390```ts 4391import {drawing} from '@kit.ArkGraphics2D'; 4392let font: drawing.Font = new drawing.Font(); 4393console.info("values=" + font.getEdging()); 4394``` 4395 4396### enableSubpixel 4397 4398enableSubpixel(isSubpixel: boolean): void 4399 4400使能字体亚像素级别的文字绘制,显示效果平滑。 4401 4402**系统能力**:SystemCapability.Graphics.Drawing 4403 4404**参数:** 4405 4406| 参数名 | 类型 | 必填 | 说明 | 4407| ---------- | ------- | ---- | ------------------------------------------------------------ | 4408| isSubpixel | boolean | 是 | 表示是否使能字体亚像素级别的文字绘制。true表示使能,false表示不使能。 | 4409 4410**错误码:** 4411 4412以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 4413 4414| 错误码ID | 错误信息 | 4415| ------- | --------------------------------------------| 4416| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 4417 4418**示例:** 4419 4420```ts 4421import { drawing } from '@kit.ArkGraphics2D'; 4422let font = new drawing.Font(); 4423font.enableSubpixel(true); 4424``` 4425 4426### enableEmbolden 4427 4428enableEmbolden(isEmbolden: boolean): void 4429 4430使能字体粗体。 4431 4432**系统能力**:SystemCapability.Graphics.Drawing 4433 4434**参数:** 4435 4436| 参数名 | 类型 | 必填 | 说明 | 4437| ---------- | ------- | ---- | ----------------------------------------------------- | 4438| isEmbolden | boolean | 是 | 表示是否使能字体粗体。true表示使能,false表示不使能。 | 4439 4440**错误码:** 4441 4442以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 4443 4444| 错误码ID | 错误信息 | 4445| ------- | --------------------------------------------| 4446| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 4447 4448**示例:** 4449 4450```ts 4451import { drawing } from '@kit.ArkGraphics2D'; 4452let font = new drawing.Font(); 4453font.enableEmbolden(true); 4454``` 4455 4456### enableLinearMetrics 4457 4458enableLinearMetrics(isLinearMetrics: boolean): void 4459 4460使能字型的线性缩放。 4461 4462**系统能力**:SystemCapability.Graphics.Drawing 4463 4464**参数:** 4465 4466| 参数名 | 类型 | 必填 | 说明 | 4467| --------------- | ------- | ---- | ----------------------------------------------------------- | 4468| isLinearMetrics | boolean | 是 | 表示是否使能字型的线性缩放。true表示使能,false表示不使能。 | 4469 4470**错误码:** 4471 4472以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 4473 4474| 错误码ID | 错误信息 | 4475| ------- | --------------------------------------------| 4476| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 4477 4478**示例:** 4479 4480```ts 4481import { drawing } from '@kit.ArkGraphics2D'; 4482let font = new drawing.Font(); 4483font.enableLinearMetrics(true); 4484``` 4485 4486### setSize 4487 4488setSize(textSize: number): void 4489 4490设置字体大小。 4491 4492**系统能力**:SystemCapability.Graphics.Drawing 4493 4494**参数:** 4495 4496| 参数名 | 类型 | 必填 | 说明 | 4497| -------- | ------ | ---- | ---------------- | 4498| textSize | number | 是 | 字体大小,该参数为浮点数,为负数时字体大小会被置为0。字体大小为0时,绘制的文字不会显示。| 4499 4500**错误码:** 4501 4502以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 4503 4504| 错误码ID | 错误信息 | 4505| ------- | --------------------------------------------| 4506| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 4507 4508**示例:** 4509 4510```ts 4511import { drawing } from '@kit.ArkGraphics2D'; 4512let font = new drawing.Font(); 4513font.setSize(5); 4514``` 4515 4516### getSize 4517 4518getSize(): number 4519 4520获取字体大小。 4521 4522**系统能力**:SystemCapability.Graphics.Drawing 4523 4524**返回值:** 4525 4526| 类型 | 说明 | 4527| ------ | ---------------- | 4528| number | 字体大小,浮点数。 | 4529 4530**示例:** 4531 4532```ts 4533import { drawing } from '@kit.ArkGraphics2D'; 4534let font = new drawing.Font(); 4535font.setSize(5); 4536let fontSize = font.getSize(); 4537``` 4538 4539### setTypeface 4540 4541setTypeface(typeface: Typeface): void 4542 4543设置字体。 4544 4545**系统能力**:SystemCapability.Graphics.Drawing 4546 4547**参数:** 4548 4549| 参数名 | 类型 | 必填 | 说明 | 4550| -------- | --------------------- | ---- | ------ | 4551| typeface | [Typeface](#typeface) | 是 | 字体。 | 4552 4553**错误码:** 4554 4555以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 4556 4557| 错误码ID | 错误信息 | 4558| ------- | --------------------------------------------| 4559| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 4560 4561**示例:** 4562 4563```ts 4564import { drawing } from '@kit.ArkGraphics2D'; 4565let font = new drawing.Font(); 4566font.setTypeface(new drawing.Typeface()); 4567``` 4568 4569### getTypeface 4570 4571getTypeface(): Typeface 4572 4573获取字体。 4574 4575**系统能力**:SystemCapability.Graphics.Drawing 4576 4577**返回值:** 4578 4579| 类型 | 说明 | 4580| --------------------- | ------ | 4581| [Typeface](#typeface) | 字体。 | 4582 4583**示例:** 4584 4585```ts 4586import { drawing } from '@kit.ArkGraphics2D'; 4587let font = new drawing.Font(); 4588let typeface = font.getTypeface(); 4589``` 4590 4591### getMetrics 4592 4593getMetrics(): FontMetrics 4594 4595获取与字体关联的FontMetrics属性。 4596 4597**系统能力**:SystemCapability.Graphics.Drawing 4598 4599**返回值:** 4600 4601| 类型 | 说明 | 4602| --------------------------- | ----------------- | 4603| [FontMetrics](#fontmetrics) | FontMetrics属性。 | 4604 4605**示例:** 4606 4607```ts 4608import { drawing } from '@kit.ArkGraphics2D'; 4609let font = new drawing.Font(); 4610let metrics = font.getMetrics(); 4611``` 4612 4613### measureText 4614 4615measureText(text: string, encoding: TextEncoding): number 4616 4617测量文本的宽度。 4618 4619> **说明:** 4620> 4621> 此接口用于测量原始字符串的文本宽度,若想测量排版后的文本宽度,建议使用[measure.measureText](../apis-arkui/js-apis-measure.md#measuretextmeasuretext)替代。 4622 4623**系统能力**:SystemCapability.Graphics.Drawing 4624 4625**参数:** 4626 4627| 参数名 | 类型 | 必填 | 说明 | 4628| -------- | ----------------------------- | ---- | ---------- | 4629| text | string | 是 | 文本内容。 | 4630| encoding | [TextEncoding](#textencoding) | 是 | 编码格式。 | 4631 4632**返回值:** 4633 4634| 类型 | 说明 | 4635| ------ | ---------------- | 4636| number | 文本的宽度,浮点数。 | 4637 4638**错误码:** 4639 4640以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 4641 4642| 错误码ID | 错误信息 | 4643| ------- | --------------------------------------------| 4644| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 4645 4646**示例:** 4647 4648```ts 4649import { drawing } from '@kit.ArkGraphics2D'; 4650let font = new drawing.Font(); 4651font.measureText("drawing", drawing.TextEncoding.TEXT_ENCODING_UTF8); 4652``` 4653 4654### measureSingleCharacter<sup>12+</sup> 4655 4656measureSingleCharacter(text: string): number 4657 4658用于测量单个字符的宽度。当前字型中的字体不支持待测量字符时,退化到使用系统字体测量字符宽度。 4659 4660**系统能力**:SystemCapability.Graphics.Drawing 4661 4662**参数** 4663 4664| 参数名 | 类型 | 必填 | 说明 | 4665| ------ | ------------------- | ---- | ----------- | 4666| text | string | 是 | 待测量的单个字符,字符串的长度必须为1。 | 4667 4668**返回值:** 4669 4670| 类型 | 说明 | 4671| ------ | ---------------- | 4672| number | 字符的宽度,浮点数。 | 4673 4674**错误码:** 4675 4676以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 4677 4678| 错误码ID | 错误信息 | 4679| ------- | --------------------------------------------| 4680| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 4681 4682**示例** 4683 4684```ts 4685import { RenderNode } from '@kit.ArkUI'; 4686import { drawing } from '@kit.ArkGraphics2D'; 4687 4688class DrawingRenderNode extends RenderNode { 4689 draw(context : DrawContext) { 4690 const canvas = context.canvas; 4691 const font = new drawing.Font(); 4692 font.setSize(20); 4693 let width = font.measureSingleCharacter("你"); 4694 } 4695} 4696``` 4697 4698### setScaleX<sup>12+</sup> 4699 4700setScaleX(scaleX: number): void 4701 4702用于设置字型对象在x轴上的缩放比例。 4703 4704**系统能力**:SystemCapability.Graphics.Drawing 4705 4706**参数:** 4707 4708| 参数名 | 类型 | 必填 | 说明 | 4709| -------- | ----------------------------- | ---- | ---------- | 4710| scaleX | number | 是 | 文本在x轴上的缩放比例,该参数为浮点数。 | 4711 4712**错误码:** 4713 4714以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 4715 4716| 错误码ID | 错误信息 | 4717| ------- | --------------------------------------------| 4718| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 4719 4720**示例:** 4721 4722```ts 4723import { RenderNode } from '@kit.ArkUI'; 4724import { common2D, drawing } from '@kit.ArkGraphics2D'; 4725class DrawingRenderNode extends RenderNode { 4726 draw(context : DrawContext) { 4727 const canvas = context.canvas; 4728 const pen = new drawing.Pen(); 4729 pen.setStrokeWidth(5); 4730 pen.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 4731 canvas.attachPen(pen); 4732 let font = new drawing.Font(); 4733 font.setSize(100); 4734 font.setScaleX(2); 4735 const textBlob = drawing.TextBlob.makeFromString("hello", font, drawing.TextEncoding.TEXT_ENCODING_UTF8); 4736 canvas.drawTextBlob(textBlob, 200, 200); 4737 } 4738} 4739``` 4740 4741### setSkewX<sup>12+</sup> 4742 4743setSkewX(skewX: number): void 4744 4745用于设置字型对象在x轴上的倾斜比例。 4746 4747**系统能力**:SystemCapability.Graphics.Drawing 4748 4749**参数:** 4750 4751| 参数名 | 类型 | 必填 | 说明 | 4752| -------- | ----------------------------- | ---- | ---------- | 4753| skewX | number | 是 | 文本在x轴上的倾斜比例,正数表示往左边倾斜,负数表示往右边倾斜,该参数为浮点数。 | 4754 4755**错误码:** 4756 4757以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 4758 4759| 错误码ID | 错误信息 | 4760| ------- | --------------------------------------------| 4761| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 4762 4763**示例:** 4764 4765```ts 4766import { RenderNode } from '@kit.ArkUI'; 4767import { common2D, drawing } from '@kit.ArkGraphics2D'; 4768class DrawingRenderNode extends RenderNode { 4769 draw(context : DrawContext) { 4770 const canvas = context.canvas; 4771 const pen = new drawing.Pen(); 4772 pen.setStrokeWidth(5); 4773 pen.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 4774 canvas.attachPen(pen); 4775 let font = new drawing.Font(); 4776 font.setSize(100); 4777 font.setSkewX(1); 4778 const textBlob = drawing.TextBlob.makeFromString("hello", font, drawing.TextEncoding.TEXT_ENCODING_UTF8); 4779 canvas.drawTextBlob(textBlob, 200, 200); 4780 } 4781} 4782``` 4783 4784### setEdging<sup>12+</sup> 4785 4786setEdging(edging: FontEdging): void 4787 4788设置字型边缘效果。 4789 4790**系统能力**:SystemCapability.Graphics.Drawing 4791 4792**参数:** 4793 4794| 参数名 | 类型 | 必填 | 说明 | 4795| -------- | ----------------------------- | ---- | ---------- | 4796| edging | [FontEdging](#fontedging12) | 是 | 字型边缘效果。 | 4797 4798**错误码:** 4799 4800以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 4801 4802| 错误码ID | 错误信息 | 4803| ------- | --------------------------------------------| 4804| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types; 3. Parameter verification failed. | 4805 4806**示例:** 4807 4808```ts 4809import { drawing } from '@kit.ArkGraphics2D'; 4810 4811let font = new drawing.Font(); 4812font.setEdging(drawing.FontEdging.SUBPIXEL_ANTI_ALIAS); 4813``` 4814 4815### setHinting<sup>12+</sup> 4816 4817setHinting(hinting: FontHinting): void 4818 4819设置字型轮廓效果。 4820 4821**系统能力**:SystemCapability.Graphics.Drawing 4822 4823**参数:** 4824 4825| 参数名 | 类型 | 必填 | 说明 | 4826| -------- | ----------------------------- | ---- | ---------- | 4827| hinting | [FontHinting](#fonthinting12) | 是 | 字型轮廓效果。 | 4828 4829**错误码:** 4830 4831以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 4832 4833| 错误码ID | 错误信息 | 4834| ------- | --------------------------------------------| 4835| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types; 3. Parameter verification failed. | 4836 4837**示例:** 4838 4839```ts 4840import { drawing } from '@kit.ArkGraphics2D'; 4841 4842let font = new drawing.Font(); 4843font.setHinting(drawing.FontHinting.FULL); 4844``` 4845 4846### countText<sup>12+</sup> 4847 4848countText(text: string): number 4849 4850获取文本所表示的字符数量。 4851 4852**系统能力**:SystemCapability.Graphics.Drawing 4853 4854**参数:** 4855 4856| 参数名 | 类型 | 必填 | 说明 | 4857| -------- | ----------------------------- | ---- | ---------- | 4858| text | string | 是 | 文本内容。 | 4859 4860**返回值:** 4861 4862| 类型 | 说明 | 4863| ------ | ---------------- | 4864| number | 返回文本所表示的字符数量,整数。 | 4865 4866**错误码:** 4867 4868以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 4869 4870| 错误码ID | 错误信息 | 4871| ------- | --------------------------------------------| 4872| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 4873 4874**示例:** 4875 4876```ts 4877import { drawing } from '@kit.ArkGraphics2D'; 4878 4879let font = new drawing.Font(); 4880let resultNumber: number = font.countText('ABCDE'); 4881console.info("count text number: " + resultNumber); 4882``` 4883 4884### setBaselineSnap<sup>12+</sup> 4885 4886setBaselineSnap(isBaselineSnap: boolean): void 4887 4888当前画布矩阵轴对齐时,设置字型基线是否与像素对齐。 4889 4890**系统能力**:SystemCapability.Graphics.Drawing 4891 4892**参数:** 4893 4894| 参数名 | 类型 | 必填 | 说明 | 4895| --------------- | ------- | ---- | ---------------------------------------- | 4896| isBaselineSnap | boolean | 是 | 指示字型基线是否和像素对齐,true表示对齐,false表示不对齐。 | 4897 4898**错误码:** 4899 4900以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 4901 4902| 错误码ID | 错误信息 | 4903| ------- | --------------------------------------------| 4904| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 4905 4906**示例:** 4907 4908```ts 4909import { drawing } from '@kit.ArkGraphics2D'; 4910 4911let font : drawing.Font = new drawing.Font(); 4912font.setBaselineSnap(true); 4913console.info("drawing font isBaselineSnap: " + font.isBaselineSnap()); 4914``` 4915 4916### isBaselineSnap()<sup>12+</sup> 4917 4918isBaselineSnap(): boolean 4919 4920当前画布矩阵轴对齐时,获取字型基线是否与像素对齐的结果。 4921 4922**系统能力**:SystemCapability.Graphics.Drawing 4923 4924**返回值:** 4925 4926| 类型 | 说明 | 4927| ------ | ---------------- | 4928| boolean | 返回字型基线是否与像素对齐,true为对齐,false为没有对齐。 | 4929 4930**示例:** 4931 4932```ts 4933import { drawing } from '@kit.ArkGraphics2D'; 4934 4935let font : drawing.Font = new drawing.Font(); 4936font.setTypeface(new drawing.Typeface()); 4937font.setBaselineSnap(true); 4938console.info("drawing font isBaselineSnap: " + font.isBaselineSnap()); 4939``` 4940 4941### setEmbeddedBitmaps<sup>12+</sup> 4942 4943setEmbeddedBitmaps(isEmbeddedBitmaps: boolean): void 4944 4945设置字型是否转换成位图处理。 4946 4947**系统能力**:SystemCapability.Graphics.Drawing 4948 4949**参数:** 4950 4951| 参数名 | 类型 | 必填 | 说明 | 4952| -------- | ------ | ---- | ---------------- | 4953| isEmbeddedBitmaps | boolean | 是 | 设置字型是否转换成位图处理,true表示转换成位图处理,false表示不转换成位图处理。 | 4954 4955**错误码:** 4956 4957以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 4958 4959| 错误码ID | 错误信息 | 4960| ------- | --------------------------------------------| 4961| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 4962 4963**示例:** 4964 4965```ts 4966import { drawing } from '@kit.ArkGraphics2D'; 4967 4968let font : drawing.Font = new drawing.Font(); 4969font.setTypeface(new drawing.Typeface()); 4970font.setEmbeddedBitmaps(false); 4971console.info("draw isEmbeddedBitmaps: " + font.isEmbeddedBitmaps()); 4972``` 4973 4974### isEmbeddedBitmaps()<sup>12+</sup> 4975 4976isEmbeddedBitmaps(): boolean 4977 4978获取字型是否转换成位图处理的结果。 4979 4980**系统能力**:SystemCapability.Graphics.Drawing 4981 4982**返回值:** 4983 4984| 类型 | 说明 | 4985| ------ | ---------------- | 4986| boolean | 返回字型是否转换成位图处理结果,true表示转换成位图处理,false表示不转换成位图处理。 | 4987 4988**示例:** 4989 4990```ts 4991import { drawing } from '@kit.ArkGraphics2D'; 4992 4993let font : drawing.Font = new drawing.Font(); 4994font.setTypeface(new drawing.Typeface()); 4995font.setEmbeddedBitmaps(true); 4996console.info("draw isEmbeddedBitmaps: " + font.isEmbeddedBitmaps()); 4997``` 4998 4999### setForceAutoHinting<sup>12+</sup> 5000 5001setForceAutoHinting(isForceAutoHinting: boolean): void 5002 5003设置是否自动调整字型轮廓。 5004 5005**系统能力**:SystemCapability.Graphics.Drawing 5006 5007**参数:** 5008 5009| 参数名 | 类型 | 必填 | 说明 | 5010| -------- | ------ | ---- | ---------------- | 5011| isForceAutoHinting | boolean | 是 | 是否自动调整字型轮廓,true为自动调整,false为不自动调整。 | 5012 5013**错误码:** 5014 5015以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 5016 5017| 错误码ID | 错误信息 | 5018| ------- | --------------------------------------------| 5019| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 5020 5021**示例:** 5022 5023```ts 5024import { drawing } from '@kit.ArkGraphics2D'; 5025 5026let font : drawing.Font = new drawing.Font(); 5027font.setTypeface(new drawing.Typeface()); 5028font.setForceAutoHinting(false); 5029console.info("drawing isForceAutoHinting: " + font.isForceAutoHinting()); 5030``` 5031 5032### isForceAutoHinting<sup>12+</sup> 5033 5034isForceAutoHinting(): boolean 5035 5036获取字型轮廓是否自动调整的结果。 5037 5038**系统能力**:SystemCapability.Graphics.Drawing 5039 5040**返回值:** 5041 5042| 类型 | 说明 | 5043| ------ | ---------------- | 5044| boolean | 返回字型轮廓是否自动调整,true为自动调整,false为不自动调整。 | 5045 5046**示例:** 5047 5048```ts 5049import { drawing } from '@kit.ArkGraphics2D'; 5050 5051let font : drawing.Font = new drawing.Font(); 5052font.setTypeface(new drawing.Typeface()); 5053font.setForceAutoHinting(false); 5054console.info("drawing isForceAutoHinting: " + font.isForceAutoHinting()); 5055``` 5056 5057### getWidths<sup>12+</sup> 5058 5059getWidths(glyphs: Array\<number>): Array\<number> 5060 5061获取字形数组中每个字形对应的宽度。 5062 5063**系统能力**:SystemCapability.Graphics.Drawing 5064 5065**参数:** 5066 5067| 参数名 | 类型 | 必填 | 说明 | 5068| -------- | --------------------- | ---- | ------ | 5069| glyphs | Array\<number> | 是 | 字形索引数组,可由[textToGlyphs](#texttoglyphs12)生成。 | 5070 5071**返回值:** 5072 5073| 类型 | 说明 | 5074| ------ | ---------------- | 5075| Array\<number> | 返回得到的字形宽度数组。 | 5076 5077**错误码:** 5078 5079以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 5080 5081| 错误码ID | 错误信息 | 5082| ------- | --------------------------------------------| 5083| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 5084 5085**示例:** 5086 5087```ts 5088import { drawing } from '@kit.ArkGraphics2D'; 5089 5090let font: drawing.Font = new drawing.Font(); 5091let text: string = 'hello world'; 5092let glyphs: number[] = font.textToGlyphs(text); 5093let fontWidths: Array<number> = font.getWidths(glyphs); 5094for (let index = 0; index < fontWidths.length; index++) { 5095 console.info("get fontWidths[", index, "]:", fontWidths[index]); 5096} 5097``` 5098 5099### textToGlyphs<sup>12+</sup> 5100 5101textToGlyphs(text: string, glyphCount?: number): Array\<number> 5102 5103将文本转换为字形索引。 5104 5105**系统能力**:SystemCapability.Graphics.Drawing 5106 5107**参数:** 5108 5109| 参数名 | 类型 | 必填 | 说明 | 5110| -------- | ----------------------------- | ---- | ---------- | 5111| text | string | 是 | 文本字符串。 | 5112| glyphCount | number | 否 | 文本表示的字符数量,必须与[countText](#counttext12)获取的值相等,默认为text的字符数量,该参数为整数。 | 5113 5114**返回值:** 5115 5116| 类型 | 说明 | 5117| ------ | ---------------- | 5118| Array\<number> | 返回转换得到的字形索引数组。 | 5119 5120**错误码:** 5121 5122以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 5123 5124| 错误码ID | 错误信息 | 5125| ------- | --------------------------------------------| 5126| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 5127 5128**示例:** 5129 5130```ts 5131import { drawing } from '@kit.ArkGraphics2D'; 5132 5133let font : drawing.Font = new drawing.Font(); 5134let text : string = 'hello world'; 5135let glyphs : number[] = font.textToGlyphs(text); 5136console.info("drawing text toglyphs OnTestFunction num = " + glyphs.length ); 5137``` 5138 5139### getBounds<sup>18+</sup> 5140 5141getBounds(glyphs: Array\<number>): Array\<common2D.Rect> 5142 5143获取字形数组中每个字形对应的边界矩形。 5144 5145**系统能力**:SystemCapability.Graphics.Drawing 5146 5147**参数:** 5148 5149| 参数名 | 类型 | 必填 | 说明 | 5150| -------- | --------------------- | ---- | ------ | 5151| glyphs | Array\<number> | 是 | 字形索引数组,可由[textToGlyphs](#texttoglyphs12)生成。 | 5152 5153**返回值:** 5154 5155| 类型 | 说明 | 5156| ------ | ---------------- | 5157| Array\<[common2D.Rect](js-apis-graphics-common2D.md#rect)> | 返回得到的字形边界矩形数组。 | 5158 5159**示例:** 5160 5161```ts 5162import { common2D, drawing } from '@kit.ArkGraphics2D'; 5163 5164let font: drawing.Font = new drawing.Font(); 5165let text: string = 'hello world'; 5166let glyphs: number[] = font.textToGlyphs(text); 5167let fontBounds: Array<common2D.Rect> = font.getBounds(glyphs); 5168for (let index = 0; index < fontBounds.length; index++) { 5169 console.info("get fontWidths[", index, "] left:", fontBounds[index].left, " top:", fontBounds[index].top, 5170 " right:", fontBounds[index].right, " bottom:", fontBounds[index].bottom); 5171} 5172``` 5173 5174### getTextPath<sup>18+</sup> 5175 5176getTextPath(text: string, byteLength: number, x: number, y: number): Path; 5177 5178获取文字的轮廓路径。 5179 5180**系统能力**:SystemCapability.Graphics.Drawing 5181 5182**参数:** 5183 5184| 参数名 | 类型 | 必填 | 说明 | 5185| ------ | ------------------------------------------------ | ---- | ---------------------- | 5186| text | string | 是 | 表示存储UTF-8 文本编码的字符。| 5187|byteLength| number | 是 | 表示要获取对应文本路径的字节长度,按传入的字节长度和实际的文本字节大小之间的最小值来获取对应的文本路径。| 5188| x | number | 是 | 表示文本在绘图区域内以原点为起始位置的X坐标。| 5189| y | number | 是 | 表示文本在绘图区域内以原点为起始位置的Y坐标。| 5190 5191**返回值:** 5192 5193| 类型 | 说明 | 5194| ------ | ---------------- | 5195| [Path](#path) | 返回获取到的文本的路径轮廓。 | 5196 5197**错误码:** 5198 5199以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 5200 5201| 错误码ID | 错误信息 | 5202| ------- | --------------------------------------------| 5203| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 5204 5205**示例:** 5206 5207```ts 5208import { drawing } from '@kit.ArkGraphics2D'; 5209import { buffer } from '@kit.ArkTS'; 5210import { RenderNode } from '@kit.ArkUI'; 5211 5212class DrawingRenderNode extends RenderNode { 5213 draw(context : DrawContext) { 5214 const canvas = context.canvas; 5215 let font = new drawing.Font(); 5216 font.setSize(50) 5217 let myString: string = "你好, HarmonyOS"; 5218 let length = buffer.from(myString).length; 5219 let path = font.getTextPath(myString, length, 0, 100) 5220 canvas.drawPath(path) 5221 } 5222} 5223``` 5224 5225### createPathForGlyph<sup>18+</sup> 5226 5227createPathForGlyph(index: number): Path 5228 5229获取指定字形的路径轮廓。 5230 5231**系统能力**:SystemCapability.Graphics.Drawing 5232 5233**参数:** 5234 5235| 参数名 | 类型 | 必填 | 说明 | 5236| -------- | --------------------- | ---- | ------ | 5237| index | number | 是 | 字形索引。 | 5238 5239**返回值:** 5240 5241| 类型 | 说明 | 5242| ------ | ---------------- | 5243| [Path](#path) | 返回指定字形的路径轮廓。 | 5244 5245**示例:** 5246 5247```ts 5248import { FrameNode, NodeController, RenderNode } from '@kit.ArkUI'; 5249import { drawing } from '@kit.ArkGraphics2D'; 5250 5251class DrawingRenderNode extends RenderNode { 5252 draw(context : DrawContext) { 5253 const canvas = context.canvas; 5254 let font = new drawing.Font(); 5255 font.setSize(50) 5256 let text: string = '你好'; 5257 let glyphs: number[] = font.textToGlyphs(text); 5258 for (let index = 0; index < glyphs.length; index++) { 5259 let path: drawing.Path = font.createPathForGlyph(glyphs[index]) 5260 canvas.drawPath(path) 5261 } 5262 } 5263} 5264``` 5265 5266### setThemeFontFollowed<sup>15+</sup> 5267 5268setThemeFontFollowed(followed: boolean): void 5269 5270设置字型中的字体是否跟随主题字体。设置跟随主题字体后,若系统启用主题字体并且字型未被设置字体,字型会使用该主题字体。 5271 5272**系统能力**:SystemCapability.Graphics.Drawing 5273 5274**参数:** 5275 5276| 参数名 | 类型 | 必填 | 说明 | 5277| -------- | ------ | ---- | ---------------- | 5278| followed | boolean | 是 | 字型中的字体是否跟随主题字体,true表示跟随主题字体,false表示不跟随主题字体。 | 5279 5280**错误码:** 5281 5282以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 5283 5284| 错误码ID | 错误信息 | 5285| ------- | --------------------------------------------| 5286| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 5287 5288**示例:** 5289 5290```ts 5291import { drawing } from '@kit.ArkGraphics2D'; 5292 5293let font : drawing.Font = new drawing.Font(); 5294font.setThemeFontFollowed(true); 5295console.info("font is theme font followed: " + font.isThemeFontFollowed()); 5296``` 5297 5298### isThemeFontFollowed()<sup>15+</sup> 5299 5300isThemeFontFollowed(): boolean 5301 5302获取字型中的字体是否跟随主题字体。默认不跟随主题字体。 5303 5304**系统能力**:SystemCapability.Graphics.Drawing 5305 5306**返回值:** 5307 5308| 类型 | 说明 | 5309| ------ | ---------------- | 5310| boolean | 返回字型中的字体是否跟随主题字体的结果,true表示跟随主题字体,false表示不跟随主题字体。 | 5311 5312**示例:** 5313 5314```ts 5315import { drawing } from '@kit.ArkGraphics2D'; 5316 5317let font : drawing.Font = new drawing.Font(); 5318font.setThemeFontFollowed(true); 5319console.info("font is theme font followed: " + font.isThemeFontFollowed()); 5320``` 5321 5322## FontMetricsFlags<sup>12+</sup> 5323 5324字体度量标志枚举,指示字体度量中的各字段数据是否有效。 5325 5326**系统能力**:SystemCapability.Graphics.Drawing 5327 5328| 名称 | 值 | 说明 | 5329| ----------------------------- | --------- | ------------------------------ | 5330| UNDERLINE_THICKNESS_VALID | 1 << 0 | 表示[FontMetrics](#fontmetrics)结构中的underlineThickness(下划线厚度)字有效。 | 5331| UNDERLINE_POSITION_VALID | 1 << 1 | 表示[FontMetrics](#fontmetrics)结构中的underlinePosition(下划线位置)字段有效。 | 5332| STRIKETHROUGH_THICKNESS_VALID | 1 << 2 | 表示[FontMetrics](#fontmetrics)结构中strikethroughThickness(删除线厚度)是有效的。| 5333| STRIKETHROUGH_POSITION_VALID | 1 << 3 | 表示[FontMetrics](#fontmetrics)结构中strikethroughPosition(删除线位置)字段有效。 | 5334| BOUNDS_INVALID | 1 << 4 | 表示[FontMetrics](#fontmetrics)结构中的边界度量值(如top、bottom、xMin、xMax)无效。 | 5335 5336## FontMetrics 5337 5338描述字形大小和布局的属性信息,同一种字体中的字符属性大致相同。 5339 5340**系统能力:** SystemCapability.Graphics.Drawing 5341 5342| 名称 | 类型 | 只读 | 可选 | 说明 | 5343| ------- | ------ | ---- | ---- | ------------------------------------------------------------ | 5344| flags<sup>12+</sup> | [FontMetricsFlags](#fontmetricsflags12) | 是 | 是 | 表明哪些字体度量标志有效。 | 5345| top | number | 是 | 否 | 文字最高处到基线之间的最大距离,浮点数。 | 5346| ascent | number | 是 | 否 | 文字最高处到基线之间的距离,浮点数。 | 5347| descent | number | 是 | 否 | 基线到文字最低处之间的距离,浮点数。 | 5348| bottom | number | 是 | 否 | 基线到文字最低处之间的最大距离,浮点数。 | 5349| leading | number | 是 | 否 | 行间距,从上一行文字descent到下一行文字ascent之间的距离,浮点数。 | 5350| avgCharWidth<sup>12+</sup> | number | 是 | 是 | 平均字符宽度。 | 5351| maxCharWidth<sup>12+</sup> | number | 是 | 是 | 最大字符宽度。 | 5352| xMin<sup>12+</sup> | number | 是 | 是 | 字体中任意字形边界框最左边沿到原点的水平距离,这个值往往小于零,意味着字形在水平方向上的最小边界。 | 5353| xMax<sup>12+</sup> | number | 是 | 是 | 字体中任意字形边界框最右边沿到原点的水平距离,此值多为正数,指示了字形在水平方向上的最大延伸范围。 | 5354| xHeight<sup>12+</sup> | number | 是 | 是 | 小写字母x的高度,通常为负值。 | 5355| capHeight<sup>12+</sup> | number | 是 | 是 | 大写字母的高度,通常为负值。 | 5356| underlineThickness<sup>12+</sup> | number | 是 | 是 | 下划线的厚度。 | 5357| underlinePosition<sup>12+</sup> | number | 是 | 是 | 文本基线到下划线顶部的垂直距离,通常是正数。 | 5358| strikethroughThickness<sup>12+</sup> | number | 是 | 是 | 文本删除线的厚度,即贯穿文本字符的水平线的宽度。 | 5359| strikethroughPosition<sup>12+</sup> | number | 是 | 是 | 文本基线到底部删除线的垂直距离,通常为负值。 | 5360 5361## ColorFilter 5362 5363颜色滤波器。 5364 5365### createBlendModeColorFilter 5366 5367createBlendModeColorFilter(color: common2D.Color, mode: BlendMode) : ColorFilter 5368 5369使用指定的颜色和混合模式创建颜色滤波器。 5370 5371**系统能力:** SystemCapability.Graphics.Drawing 5372 5373**参数:** 5374 5375| 参数名 | 类型 | 必填 | 说明 | 5376| ------ | ---------------------------------------------------- | ---- | ---------------- | 5377| color | [common2D.Color](js-apis-graphics-common2D.md#color) | 是 | ARGB格式的颜色,每个颜色通道是0到255之间的整数。 | 5378| mode | [BlendMode](#blendmode) | 是 | 颜色的混合模式。 | 5379 5380**返回值:** 5381 5382| 类型 | 说明 | 5383| --------------------------- | ------------------ | 5384| [ColorFilter](#colorfilter) | 返回一个颜色滤波器。 | 5385 5386**错误码:** 5387 5388以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 5389 5390| 错误码ID | 错误信息 | 5391| ------- | --------------------------------------------| 5392| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 5393 5394**示例:** 5395 5396```ts 5397import { common2D, drawing } from '@kit.ArkGraphics2D'; 5398const color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 }; 5399let colorFilter = drawing.ColorFilter.createBlendModeColorFilter(color, drawing.BlendMode.SRC); 5400``` 5401 5402### createBlendModeColorFilter<sup>18+</sup> 5403 5404static createBlendModeColorFilter(color: common2D.Color | number, mode: BlendMode) : ColorFilter 5405 5406使用指定的颜色和混合模式创建颜色滤波器。 5407 5408**系统能力:** SystemCapability.Graphics.Drawing 5409 5410**参数:** 5411 5412| 参数名 | 类型 | 必填 | 说明 | 5413| ------ | ---------------------------------------------------- | ---- | ---------------- | 5414| color | [common2D.Color](js-apis-graphics-common2D.md#color) \| number | 是 | 颜色,可以用16进制ARGB格式的无符号整数表示。 | 5415| mode | [BlendMode](#blendmode) | 是 | 颜色的混合模式。 | 5416 5417**返回值:** 5418 5419| 类型 | 说明 | 5420| --------------------------- | ------------------ | 5421| [ColorFilter](#colorfilter) | 返回一个颜色滤波器。 | 5422 5423**错误码:** 5424 5425以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 5426 5427| 错误码ID | 错误信息 | 5428| ------- | --------------------------------------------| 5429| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 5430 5431**示例:** 5432 5433```ts 5434import { drawing } from '@kit.ArkGraphics2D'; 5435let colorFilter = drawing.ColorFilter.createBlendModeColorFilter(0xffff0000, drawing.BlendMode.SRC); 5436``` 5437 5438### createComposeColorFilter 5439 5440createComposeColorFilter(outer: ColorFilter, inner: ColorFilter) : ColorFilter 5441 5442创建一个先应用inner进行滤波,再应用outer进行滤波的组合颜色滤波器。 5443 5444**系统能力:** SystemCapability.Graphics.Drawing 5445 5446**参数:** 5447 5448| 参数名 | 类型 | 必填 | 说明 | 5449| ------ | --------------------------- | ---- | -------------------------------- | 5450| outer | [ColorFilter](#colorfilter) | 是 | 组合滤波器中后生效的颜色滤波器。 | 5451| inner | [ColorFilter](#colorfilter) | 是 | 组合滤波器中先生效的颜色滤波器。 | 5452 5453**返回值:** 5454 5455| 类型 | 说明 | 5456| --------------------------- | ------------------ | 5457| [ColorFilter](#colorfilter) | 返回一个颜色滤波器。 | 5458 5459**错误码:** 5460 5461以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 5462 5463| 错误码ID | 错误信息 | 5464| ------- | --------------------------------------------| 5465| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 5466 5467**示例:** 5468 5469```ts 5470import { common2D, drawing } from '@kit.ArkGraphics2D'; 5471const color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 }; 5472let colorFilter1 = drawing.ColorFilter.createBlendModeColorFilter(color, drawing.BlendMode.SRC); 5473let colorFilter2 = drawing.ColorFilter.createBlendModeColorFilter(color, drawing.BlendMode.DST); 5474let colorFilter = drawing.ColorFilter.createComposeColorFilter(colorFilter1, colorFilter2); 5475``` 5476 5477### createLinearToSRGBGamma 5478 5479createLinearToSRGBGamma() : ColorFilter 5480 5481创建一个从线性颜色空间转换到SRGB颜色空间的颜色滤波器。 5482 5483**系统能力:** SystemCapability.Graphics.Drawing 5484 5485**返回值:** 5486 5487| 类型 | 说明 | 5488| --------------------------- | ------------------ | 5489| [ColorFilter](#colorfilter) | 返回一个颜色滤波器。 | 5490 5491**示例:** 5492 5493```ts 5494import { drawing } from '@kit.ArkGraphics2D'; 5495let colorFilter = drawing.ColorFilter.createLinearToSRGBGamma(); 5496``` 5497 5498### createSRGBGammaToLinear 5499 5500createSRGBGammaToLinear() : ColorFilter 5501 5502创建一个从SRGB颜色空间转换到线性颜色空间的颜色滤波器。 5503 5504**系统能力:** SystemCapability.Graphics.Drawing 5505 5506**返回值:** 5507 5508| 类型 | 说明 | 5509| --------------------------- | ------------------ | 5510| [ColorFilter](#colorfilter) | 返回一个颜色滤波器。 | 5511 5512**示例:** 5513 5514```ts 5515import { drawing } from '@kit.ArkGraphics2D'; 5516let colorFilter = drawing.ColorFilter.createSRGBGammaToLinear(); 5517``` 5518 5519### createLumaColorFilter 5520 5521createLumaColorFilter() : ColorFilter 5522 5523创建一个颜色滤波器将其输入的亮度值乘以透明度通道,并将红色、绿色和蓝色通道设置为零。 5524 5525**系统能力:** SystemCapability.Graphics.Drawing 5526 5527**返回值:** 5528 5529| 类型 | 说明 | 5530| --------------------------- | ------------------ | 5531| [ColorFilter](#colorfilter) | 返回一个颜色滤波器。 | 5532 5533**示例:** 5534 5535```ts 5536import { drawing } from '@kit.ArkGraphics2D'; 5537let colorFilter = drawing.ColorFilter.createLumaColorFilter(); 5538``` 5539 5540### createMatrixColorFilter<sup>12+</sup> 5541 5542static createMatrixColorFilter(matrix: Array\<number>): ColorFilter 5543 5544创建颜色滤波器,通过4x5颜色矩阵变换颜色。 5545 5546**系统能力:** SystemCapability.Graphics.Drawing 5547 5548**参数:** 5549 5550| 参数名 | 类型 | 必填 | 说明 | 5551| -------- | -------------------------------------------- | ---- | ------------------------------- | 5552| matrix | Array\<number> | 是 | 长度为20的数组,表示用于颜色变换的4*5矩阵。 | 5553 5554**返回值:** 5555 5556| 类型 | 说明 | 5557| --------------------------- | ------------------ | 5558| [ColorFilter](#colorfilter) | 返回一个颜色滤波器。 | 5559 5560**错误码:** 5561 5562以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 5563 5564| 错误码ID | 错误信息 | 5565| ------- | --------------------------------------------| 5566| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 5567 5568**示例:** 5569 5570```ts 5571import { drawing } from '@kit.ArkGraphics2D'; 5572let matrix: Array<number> = [ 5573 1, 0, 0, 0, 0, 5574 0, 1, 0, 0, 0, 5575 0, 0, 100, 0, 0, 5576 0, 0, 0, 1, 0 5577]; 5578let colorFilter = drawing.ColorFilter.createMatrixColorFilter(matrix); 5579``` 5580 5581## JoinStyle<sup>12+</sup> 5582 5583定义线条转角样式的枚举,即画笔在绘制折线段时,在折线转角处的样式。 5584 5585**系统能力:** SystemCapability.Graphics.Drawing 5586 5587| 名称 | 值 | 说明 | 示意图 | 5588| ----------- | ---- | ----------------------------------------------------------- | -------- | 5589| MITER_JOIN | 0 | 转角类型为尖角,如果折线角度比较小,则尖角会很长,需要使用限制值(miter limit)进行限制。 |  | 5590| ROUND_JOIN | 1 | 转角类型为圆头。 |  | 5591| BEVEL_JOIN | 2 | 转角类型为平头。 |  | 5592 5593## CapStyle<sup>12+</sup> 5594 5595定义线帽样式的枚举,即画笔在绘制线段时,在线段头尾端点的样式。 5596 5597**系统能力:** SystemCapability.Graphics.Drawing 5598 5599| 名称 | 值 | 说明 | 示意图 | 5600| ---------- | ---- | ----------------------------------------------------------- | -------- | 5601| FLAT_CAP | 0 | 没有线帽样式,线条头尾端点处横切。 |  | 5602| SQUARE_CAP | 1 | 线帽的样式为方框,线条的头尾端点处多出一个方框,方框宽度和线段一样宽,高度是线段宽度的一半。 |  | 5603| ROUND_CAP | 2 | 线帽的样式为圆弧,线条的头尾端点处多出一个半圆弧,半圆的直径与线段宽度一致。 |  | 5604 5605## BlurType<sup>12+</sup> 5606 5607定义蒙版滤镜模糊中操作类型的枚举。 5608 5609**系统能力:** SystemCapability.Graphics.Drawing 5610 5611| 名称 | 值 | 说明 | 示意图 | 5612| ------ | - | ------------------ | -------- | 5613| NORMAL | 0 | 内外模糊。 |  | 5614| SOLID | 1 | 内部实体,外部模糊。 |  | 5615| OUTER | 2 | 内部空白,外部模糊。 |  | 5616| INNER | 3 | 内部模糊,外部空白。 |  | 5617 5618## SamplingOptions<sup>12+</sup> 5619 5620采样选项对象。 5621 5622### constructor<sup>12+</sup> 5623 5624constructor() 5625 5626用于构造一个新的采样选项对象。 5627 5628**系统能力:** SystemCapability.Graphics.Drawing 5629 5630**示例:** 5631 5632```ts 5633import { RenderNode } from '@kit.ArkUI'; 5634import { common2D, drawing } from '@kit.ArkGraphics2D'; 5635class DrawingRenderNode extends RenderNode { 5636 draw(context : DrawContext) { 5637 const canvas = context.canvas; 5638 const pen = new drawing.Pen(); 5639 let samplingOptions = new drawing.SamplingOptions(); 5640 } 5641} 5642``` 5643 5644### constructor<sup>12+</sup> 5645 5646constructor(filterMode: FilterMode) 5647 5648用于构造一个新的采样选项对象。 5649 5650**系统能力:** SystemCapability.Graphics.Drawing 5651 5652**参数:** 5653 5654| 参数名 | 类型 | 必填 | 说明 | 5655| ---------- | --------------------- | ---- | ----------------------------------- | 5656| filterMode | [FilterMode](#filtermode12) | 是 | 过滤模式。 | 5657 5658**错误码:** 5659 5660以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 5661 5662| 错误码ID | 错误信息 | 5663| ------- | --------------------------------------------| 5664| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 5665 5666**示例:** 5667 5668```ts 5669import { RenderNode } from '@kit.ArkUI'; 5670import { common2D, drawing } from '@kit.ArkGraphics2D'; 5671class DrawingRenderNode extends RenderNode { 5672 draw(context : DrawContext) { 5673 const canvas = context.canvas; 5674 let samplingOptions = new drawing.SamplingOptions(drawing.FilterMode.FILTER_MODE_NEAREST); 5675 } 5676} 5677``` 5678 5679## Lattice<sup>12+</sup> 5680 5681矩形网格对象。该对象用于将图片按照矩形网格进行划分。 5682 5683### createImageLattice<sup>12+</sup> 5684 5685static 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 5686 5687创建矩形网格对象。将图像划分为矩形网格,同时处于偶数列和偶数行上的网格是固定的,如果目标网格足够大,则这些固定网格以其原始大小进行绘制。如果目标网格太小,无法容纳这些固定网格,则所有固定网格都会按比例缩小以适应目标网格。其余网格将进行缩放,来适应剩余的空间。 5688 5689**系统能力:** SystemCapability.Graphics.Drawing 5690 5691**参数:** 5692 5693| 参数名 | 类型 | 必填 | 说明 | 5694| ------------ | ------------------------------------------------------------------ | ---- | --------------------------------------------------------------------------------- | 5695| xDivs | Array\<number> | 是 | 用于划分图像的X坐标值数组。该参数为整数。 | 5696| yDivs | Array\<number> | 是 | 用于划分图像的Y坐标值数组。该参数为整数。 | 5697| fXCount | number | 是 | X坐标值数组的大小。基于功能和性能的考虑,取值范围为[0, 5]。 | 5698| fYCount | number | 是 | Y坐标值数组的大小。基于功能和性能的考虑,取值范围为[0, 5]。 | 5699| fBounds | [common2D.Rect](js-apis-graphics-common2D.md#rect)\|null | 否 | 可选,要绘制的原始边界矩形,矩形参数须为整数,默认为原始图像矩形大小(若矩形参数为小数,会直接舍弃小数部分,转为整数)。 | 5700| fRectTypes | Array\<[RectType](#recttype12)>\|null | 否 | 可选,填充网格类型的数组,默认为空。如果设置,大小必须为(fXCount + 1) * (fYCount + 1)。 | 5701| fColors | Array\<[common2D.Color](js-apis-graphics-common2D.md#color)>\|null | 否 | 可选,填充网格的颜色数组,默认为空。如果设置,大小必须为(fXCount + 1) * (fYCount + 1)。 | 5702 5703**返回值:** 5704 5705| 类型 | 说明 | 5706| ------------------------- | ----------------------------------- | 5707| [Lattice](#lattice12) | 返回创建的矩形网格对象。 | 5708 5709**错误码:** 5710 5711以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 5712 5713| 错误码ID | 错误信息 | 5714| ------- | --------------------------------------------| 5715| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 5716 5717**示例:** 5718 5719```ts 5720import { RenderNode } from '@kit.ArkUI'; 5721import { drawing } from '@kit.ArkGraphics2D'; 5722class DrawingRenderNode extends RenderNode { 5723 draw(context : DrawContext) { 5724 let xDivs : Array<number> = [1, 2, 4]; 5725 let yDivs : Array<number> = [1, 2, 4]; 5726 let lattice = drawing.Lattice.createImageLattice(xDivs, yDivs, 3, 3); // 划分(3+1)*(3+1)的网格,下图蓝色填充矩形为固定网格 5727 } 5728} 5729``` 5730 5731 5732### createImageLattice<sup>18+</sup> 5733 5734static createImageLattice(xDivs: Array\<number>, yDivs: Array\<number>, fXCount: number, fYCount: number, fBounds?: common2D.Rect | null, fRectTypes?: Array\<RectType> | null, fColors?: Array\<number> | null): Lattice 5735 5736创建矩形网格对象。将图像划分为矩形网格,同时处于偶数列和偶数行上的网格是固定的,如果目标网格足够大,则这些固定网格以其原始大小进行绘制。如果目标网格太小,无法容纳这些固定网格,则所有固定网格都会按比例缩小以适应目标网格。其余网格将进行缩放,来适应剩余的空间。 5737 5738**系统能力:** SystemCapability.Graphics.Drawing 5739 5740**参数:** 5741 5742| 参数名 | 类型 | 必填 | 说明 | 5743| ------------ | ------------------------------------------------------------------ | ---- | --------------------------------------------------------------------------------- | 5744| xDivs | Array\<number> | 是 | 用于划分图像的X坐标值数组。该参数为整数。 | 5745| yDivs | Array\<number> | 是 | 用于划分图像的Y坐标值数组。该参数为整数。 | 5746| fXCount | number | 是 | X坐标值数组的大小。基于功能和性能的考虑,取值范围为[0, 5]。 | 5747| fYCount | number | 是 | Y坐标值数组的大小。基于功能和性能的考虑,取值范围为[0, 5]。 | 5748| fBounds | [common2D.Rect](js-apis-graphics-common2D.md#rect)\|null | 否 | 可选,要绘制的原始边界矩形,矩形参数须为整数,默认为原始图像矩形大小(若矩形参数为小数,会直接舍弃小数部分,转为整数)。 | 5749| fRectTypes | Array\<[RectType](#recttype12)>\|null | 否 | 可选,填充网格类型的数组,默认为空。如果设置,大小必须为(fXCount + 1) * (fYCount + 1)。 | 5750| fColors | Array\<number>\|null | 否 | 可选,填充网格的颜色数组,颜色用16进制ARGB格式的32位无符号整数表示,参数默认为空。如果设置,大小必须为(fXCount + 1) * (fYCount + 1)。 | 5751 5752**返回值:** 5753 5754| 类型 | 说明 | 5755| ------------------------- | ----------------------------------- | 5756| [Lattice](#lattice12) | 返回创建的矩形网格对象。 | 5757 5758**错误码:** 5759 5760以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 5761 5762| 错误码ID | 错误信息 | 5763| ------- | --------------------------------------------| 5764| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 5765 5766**示例:** 5767 5768```ts 5769import { RenderNode } from '@kit.ArkUI'; 5770import { drawing } from '@kit.ArkGraphics2D'; 5771class DrawingRenderNode extends RenderNode { 5772 draw(context : DrawContext) { 5773 let xDivs : Array<number> = [1, 2, 4]; 5774 let yDivs : Array<number> = [1, 2, 4]; 5775 let colorArray :Array<number>=[0xffffffff,0x44444444,0x99999999,0xffffffff,0x44444444,0x99999999,0xffffffff,0x44444444,0x99999999,0x44444444,0x99999999,0xffffffff,0x44444444,0x99999999,0xffffffff,0x44444444]; 5776 let lattice = drawing.Lattice.createImageLattice(xDivs, yDivs, 3, 3,null,null,colorArray); 5777 } 5778} 5779``` 5780 5781## RectType<sup>12+</sup> 5782 5783定义填充网格的矩形类型的枚举。仅在[Lattice](#lattice12)中使用。 5784 5785**系统能力:** SystemCapability.Graphics.Drawing 5786 5787| 名称 | 值 | 说明 | 5788| ------------ | ---- | --------------------------------------------------------------- | 5789| DEFAULT | 0 | 将图像绘制到矩形网格中。 | 5790| TRANSPARENT | 1 | 将矩形网格设置为透明的。 | 5791| FIXEDCOLOR | 2 | 将[Lattice](#lattice12)中fColors数组的颜色绘制到矩形网格中。 | 5792 5793## MaskFilter<sup>12+</sup> 5794 5795蒙版滤镜对象。 5796 5797### createBlurMaskFilter<sup>12+</sup> 5798 5799static createBlurMaskFilter(blurType: BlurType, sigma: number): MaskFilter 5800 5801用于创建具有模糊效果的蒙版滤镜。 5802 5803**系统能力:** SystemCapability.Graphics.Drawing 5804 5805**参数:** 5806 5807| 参数名 | 类型 | 必填 | 说明 | 5808| ---------- | --------------------- | ---- | ----------------------------------- | 5809| blurType | [BlurType](#blurtype12) | 是 | 模糊类型。 | 5810| sigma | number | 是 | 要应用的高斯模糊的标准偏差,必须为大于0的浮点数。 | 5811 5812**返回值:** 5813 5814| 类型 | 说明 | 5815| ------------------------- | ------------------ | 5816| [MaskFilter](#maskfilter12) | 返回创建的蒙版滤镜对象。 | 5817 5818**错误码:** 5819 5820以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 5821 5822| 错误码ID | 错误信息 | 5823| ------- | --------------------------------------------| 5824| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 5825 5826**示例:** 5827 5828```ts 5829import { RenderNode } from '@kit.ArkUI'; 5830import { common2D, drawing } from '@kit.ArkGraphics2D'; 5831class DrawingRenderNode extends RenderNode { 5832 draw(context : DrawContext) { 5833 const canvas = context.canvas; 5834 let maskFilter = drawing.MaskFilter.createBlurMaskFilter(drawing.BlurType.OUTER, 10); 5835 } 5836} 5837``` 5838 5839## PathDashStyle<sup>18+</sup> 5840 5841路径效果的绘制样式枚举。 5842 5843**系统能力:** SystemCapability.Graphics.Drawing 5844 5845| 名称 | 值 | 说明 | 5846| ------ | - | ------------------ | 5847| TRANSLATE | 0 | 不会随着路径旋转,只会平移。 | 5848| ROTATE | 1 | 随着路径的旋转而旋转。 | 5849| MORPH | 2 | 随着路径的旋转而旋转,但是在转折处的地方,会拉伸或压缩等增加平滑度。 | 5850 5851## PathEffect<sup>12+</sup> 5852 5853路径效果对象。 5854 5855### createDashPathEffect<sup>12+</sup> 5856 5857static createDashPathEffect(intervals: Array\<number>, phase: number): PathEffect 5858 5859用于创建将路径变为虚线的路径效果对象。 5860 5861**系统能力:** SystemCapability.Graphics.Drawing 5862 5863**参数:** 5864 5865| 参数名 | 类型 | 必填 | 说明 | 5866| ---------- | ------------- | ------- | -------------------------------------------------- | 5867| intervals | Array\<number> | 是 | 表示虚线的ON和OFF长度的数组,数组个数必须是偶数,且>=2,该参数为正整数。| 5868| phase | number | 是 | 绘制时的偏移量,该参数为浮点数。 | 5869 5870**返回值:** 5871 5872| 类型 | 说明 | 5873| ------------------------- | --------------------- | 5874| [PathEffect](#patheffect12) | 返回创建的路径效果对象。 | 5875 5876**错误码:** 5877 5878以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 5879 5880| 错误码ID | 错误信息 | 5881| ------- | --------------------------------------------| 5882| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 5883 5884**示例:** 5885 5886```ts 5887import { RenderNode } from '@kit.ArkUI'; 5888import { common2D, drawing } from '@kit.ArkGraphics2D'; 5889class DrawingRenderNode extends RenderNode { 5890 draw(context : DrawContext) { 5891 const canvas = context.canvas; 5892 let intervals = [10, 5]; 5893 let effect = drawing.PathEffect.createDashPathEffect(intervals, 5); 5894 } 5895} 5896``` 5897 5898### createPathDashEffect<sup>18+</sup> 5899 5900static createPathDashEffect(path: Path, advance: number, phase: number, style: PathDashStyle): PathEffect 5901 5902通过路径描述的形状创建一个虚线路径效果。 5903 5904**系统能力:** SystemCapability.Graphics.Drawing 5905 5906**参数:** 5907 5908| 参数名 | 类型 | 必填 | 说明 | 5909| ---------- | ------------- | ------- | -------------------------------------------------- | 5910| path | [Path](#path) | 是 | 通过该路径生成一个图形,用来填充每个虚线段。| 5911| advance | number | 是 | 虚线段的步长,该参数为大于0的浮点数,否则会抛错误码。 | 5912| phase | number | 是 | 表示虚线段内图形在虚线步长范围内的偏移量,该参数为浮点数,效果为先对偏移量取绝对值,然后对步长取模。 | 5913| style | [PathDashStyle](#pathdashstyle18) | 是 | 指定虚线效果的样式。 | 5914 5915**返回值:** 5916 5917| 类型 | 说明 | 5918| ------------------------- | --------------------- | 5919| [PathEffect](#patheffect12) | 返回创建的路径效果对象。 | 5920 5921**错误码:** 5922 5923以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 5924 5925| 错误码ID | 错误信息 | 5926| ------- | --------------------------------------------| 5927| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3. Parameter verification failed. | 5928 5929**示例:** 5930 5931```ts 5932import { RenderNode } from '@kit.ArkUI'; 5933import { common2D, drawing } from '@kit.ArkGraphics2D'; 5934class DrawingRenderNode extends RenderNode { 5935 draw(context : DrawContext) { 5936 const canvas = context.canvas; 5937 let pen = new drawing.Pen(); 5938 const penColor: common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 } 5939 pen.setColor(penColor); 5940 pen.setStrokeWidth(10); 5941 canvas.attachPen(pen); 5942 pen.setAntiAlias(true); 5943 5944 const path = new drawing.Path(); 5945 path.moveTo(100, 100); 5946 path.lineTo(150, 50); 5947 path.lineTo(200, 100); 5948 5949 const path1 = new drawing.Path(); 5950 path1.moveTo(0, 0); 5951 path1.lineTo(10, 0); 5952 path1.lineTo(20, 10); 5953 path1.lineTo(0,10); 5954 5955 let pathEffect1: drawing.PathEffect = drawing.PathEffect.createPathDashEffect(path1, 50, -30, 5956 drawing.PathDashStyle.MORPH); 5957 pen.setPathEffect(pathEffect1); 5958 5959 canvas.attachPen(pen); 5960 canvas.drawPath(path); 5961 canvas.detachPen(); 5962 } 5963} 5964``` 5965 5966### createSumPathEffect<sup>18+</sup> 5967 5968static createSumPathEffect(firstPathEffect: PathEffect, secondPathEffect: PathEffect): PathEffect 5969 5970通过两种路径效果创建一个叠加的路径效果。与createComposePathEffect不同的是,会分别对两个参数的效果各自独立进行表现,然后将两个效果简单的重叠在一起显示出来。 5971 5972**系统能力:** SystemCapability.Graphics.Drawing 5973 5974**参数:** 5975 5976| 参数名 | 类型 | 必填 | 说明 | 5977| ---------- | ------------- | ------- | -------------------------------------------------- | 5978| firstPathEffect | [PathEffect](#patheffect12) | 是 | 表示第一个路径效果。 | 5979| secondPathEffect | [PathEffect](#patheffect12) | 是 | 表示第二个路径效果。 | 5980 5981**返回值:** 5982 5983| 类型 | 说明 | 5984| ------------------------- | --------------------- | 5985| [PathEffect](#patheffect12) | 返回创建的路径效果对象。 | 5986 5987**示例:** 5988 5989```ts 5990import { RenderNode } from '@kit.ArkUI'; 5991import { drawing } from '@kit.ArkGraphics2D'; 5992class DrawingRenderNode extends RenderNode { 5993 draw(context : DrawContext) { 5994 const canvas = context.canvas; 5995 let intervals = [10, 5]; 5996 let pathEffectOne = drawing.PathEffect.createDashPathEffect(intervals, 5); 5997 let pathEffectTwo = drawing.PathEffect.createDashPathEffect(intervals, 10); 5998 let effect = drawing.PathEffect.createSumPathEffect(pathEffectOne, pathEffectTwo); 5999 } 6000} 6001``` 6002 6003### createCornerPathEffect<sup>12+</sup> 6004 6005static createCornerPathEffect(radius: number): PathEffect 6006 6007用于创建将路径的夹角变成指定半径的圆角的路径效果对象。 6008 6009**系统能力:** SystemCapability.Graphics.Drawing 6010 6011**参数:** 6012 6013| 参数名 | 类型 | 必填 | 说明 | 6014| ---------- | ------------- | ------- | -------------------------------------------------- | 6015| radius | number | 是 | 圆角的半径,必须大于0,该参数为浮点数。 | 6016 6017**返回值:** 6018 6019| 类型 | 说明 | 6020| ------------------------- | --------------------- | 6021| [PathEffect](#patheffect12) | 返回创建的路径效果对象。 | 6022 6023**错误码:** 6024 6025以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 6026 6027| 错误码ID | 错误信息 | 6028| ------- | --------------------------------------------| 6029| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 6030 6031**示例:** 6032 6033```ts 6034import { RenderNode } from '@kit.ArkUI'; 6035import { drawing } from '@kit.ArkGraphics2D'; 6036class DrawingRenderNode extends RenderNode { 6037 draw(context : DrawContext) { 6038 const canvas = context.canvas; 6039 let effect = drawing.PathEffect.createCornerPathEffect(30); 6040 } 6041} 6042``` 6043 6044### createDiscretePathEffect<sup>18+</sup> 6045 6046static createDiscretePathEffect(segLength: number, dev: number, seedAssist?: number): PathEffect 6047 6048创建一种将路径打散,并且在路径上产生不规则分布的效果。 6049 6050**系统能力:** SystemCapability.Graphics.Drawing 6051 6052**参数:** 6053 6054| 参数名 | 类型 | 必填 | 说明 | 6055| ---------- | ------------- | ------- | -------------------------------------------------- | 6056| segLength | number | 是 | 路径中每进行一次打散操作的长度,该长度为浮点数,负数和0时无效果。 | 6057| dev | number | 是 | 绘制时的末端点的最大移动偏离量,该偏移量为浮点数。 | 6058| seedAssist | number | 否 | 生成效果伪随机种子辅助变量,默认值为0,该参数为32位无符号整数。 | 6059 6060**返回值:** 6061 6062| 类型 | 说明 | 6063| ------------------------- | --------------------- | 6064| [PathEffect](#patheffect12) | 返回创建的路径效果对象。 | 6065 6066**示例:** 6067 6068```ts 6069import { RenderNode } from '@kit.ArkUI'; 6070import { drawing } from '@kit.ArkGraphics2D'; 6071class DrawingRenderNode extends RenderNode { 6072 draw(context : DrawContext) { 6073 const canvas = context.canvas; 6074 let effect = drawing.PathEffect.createDiscretePathEffect(100, -50, 0); 6075 } 6076} 6077``` 6078 6079### createComposePathEffect<sup>18+</sup> 6080 6081static createComposePathEffect(outer: PathEffect, inner: PathEffect): PathEffect 6082 6083创建路径组合的路径效果对象,首先应用内部路径效果,然后应用外部路径效果。 6084 6085**系统能力:** SystemCapability.Graphics.Drawing 6086 6087**参数:** 6088 6089| 参数名 | 类型 | 必填 | 说明 | 6090| ------ | --------------------------- | ---- | -------------------------------- | 6091| outer | [PathEffect](#patheffect12) | 是 | 组合路径效果中外部路径效果。 | 6092| inner | [PathEffect](#patheffect12) | 是 | 组合路径效果中内部路径效果。 | 6093 6094**返回值:** 6095 6096| 类型 | 说明 | 6097| ------------------------- | --------------------- | 6098| [PathEffect](#patheffect12) | 返回创建的路径效果对象。 | 6099 6100**示例:** 6101 6102```ts 6103import { RenderNode } from '@kit.ArkUI'; 6104import { drawing } from '@kit.ArkGraphics2D'; 6105class DrawingRenderNode extends RenderNode { 6106 draw(context : DrawContext) { 6107 const canvas = context.canvas; 6108 let pathEffect1 = drawing.PathEffect.createCornerPathEffect(100); 6109 let pathEffect2 = drawing.PathEffect.createCornerPathEffect(10); 6110 let effect = drawing.PathEffect.createComposePathEffect(pathEffect1, pathEffect2); 6111 } 6112} 6113``` 6114 6115## ShadowLayer<sup>12+</sup> 6116 6117阴影层对象。 6118 6119### create<sup>12+</sup> 6120 6121static create(blurRadius: number, x: number, y: number, color: common2D.Color): ShadowLayer 6122 6123用于创建一个阴影层对象。 6124 6125**系统能力:** SystemCapability.Graphics.Drawing 6126 6127**参数:** 6128 6129| 参数名 | 类型 | 必填 | 说明 | 6130| ---------- | -------- | ---- | ----------------------------------- | 6131| blurRadius | number | 是 | 阴影的半径,必须为大于零的浮点数。 | 6132| x | number | 是 | x轴上的偏移点,该参数为浮点数。 | 6133| y | number | 是 | Y轴上的偏移点,该参数为浮点数。 | 6134| color | [common2D.Color](js-apis-graphics-common2D.md#color) | 是 | ARGB格式的颜色,每个颜色通道是0到255之间的整数。 | 6135 6136**返回值:** 6137 6138| 类型 | 说明 | 6139| --------------------------- | -------------------- | 6140| [ShadowLayer](#shadowlayer12) | 返回创建的阴影层对象。 | 6141 6142**错误码:** 6143 6144以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 6145 6146| 错误码ID | 错误信息 | 6147| ------- | --------------------------------------------| 6148| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 6149 6150**示例:** 6151 6152```ts 6153import { RenderNode } from '@kit.ArkUI'; 6154import { common2D, drawing } from '@kit.ArkGraphics2D'; 6155class DrawingRenderNode extends RenderNode { 6156 draw(context : DrawContext) { 6157 const canvas = context.canvas; 6158 let color : common2D.Color = {alpha: 0xFF, red: 0x00, green: 0xFF, blue: 0x00}; 6159 let shadowLayer = drawing.ShadowLayer.create(3, -3, 3, color); 6160 } 6161} 6162``` 6163 6164### create<sup>18+</sup> 6165 6166static create(blurRadius: number, x: number, y: number, color: common2D.Color | number): ShadowLayer 6167 6168用于创建一个阴影层对象。 6169 6170**系统能力:** SystemCapability.Graphics.Drawing 6171 6172**参数:** 6173 6174| 参数名 | 类型 | 必填 | 说明 | 6175| ---------- | -------- | ---- | ----------------------------------- | 6176| blurRadius | number | 是 | 阴影的半径,必须为大于零的浮点数。 | 6177| x | number | 是 | x轴上的偏移点,该参数为浮点数。 | 6178| y | number | 是 | Y轴上的偏移点,该参数为浮点数。 | 6179| color | [common2D.Color](js-apis-graphics-common2D.md#color) \| number | 是 | 颜色,可以用16进制ARGB格式的无符号整数表示。 | 6180 6181**返回值:** 6182 6183| 类型 | 说明 | 6184| --------------------------- | -------------------- | 6185| [ShadowLayer](#shadowlayer12) | 返回创建的阴影层对象。 | 6186 6187**错误码:** 6188 6189以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 6190 6191| 错误码ID | 错误信息 | 6192| ------- | --------------------------------------------| 6193| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 6194 6195**示例:** 6196 6197```ts 6198import { RenderNode } from '@kit.ArkUI'; 6199import { drawing } from '@kit.ArkGraphics2D'; 6200class DrawingRenderNode extends RenderNode { 6201 draw(context : DrawContext) { 6202 const canvas = context.canvas; 6203 let shadowLayer = drawing.ShadowLayer.create(3, -3, 3, 0xff00ff00); 6204 } 6205} 6206``` 6207 6208## Pen 6209 6210画笔对象,描述所绘制图形形状的轮廓信息。 6211 6212### constructor<sup>12+</sup> 6213 6214constructor() 6215 6216构造一个新的画笔对象。 6217 6218**系统能力:** SystemCapability.Graphics.Drawing 6219 6220**示例:** 6221 6222```ts 6223import { drawing } from '@kit.ArkGraphics2D'; 6224 6225const pen = new drawing.Pen(); 6226``` 6227 6228### constructor<sup>12+</sup> 6229 6230constructor(pen: Pen) 6231 6232复制构造一个新的画笔对象。 6233 6234**系统能力:** SystemCapability.Graphics.Drawing 6235 6236**参数:** 6237 6238| 参数名 | 类型 | 必填 | 说明 | 6239| ------| ----------- | ---- | ---------------- | 6240| pen | [Pen](#pen) | 是 | 待复制的画笔对象。 | 6241 6242**错误码:** 6243 6244以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 6245 6246| 错误码ID | 错误信息 | 6247| ------- | --------------------------------------------| 6248| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 6249 6250**示例:** 6251 6252```ts 6253import { common2D, drawing } from '@kit.ArkGraphics2D'; 6254 6255const pen = new drawing.Pen(); 6256const penColor: common2D.Color = { alpha: 255, red: 0, green: 255, blue: 0 }; 6257pen.setColor(penColor); 6258pen.setStrokeWidth(10); 6259const newPen = new drawing.Pen(pen); 6260``` 6261 6262### setMiterLimit<sup>12+</sup> 6263 6264setMiterLimit(miter: number): void 6265 6266设置折线尖角长度与线宽的最大比值,当画笔绘制一条折线,并且[JoinStyle](#joinstyle12)为MITER_JOIN时,若尖角长度与线宽的比值大于限制值,则该折角使用BEVEL_JOIN绘制。 6267 6268**系统能力:** SystemCapability.Graphics.Drawing 6269 6270**参数:** 6271 6272| 参数名 | 类型 | 必填 | 说明 | 6273| ------ | ------ | ---- | ---------------- | 6274| miter | number | 是 | 折线尖角长度与线宽的最大比值,负数在绘制时会被视作4.0处理,非负数正常生效,该参数为浮点数。 | 6275 6276**错误码:** 6277 6278以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 6279 6280| 错误码ID | 错误信息 | 6281| ------- | --------------------------------------------| 6282| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 6283 6284**示例:** 6285 6286```ts 6287import { drawing } from '@kit.ArkGraphics2D'; 6288 6289const pen = new drawing.Pen(); 6290pen.setMiterLimit(5); 6291``` 6292 6293### getMiterLimit<sup>12+</sup> 6294 6295getMiterLimit(): number 6296 6297获取折线尖角的限制值。 6298 6299**系统能力:** SystemCapability.Graphics.Drawing 6300 6301**返回值:** 6302 6303| 类型 | 说明 | 6304| -------| -------------------- | 6305| number | 返回折线尖角长度与线宽的最大比值。 | 6306 6307**示例:** 6308 6309```ts 6310import { drawing } from '@kit.ArkGraphics2D'; 6311 6312const pen = new drawing.Pen(); 6313let miter = pen.getMiterLimit(); 6314``` 6315 6316### setImageFilter<sup>12+</sup> 6317 6318setImageFilter(filter: ImageFilter | null): void 6319 6320为画笔设置图像滤波器。 6321 6322**系统能力:** SystemCapability.Graphics.Drawing 6323 6324**参数:** 6325 6326| 参数名 | 类型 | 必填 | 说明 | 6327| ------ | ------ | ---- | ----------------------- | 6328| filter | [ImageFilter](#imagefilter12) \| null | 是 | 图像滤波器,为null表示清空画笔的图像滤波器效果。 | 6329 6330**错误码:** 6331 6332以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 6333 6334| 错误码ID | 错误信息 | 6335| ------- | --------------------------------------------| 6336| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types. | 6337 6338**示例:** 6339 6340```ts 6341import {drawing} from '@kit.ArkGraphics2D'; 6342let colorfilter = drawing.ColorFilter.createSRGBGammaToLinear(); 6343let imgFilter = drawing.ImageFilter.createFromColorFilter(colorfilter); 6344let pen = new drawing.Pen(); 6345pen.setImageFilter(imgFilter); 6346pen.setImageFilter(null); 6347``` 6348 6349### getColorFilter<sup>12+</sup> 6350 6351getColorFilter(): ColorFilter 6352 6353获取画笔的颜色滤波器。 6354 6355**系统能力:** SystemCapability.Graphics.Drawing 6356 6357**返回值:** 6358 6359| 类型 | 说明 | 6360| --------------------------- | ------------------ | 6361| [ColorFilter](#colorfilter) | 返回一个颜色滤波器。 | 6362 6363**示例:** 6364 6365```ts 6366import {drawing} from '@kit.ArkGraphics2D'; 6367let pen = new drawing.Pen(); 6368let colorfilter = drawing.ColorFilter.createLumaColorFilter(); 6369pen.setColorFilter(colorfilter); 6370let filter = pen.getColorFilter(); 6371``` 6372 6373### setColor 6374 6375setColor(color: common2D.Color) : void 6376 6377用于设置画笔的颜色。 6378 6379**系统能力:** SystemCapability.Graphics.Drawing 6380 6381**参数:** 6382 6383| 参数名 | 类型 | 必填 | 说明 | 6384| ------ | ---------------------------------------------------- | ---- | ---------------- | 6385| color | [common2D.Color](js-apis-graphics-common2D.md#color) | 是 | ARGB格式的颜色,每个颜色通道是0到255之间的整数。 | 6386 6387**错误码:** 6388 6389以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 6390 6391| 错误码ID | 错误信息 | 6392| ------- | --------------------------------------------| 6393| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 6394 6395**示例:** 6396 6397```ts 6398import { common2D, drawing } from '@kit.ArkGraphics2D'; 6399const color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 }; 6400const pen = new drawing.Pen(); 6401pen.setColor(color); 6402``` 6403 6404### setColor<sup>12+</sup> 6405 6406setColor(alpha: number, red: number, green: number, blue: number): void 6407 6408用于设置画笔的颜色。性能优于[setColor](#setcolor)接口,推荐使用本接口。 6409 6410**系统能力:** SystemCapability.Graphics.Drawing 6411 6412**参数:** 6413 6414| 参数名 | 类型 | 必填 | 说明 | 6415| ------ | ------ | ---- | -------------------------------------------------- | 6416| alpha | number | 是 | ARGB格式颜色的透明度通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。 | 6417| red | number | 是 | ARGB格式颜色的红色通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。 | 6418| green | number | 是 | ARGB格式颜色的绿色通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。 | 6419| blue | number | 是 | ARGB格式颜色的蓝色通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。 | 6420 6421**错误码:** 6422 6423以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 6424 6425| 错误码ID | 错误信息 | 6426| ------- | --------------------------------------------| 6427| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 6428 6429**示例:** 6430 6431```ts 6432import { drawing } from '@kit.ArkGraphics2D'; 6433const pen = new drawing.Pen(); 6434pen.setColor(255, 255, 0, 0); 6435``` 6436 6437### setColor<sup>18+</sup> 6438 6439setColor(color: number) : void 6440 6441用于设置画笔的颜色。 6442 6443**系统能力:** SystemCapability.Graphics.Drawing 6444 6445**参数:** 6446 6447| 参数名 | 类型 | 必填 | 说明 | 6448| ------ | ---------------------------------------------------- | ---- | ---------------- | 6449| color | number | 是 | 16进制ARGB格式的颜色。 | 6450 6451**示例:** 6452 6453```ts 6454import { drawing } from '@kit.ArkGraphics2D'; 6455const pen = new drawing.Pen(); 6456pen.setColor(0xffff0000); 6457``` 6458 6459### getColor<sup>12+</sup> 6460 6461getColor(): common2D.Color 6462 6463获取画笔的颜色。 6464 6465**系统能力:** SystemCapability.Graphics.Drawing 6466 6467**返回值:** 6468 6469| 类型 | 说明 | 6470| -------------- | -------------- | 6471| common2D.Color | 返回画笔的颜色。 | 6472 6473**示例:** 6474 6475```ts 6476import { common2D, drawing } from '@kit.ArkGraphics2D'; 6477 6478const color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 }; 6479const pen = new drawing.Pen(); 6480pen.setColor(color); 6481let colorGet = pen.getColor(); 6482``` 6483 6484### getHexColor<sup>18+</sup> 6485 6486getHexColor(): number 6487 6488获取画笔的颜色。 6489 6490**系统能力:** SystemCapability.Graphics.Drawing 6491 6492**返回值:** 6493 6494| 类型 | 说明 | 6495| -------------- | -------------- | 6496| number | 返回画笔的颜色,以16进制ARGB格式的32位无符号整数表示。 | 6497 6498**示例:** 6499 6500```ts 6501import { common2D, drawing } from '@kit.ArkGraphics2D'; 6502 6503let color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 }; 6504let pen = new drawing.Pen(); 6505pen.setColor(color); 6506let hex_color: number = pen.getHexColor(); 6507console.info('getHexColor: ', hex_color.toString(16)); 6508``` 6509 6510### setStrokeWidth 6511 6512setStrokeWidth(width: number) : void 6513 6514用于设置画笔的线宽。0线宽被视作特殊的极细线宽,在绘制时始终会被绘制为1像素,不随画布的缩放而改变;负数线宽在实际绘制时会被视作0线宽。 6515 6516**系统能力:** SystemCapability.Graphics.Drawing 6517 6518**参数:** 6519 6520| 参数名 | 类型 | 必填 | 说明 | 6521| ------ | ------ | ---- | ---------------- | 6522| width | number | 是 | 表示线宽,该参数为浮点数。 | 6523 6524**错误码:** 6525 6526以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 6527 6528| 错误码ID | 错误信息 | 6529| ------- | --------------------------------------------| 6530| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 6531 6532**示例:** 6533 6534```ts 6535import { drawing } from '@kit.ArkGraphics2D'; 6536const pen = new drawing.Pen(); 6537pen.setStrokeWidth(5); 6538``` 6539 6540### getWidth<sup>12+</sup> 6541 6542getWidth(): number 6543 6544获取画笔的线宽属性,线宽描述了画笔绘制图形轮廓的宽度。 6545 6546**系统能力:** SystemCapability.Graphics.Drawing 6547 6548**返回值:** 6549 6550| 类型 | 说明 | 6551| ------ | -------------- | 6552| number | 返回画笔的线宽。 | 6553 6554**示例:** 6555 6556```ts 6557import { drawing } from '@kit.ArkGraphics2D'; 6558 6559const pen = new drawing.Pen(); 6560let width = pen.getWidth(); 6561``` 6562 6563### setAntiAlias 6564 6565setAntiAlias(aa: boolean) : void 6566 6567用于设置画笔是否开启抗锯齿。开启后,可以使得图形的边缘在显示时更平滑。 6568 6569**系统能力:** SystemCapability.Graphics.Drawing 6570 6571**参数:** 6572 6573| 参数名 | 类型 | 必填 | 说明 | 6574| ------ | ------- | ---- | ------------------------------------------------- | 6575| aa | boolean | 是 | 表示是否开启抗锯齿。true表示开启,false表示关闭。 | 6576 6577**错误码:** 6578 6579以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 6580 6581| 错误码ID | 错误信息 | 6582| ------- | --------------------------------------------| 6583| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 6584 6585**示例:** 6586 6587```ts 6588import { drawing } from '@kit.ArkGraphics2D'; 6589const pen = new drawing.Pen(); 6590pen.setAntiAlias(true); 6591``` 6592 6593### isAntiAlias<sup>12+</sup> 6594 6595isAntiAlias(): boolean 6596 6597获取画笔是否开启抗锯齿属性。 6598 6599**系统能力:** SystemCapability.Graphics.Drawing 6600 6601**返回值:** 6602 6603| 类型 | 说明 | 6604| ------- | ------------------------- | 6605| boolean | 返回画笔是否开启抗锯齿属性,true表示开启抗锯齿属性,false表示关闭抗锯齿属性。 | 6606 6607**示例:** 6608 6609```ts 6610import { drawing } from '@kit.ArkGraphics2D'; 6611 6612const pen = new drawing.Pen(); 6613let isAntiAlias = pen.isAntiAlias(); 6614``` 6615 6616### setAlpha 6617 6618setAlpha(alpha: number) : void 6619 6620用于设置画笔的透明度。 6621 6622**系统能力:** SystemCapability.Graphics.Drawing 6623 6624**参数:** 6625 6626| 参数名 | 类型 | 必填 | 说明 | 6627| ------ | ------ | ---- | ---------------------------------------- | 6628| alpha | number | 是 | 用于表示透明度的[0, 255]区间内的整数值,传入浮点类型时向下取整。 | 6629 6630**错误码:** 6631 6632以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 6633 6634| 错误码ID | 错误信息 | 6635| ------- | --------------------------------------------| 6636| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 6637 6638**示例:** 6639 6640```ts 6641import { drawing } from '@kit.ArkGraphics2D'; 6642const pen = new drawing.Pen(); 6643pen.setAlpha(128); 6644``` 6645 6646### getAlpha<sup>12+</sup> 6647 6648getAlpha(): number 6649 6650获取画笔的透明度。 6651 6652**系统能力:** SystemCapability.Graphics.Drawing 6653 6654**返回值:** 6655 6656| 类型 | 说明 | 6657| ------ | ---------------- | 6658| number | 返回画笔的透明度,该返回值为0到255之间的整数。 | 6659 6660**示例:** 6661 6662```ts 6663import { drawing } from '@kit.ArkGraphics2D'; 6664 6665const pen = new drawing.Pen(); 6666let alpha = pen.getAlpha(); 6667``` 6668 6669### setColorFilter 6670 6671setColorFilter(filter: ColorFilter) : void 6672 6673用于给画笔添加额外的颜色滤波器。 6674 6675**系统能力:** SystemCapability.Graphics.Drawing 6676 6677**参数:** 6678 6679| 参数名 | 类型 | 必填 | 说明 | 6680| ------ | --------------------------- | ---- | ------------ | 6681| filter | [ColorFilter](#colorfilter) | 是 | 颜色滤波器。为null时表示清空颜色滤波器。 | 6682 6683**错误码:** 6684 6685以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 6686 6687| 错误码ID | 错误信息 | 6688| ------- | --------------------------------------------| 6689| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 6690 6691**示例:** 6692 6693```ts 6694import { drawing } from '@kit.ArkGraphics2D'; 6695const pen = new drawing.Pen(); 6696let colorFilter = drawing.ColorFilter.createLinearToSRGBGamma(); 6697pen.setColorFilter(colorFilter); 6698``` 6699 6700### setMaskFilter<sup>12+</sup> 6701 6702setMaskFilter(filter: MaskFilter): void 6703 6704用于给画笔添加额外的蒙版滤镜。 6705 6706**系统能力:** SystemCapability.Graphics.Drawing 6707 6708**参数:** 6709 6710| 参数名 | 类型 | 必填 | 说明 | 6711| ------ | ------------------------- | ---- | --------- | 6712| filter | [MaskFilter](#maskfilter12) | 是 | 蒙版滤镜。为null时表示清空蒙版滤镜。 | 6713 6714**错误码:** 6715 6716以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 6717 6718| 错误码ID | 错误信息 | 6719| ------- | --------------------------------------------| 6720| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 6721 6722**示例:** 6723 6724```ts 6725import { RenderNode } from '@kit.ArkUI'; 6726import { common2D, drawing } from '@kit.ArkGraphics2D'; 6727class DrawingRenderNode extends RenderNode { 6728 draw(context : DrawContext) { 6729 const canvas = context.canvas; 6730 const pen = new drawing.Pen(); 6731 pen.setStrokeWidth(5); 6732 pen.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 6733 let maskFilter = drawing.MaskFilter.createBlurMaskFilter(drawing.BlurType.OUTER, 10); 6734 pen.setMaskFilter(maskFilter); 6735 } 6736} 6737``` 6738 6739### setPathEffect<sup>12+</sup> 6740 6741setPathEffect(effect: PathEffect): void 6742 6743设置画笔路径效果。 6744 6745**系统能力:** SystemCapability.Graphics.Drawing 6746 6747**参数:** 6748 6749| 参数名 | 类型 | 必填 | 说明 | 6750| ------- | ------------------------- | ---- | ------------ | 6751| effect | [PathEffect](#patheffect12) | 是 | 路径效果对象。为null时表示清空路径效果。 | 6752 6753**错误码:** 6754 6755以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 6756 6757| 错误码ID | 错误信息 | 6758| ------- | --------------------------------------------| 6759| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 6760 6761**示例:** 6762 6763```ts 6764import { RenderNode } from '@kit.ArkUI'; 6765import { common2D, drawing } from '@kit.ArkGraphics2D'; 6766class DrawingRenderNode extends RenderNode { 6767 draw(context : DrawContext) { 6768 const canvas = context.canvas; 6769 const pen = new drawing.Pen(); 6770 pen.setStrokeWidth(5); 6771 pen.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 6772 let pathEffect = drawing.PathEffect.createDashPathEffect([30, 10], 0); 6773 pen.setPathEffect(pathEffect); 6774 } 6775} 6776``` 6777 6778### setShaderEffect<sup>12+</sup> 6779 6780setShaderEffect(shaderEffect: ShaderEffect): void 6781 6782设置画笔着色器效果。 6783 6784**系统能力:** SystemCapability.Graphics.Drawing 6785 6786**参数:** 6787 6788| 参数名 | 类型 | 必填 | 说明 | 6789| ------- | ------------------------- | ---- | ------------ | 6790| shaderEffect | [ShaderEffect](#shadereffect12) | 是 | 着色器对象。为null时表示清空着色器效果。 | 6791 6792**错误码:** 6793 6794以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 6795 6796| 错误码ID | 错误信息 | 6797| ------- | --------------------------------------------| 6798| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 6799 6800**示例:** 6801 6802```ts 6803import { drawing } from '@kit.ArkGraphics2D'; 6804 6805const pen = new drawing.Pen(); 6806let shaderEffect = drawing.ShaderEffect.createLinearGradient({x: 100, y: 100}, {x: 300, y: 300}, [0xFF00FF00, 0xFFFF0000], drawing.TileMode.REPEAT); 6807pen.setShaderEffect(shaderEffect); 6808``` 6809 6810### setShadowLayer<sup>12+</sup> 6811 6812setShadowLayer(shadowLayer: ShadowLayer): void 6813 6814设置画笔阴影层效果。当前仅在绘制文字时生效。 6815 6816**系统能力:** SystemCapability.Graphics.Drawing 6817 6818**参数:** 6819 6820| 参数名 | 类型 | 必填 | 说明 | 6821| ------- | ------------------------- | ---- | --------- | 6822| shadowLayer | [ShadowLayer](#shadowlayer12) | 是 | 阴影层对象。为null时表示清空阴影层效果。 | 6823 6824**错误码:** 6825 6826以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 6827 6828| 错误码ID | 错误信息 | 6829| ------- | --------------------------------------------| 6830| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 6831 6832**示例:** 6833 6834```ts 6835import { RenderNode } from '@kit.ArkUI'; 6836import { common2D, drawing } from '@kit.ArkGraphics2D'; 6837class DrawingRenderNode extends RenderNode { 6838 draw(context : DrawContext) { 6839 const canvas = context.canvas; 6840 let font = new drawing.Font(); 6841 font.setSize(60); 6842 let textBlob = drawing.TextBlob.makeFromString("hello", font, drawing.TextEncoding.TEXT_ENCODING_UTF8); 6843 let pen = new drawing.Pen(); 6844 pen.setStrokeWidth(2.0); 6845 let pen_color : common2D.Color = {alpha: 0xFF, red: 0xFF, green: 0x00, blue: 0x00}; 6846 pen.setColor(pen_color); 6847 canvas.attachPen(pen); 6848 canvas.drawTextBlob(textBlob, 100, 100); 6849 canvas.detachPen(); 6850 let color : common2D.Color = {alpha: 0xFF, red: 0x00, green: 0xFF, blue: 0x00}; 6851 let shadowLayer = drawing.ShadowLayer.create(3, -3, 3, color); 6852 pen.setShadowLayer(shadowLayer); 6853 canvas.attachPen(pen); 6854 canvas.drawTextBlob(textBlob, 100, 200); 6855 canvas.detachPen(); 6856 } 6857} 6858``` 6859 6860### setBlendMode 6861 6862setBlendMode(mode: BlendMode) : void 6863 6864用于设置画笔的混合模式。 6865 6866**系统能力:** SystemCapability.Graphics.Drawing 6867 6868**参数:** 6869 6870| 参数名 | 类型 | 必填 | 说明 | 6871| ------ | ----------------------- | ---- | ---------------- | 6872| mode | [BlendMode](#blendmode) | 是 | 颜色的混合模式。 | 6873 6874**错误码:** 6875 6876以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 6877 6878| 错误码ID | 错误信息 | 6879| ------- | --------------------------------------------| 6880| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 6881 6882**示例:** 6883 6884```ts 6885import { drawing } from '@kit.ArkGraphics2D'; 6886const pen = new drawing.Pen(); 6887pen.setBlendMode(drawing.BlendMode.SRC); 6888``` 6889 6890### setJoinStyle<sup>12+</sup> 6891 6892setJoinStyle(style: JoinStyle): void 6893 6894用于设置画笔绘制转角的样式。 6895 6896**系统能力:** SystemCapability.Graphics.Drawing 6897 6898**参数:** 6899 6900| 参数名 | 类型 | 必填 | 说明 | 6901| ------ | ----------------------- | ---- | --------------- | 6902| style | [JoinStyle](#joinstyle12) | 是 | 折线转角样式。 | 6903 6904**错误码:** 6905 6906以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 6907 6908| 错误码ID | 错误信息 | 6909| ------- | --------------------------------------------| 6910| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 6911 6912**示例:** 6913 6914```ts 6915import { RenderNode } from '@kit.ArkUI'; 6916import { common2D, drawing } from '@kit.ArkGraphics2D'; 6917class DrawingRenderNode extends RenderNode { 6918 draw(context : DrawContext) { 6919 const canvas = context.canvas; 6920 const pen = new drawing.Pen(); 6921 pen.setStrokeWidth(5); 6922 pen.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 6923 pen.setJoinStyle(drawing.JoinStyle.ROUND_JOIN); 6924 } 6925} 6926``` 6927 6928### getJoinStyle<sup>12+</sup> 6929 6930getJoinStyle(): JoinStyle 6931 6932用于获取画笔绘制转角的样式。 6933 6934**系统能力:** SystemCapability.Graphics.Drawing 6935 6936**返回值:** 6937 6938| 类型 | 说明 | 6939| ------------- | ---------------------- | 6940| JoinStyle | 返回折线转角的样式。 | 6941 6942**示例:** 6943 6944```ts 6945import { RenderNode } from '@kit.ArkUI'; 6946import { common2D, drawing } from '@kit.ArkGraphics2D'; 6947class DrawingRenderNode extends RenderNode { 6948 draw(context : DrawContext) { 6949 const canvas = context.canvas; 6950 const pen = new drawing.Pen(); 6951 pen.setStrokeWidth(5); 6952 pen.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 6953 pen.setJoinStyle(drawing.JoinStyle.ROUND_JOIN); 6954 let joinStyle = pen.getJoinStyle(); 6955 } 6956} 6957``` 6958 6959### setCapStyle<sup>12+</sup> 6960 6961setCapStyle(style: CapStyle): void 6962 6963用于设置线帽样式。 6964 6965**系统能力:** SystemCapability.Graphics.Drawing 6966 6967**参数:** 6968 6969| 参数名 | 类型 | 必填 | 说明 | 6970| ------ | ----------------------- | ---- | --------------------- | 6971| style | [CapStyle](#capstyle12) | 是 | 描述线帽样式的变量。 | 6972 6973**错误码:** 6974 6975以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 6976 6977| 错误码ID | 错误信息 | 6978| ------- | --------------------------------------------| 6979| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 6980 6981**示例:** 6982 6983```ts 6984import { RenderNode } from '@kit.ArkUI'; 6985import { common2D, drawing } from '@kit.ArkGraphics2D'; 6986class DrawingRenderNode extends RenderNode { 6987 draw(context : DrawContext) { 6988 const canvas = context.canvas; 6989 const pen = new drawing.Pen(); 6990 pen.setStrokeWidth(5); 6991 pen.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 6992 pen.setCapStyle(drawing.CapStyle.SQUARE_CAP); 6993 } 6994} 6995``` 6996 6997### getCapStyle<sup>12+</sup> 6998 6999getCapStyle(): CapStyle 7000 7001用于获取画笔的线帽样式。 7002 7003**系统能力:** SystemCapability.Graphics.Drawing 7004 7005**返回值:** 7006 7007| 类型 | 说明 | 7008| ------------ | ------------------ | 7009| CapStyle | 返回画笔的线帽样式。 | 7010 7011**示例:** 7012 7013```ts 7014import { RenderNode } from '@kit.ArkUI'; 7015import { common2D, drawing } from '@kit.ArkGraphics2D'; 7016class DrawingRenderNode extends RenderNode { 7017 draw(context : DrawContext) { 7018 const canvas = context.canvas; 7019 const pen = new drawing.Pen(); 7020 pen.setStrokeWidth(5); 7021 pen.setColor({alpha: 255, red: 255, green: 0, blue: 0}); 7022 pen.setCapStyle(drawing.CapStyle.SQUARE_CAP); 7023 let capStyle = pen.getCapStyle(); 7024 } 7025} 7026``` 7027 7028### setDither 7029 7030setDither(dither: boolean) : void 7031 7032开启画笔的抖动绘制效果。抖动绘制可以使得绘制出的颜色更加真实。 7033 7034**系统能力:** SystemCapability.Graphics.Drawing 7035 7036**参数:** 7037 7038| 参数名 | 类型 | 必填 | 说明 | 7039| ------ | ------- | ---- | --------------------------------------------------------- | 7040| dither | boolean | 是 | 是否开启画笔的抖动绘制效果。true表示开启,false表示关闭。 | 7041 7042**错误码:** 7043 7044以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 7045 7046| 错误码ID | 错误信息 | 7047| ------- | --------------------------------------------| 7048| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 7049 7050**示例:** 7051 7052```ts 7053import { drawing } from '@kit.ArkGraphics2D'; 7054const pen = new drawing.Pen(); 7055pen.setDither(true); 7056``` 7057 7058### getFillPath<sup>12+</sup> 7059 7060getFillPath(src: Path, dst: Path): boolean 7061 7062获取使用画笔绘制的源路径轮廓,并用目标路径表示。 7063 7064**系统能力:** SystemCapability.Graphics.Drawing 7065 7066**参数:** 7067 7068| 参数名 | 类型 | 必填 | 说明 | 7069| -------- | -------------------------------------------- | ---- | ------------------------------- | 7070| src | [Path](#path) | 是 | 源路径对象。 | 7071| dst | [Path](#path) | 是 | 目标路径对象。 | 7072 7073**返回值:** 7074 7075| 类型 | 说明 | 7076| --------------------- | -------------- | 7077| boolean | 返回获取源路径轮廓是否成功的结果,true表示获取成功,false表示获取失败。 | 7078 7079**错误码:** 7080 7081以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 7082 7083| 错误码ID | 错误信息 | 7084| ------- | --------------------------------------------| 7085| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 7086 7087**示例:** 7088 7089```ts 7090import { drawing } from '@kit.ArkGraphics2D'; 7091let pen = new drawing.Pen(); 7092let pathSrc: drawing.Path = new drawing.Path(); 7093let pathDst: drawing.Path = new drawing.Path(); 7094pathSrc.moveTo(0, 0); 7095pathSrc.lineTo(700, 700); 7096let value = pen.getFillPath(pathSrc, pathDst); 7097``` 7098 7099### reset<sup>12+</sup> 7100 7101reset(): void 7102 7103重置当前画笔为初始状态。 7104 7105**系统能力:** SystemCapability.Graphics.Drawing 7106 7107**示例:** 7108 7109```ts 7110import { drawing } from '@kit.ArkGraphics2D'; 7111 7112const pen = new drawing.Pen(); 7113pen.reset(); 7114``` 7115 7116## Brush 7117 7118画刷对象,描述所绘制图形的填充信息。 7119 7120### constructor<sup>12+</sup> 7121 7122constructor() 7123 7124构造一个新的画刷对象。 7125 7126**系统能力:** SystemCapability.Graphics.Drawing 7127 7128**示例:** 7129 7130```ts 7131import { drawing } from '@kit.ArkGraphics2D'; 7132 7133const brush = new drawing.Brush(); 7134``` 7135 7136### constructor<sup>12+</sup> 7137 7138constructor(brush: Brush) 7139 7140复制构造一个新的画刷对象。 7141 7142**系统能力:** SystemCapability.Graphics.Drawing 7143 7144**参数:** 7145 7146| 参数名 | 类型 | 必填 | 说明 | 7147| ------| ----------- | ---- | ---------------- | 7148| brush | [Brush](#brush) | 是 | 待复制的画刷对象。 | 7149 7150**错误码:** 7151 7152以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 7153 7154| 错误码ID | 错误信息 | 7155| ------- | --------------------------------------------| 7156| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 7157 7158**示例:** 7159 7160```ts 7161import { common2D, drawing } from '@kit.ArkGraphics2D'; 7162 7163const brush = new drawing.Brush(); 7164const brushColor: common2D.Color = { alpha: 255, red: 0, green: 255, blue: 0 }; 7165brush.setColor(brushColor); 7166const newBrush = new drawing.Brush(brush); 7167``` 7168 7169### setColor 7170 7171setColor(color: common2D.Color) : void 7172 7173用于设置画刷的颜色。 7174 7175**系统能力:** SystemCapability.Graphics.Drawing 7176 7177**参数:** 7178 7179| 参数名 | 类型 | 必填 | 说明 | 7180| ------ | ---------------------------------------------------- | ---- | ---------------- | 7181| color | [common2D.Color](js-apis-graphics-common2D.md#color) | 是 | ARGB格式的颜色,每个颜色通道是0到255之间的整数。 | 7182 7183**错误码:** 7184 7185以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 7186 7187| 错误码ID | 错误信息 | 7188| ------- | --------------------------------------------| 7189| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 7190 7191**示例:** 7192 7193```ts 7194import { common2D, drawing } from '@kit.ArkGraphics2D'; 7195const color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 }; 7196const brush = new drawing.Brush(); 7197brush.setColor(color); 7198``` 7199 7200### setColor<sup>12+</sup> 7201 7202setColor(alpha: number, red: number, green: number, blue: number): void 7203 7204用于设置画刷的颜色。性能优于[setColor](#setcolor-1)接口,推荐使用本接口。 7205 7206**系统能力:** SystemCapability.Graphics.Drawing 7207 7208**参数:** 7209 7210| 参数名 | 类型 | 必填 | 说明 | 7211| ------ | ------ | ---- | -------------------------------------------------- | 7212| alpha | number | 是 | ARGB格式颜色的透明度通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。 | 7213| red | number | 是 | ARGB格式颜色的红色通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。 | 7214| green | number | 是 | ARGB格式颜色的绿色通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。 | 7215| blue | number | 是 | ARGB格式颜色的蓝色通道值,该参数是0到255之间的整数,传入范围内的浮点数会向下取整。 | 7216 7217**错误码:** 7218 7219以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 7220 7221| 错误码ID | 错误信息 | 7222| ------- | --------------------------------------------| 7223| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 7224 7225**示例:** 7226 7227```ts 7228import { drawing } from '@kit.ArkGraphics2D'; 7229const brush = new drawing.Brush(); 7230brush.setColor(255, 255, 0, 0); 7231``` 7232 7233### setColor<sup>18+</sup> 7234 7235setColor(color: number) : void 7236 7237用于设置画刷的颜色。 7238 7239**系统能力:** SystemCapability.Graphics.Drawing 7240 7241**参数:** 7242 7243| 参数名 | 类型 | 必填 | 说明 | 7244| ------ | ---------------------------------------------------- | ---- | ---------------- | 7245| color | number | 是 | 16进制ARGB格式的颜色。 | 7246 7247**错误码:** 7248 7249以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 7250 7251| 错误码ID | 错误信息 | 7252| ------- | --------------------------------------------| 7253| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 7254 7255**示例:** 7256 7257```ts 7258import { drawing } from '@kit.ArkGraphics2D'; 7259const brush = new drawing.Brush(); 7260brush.setColor(0xffff0000); 7261``` 7262 7263### getColor<sup>12+</sup> 7264 7265getColor(): common2D.Color 7266 7267获取画刷的颜色。 7268 7269**系统能力:** SystemCapability.Graphics.Drawing 7270 7271**返回值:** 7272 7273| 类型 | 说明 | 7274| -------------- | -------------- | 7275| common2D.Color | 返回画刷的颜色。 | 7276 7277**示例:** 7278 7279```ts 7280import { common2D, drawing } from '@kit.ArkGraphics2D'; 7281 7282const color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 }; 7283const brush = new drawing.Brush(); 7284brush.setColor(color); 7285let colorGet = brush.getColor(); 7286``` 7287 7288### getHexColor<sup>18+</sup> 7289 7290getHexColor(): number 7291 7292获取画刷的颜色。 7293 7294**系统能力:** SystemCapability.Graphics.Drawing 7295 7296**返回值:** 7297 7298| 类型 | 说明 | 7299| -------------- | -------------- | 7300| number | 返回画刷的颜色,以16进制ARGB格式的32位无符号整数表示。 | 7301 7302**示例:** 7303 7304```ts 7305import { common2D, drawing } from '@kit.ArkGraphics2D'; 7306 7307let color : common2D.Color = { alpha: 255, red: 255, green: 0, blue: 0 }; 7308let brush = new drawing.Brush(); 7309brush.setColor(color); 7310let hex_color: number = brush.getHexColor(); 7311console.info('getHexColor: ', hex_color.toString(16)); 7312``` 7313 7314### setAntiAlias 7315 7316setAntiAlias(aa: boolean) : void 7317 7318用于设置画刷是否开启抗锯齿。开启后,可以使得图形的边缘在显示时更平滑。 7319 7320**系统能力:** SystemCapability.Graphics.Drawing 7321 7322**参数:** 7323 7324| 参数名 | 类型 | 必填 | 说明 | 7325| ------ | ------- | ---- | ------------------------------------------------- | 7326| aa | boolean | 是 | 表示是否开启抗锯齿。true表示开启,false表示关闭。 | 7327 7328**错误码:** 7329 7330以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 7331 7332| 错误码ID | 错误信息 | 7333| ------- | --------------------------------------------| 7334| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 7335 7336**示例:** 7337 7338```ts 7339import { drawing } from '@kit.ArkGraphics2D'; 7340const brush = new drawing.Brush(); 7341brush.setAntiAlias(true); 7342``` 7343 7344### isAntiAlias<sup>12+</sup> 7345 7346isAntiAlias(): boolean 7347 7348获取画刷是否开启抗锯齿属性。 7349 7350**系统能力:** SystemCapability.Graphics.Drawing 7351 7352**返回值:** 7353 7354| 类型 | 说明 | 7355| ------- | ------------------------- | 7356| boolean | 返回画刷是否开启抗锯齿属性,true表示开启抗锯齿属性,false表示关闭抗锯齿属性。 | 7357 7358**示例:** 7359 7360```ts 7361import { drawing } from '@kit.ArkGraphics2D'; 7362 7363const brush = new drawing.Brush(); 7364let isAntiAlias = brush.isAntiAlias(); 7365``` 7366 7367### setAlpha 7368 7369setAlpha(alpha: number) : void 7370 7371用于设置画刷的透明度。 7372 7373**系统能力:** SystemCapability.Graphics.Drawing 7374 7375**参数:** 7376 7377| 参数名 | 类型 | 必填 | 说明 | 7378| ------ | ------ | ---- | ---------------------------------------- | 7379| alpha | number | 是 | 用于表示透明度的[0, 255]区间内的整数值,传入浮点类型时向下取整。 | 7380 7381**错误码:** 7382 7383以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 7384 7385| 错误码ID | 错误信息 | 7386| ------- | --------------------------------------------| 7387| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 7388 7389**示例:** 7390 7391```ts 7392import { drawing } from '@kit.ArkGraphics2D'; 7393const brush = new drawing.Brush(); 7394brush.setAlpha(128); 7395``` 7396 7397### getAlpha<sup>12+</sup> 7398 7399getAlpha(): number 7400 7401获取画刷的透明度。 7402 7403**系统能力:** SystemCapability.Graphics.Drawing 7404 7405**返回值:** 7406 7407| 类型 | 说明 | 7408| ------ | ---------------- | 7409| number | 返回画刷的透明度,该返回值为0到255之间的整数。 | 7410 7411**示例:** 7412 7413```ts 7414import { drawing } from '@kit.ArkGraphics2D'; 7415 7416const brush = new drawing.Brush(); 7417let alpha = brush.getAlpha(); 7418``` 7419 7420### setColorFilter 7421 7422setColorFilter(filter: ColorFilter) : void 7423 7424用于给画刷添加额外的颜色滤波器。 7425 7426**系统能力:** SystemCapability.Graphics.Drawing 7427 7428**参数:** 7429 7430| 参数名 | 类型 | 必填 | 说明 | 7431| ------ | --------------------------- | ---- | ------------ | 7432| filter | [ColorFilter](#colorfilter) | 是 | 颜色滤波器。为null时表示清空颜色滤波器。 | 7433 7434**错误码:** 7435 7436以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 7437 7438| 错误码ID | 错误信息 | 7439| ------- | --------------------------------------------| 7440| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 7441 7442**示例:** 7443 7444```ts 7445import { drawing } from '@kit.ArkGraphics2D'; 7446const brush = new drawing.Brush(); 7447let colorFilter = drawing.ColorFilter.createLinearToSRGBGamma(); 7448brush.setColorFilter(colorFilter); 7449``` 7450 7451### setMaskFilter<sup>12+</sup> 7452 7453setMaskFilter(filter: MaskFilter): void 7454 7455用于给画刷添加额外的蒙版滤镜。 7456 7457**系统能力:** SystemCapability.Graphics.Drawing 7458 7459**参数:** 7460 7461| 参数名 | 类型 | 必填 | 说明 | 7462| ------ | ------------------------- | ---- | --------- | 7463| filter | [MaskFilter](#maskfilter12) | 是 | 蒙版滤镜。为null时表示清空蒙版滤镜。 | 7464 7465**错误码:** 7466 7467以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 7468 7469| 错误码ID | 错误信息 | 7470| ------- | --------------------------------------------| 7471| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 7472 7473**示例:** 7474 7475```ts 7476import { RenderNode } from '@kit.ArkUI'; 7477import { common2D, drawing } from '@kit.ArkGraphics2D'; 7478class DrawingRenderNode extends RenderNode { 7479 draw(context : DrawContext) { 7480 const canvas = context.canvas; 7481 const brush = new drawing.Brush(); 7482 let maskFilter = drawing.MaskFilter.createBlurMaskFilter(drawing.BlurType.OUTER, 10); 7483 brush.setMaskFilter(maskFilter); 7484 } 7485} 7486``` 7487 7488### setShaderEffect<sup>12+</sup> 7489 7490setShaderEffect(shaderEffect: ShaderEffect): void 7491 7492设置画刷着色器效果。 7493 7494**系统能力:** SystemCapability.Graphics.Drawing 7495 7496**参数:** 7497 7498| 参数名 | 类型 | 必填 | 说明 | 7499| ------- | ------------------------- | ---- | ------------ | 7500| shaderEffect | [ShaderEffect](#shadereffect12) | 是 | 着色器对象。为null时表示清空着色器效果。 | 7501 7502**错误码:** 7503 7504以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 7505 7506| 错误码ID | 错误信息 | 7507| ------- | --------------------------------------------| 7508| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 7509 7510**示例:** 7511 7512```ts 7513import { drawing } from '@kit.ArkGraphics2D'; 7514 7515const brush = new drawing.Brush(); 7516let shaderEffect = drawing.ShaderEffect.createLinearGradient({x: 100, y: 100}, {x: 300, y: 300}, [0xFF00FF00, 0xFFFF0000], drawing.TileMode.REPEAT); 7517brush.setShaderEffect(shaderEffect); 7518``` 7519 7520### setShadowLayer<sup>12+</sup> 7521 7522setShadowLayer(shadowLayer: ShadowLayer): void 7523 7524设置画刷阴影层效果。当前仅在绘制文字时生效。 7525 7526**系统能力:** SystemCapability.Graphics.Drawing 7527 7528**参数:** 7529 7530| 参数名 | 类型 | 必填 | 说明 | 7531| ------- | ------------------------- | ---- | --------- | 7532| shadowLayer | [ShadowLayer](#shadowlayer12) | 是 | 阴影层对象。为null时表示清空阴影层效果。 | 7533 7534**错误码:** 7535 7536以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 7537 7538| 错误码ID | 错误信息 | 7539| ------- | --------------------------------------------| 7540| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 7541 7542**示例:** 7543 7544```ts 7545import { RenderNode } from '@kit.ArkUI'; 7546import { common2D, drawing } from '@kit.ArkGraphics2D'; 7547class DrawingRenderNode extends RenderNode { 7548 draw(context : DrawContext) { 7549 const canvas = context.canvas; 7550 let font = new drawing.Font(); 7551 font.setSize(60); 7552 7553 let textBlob = drawing.TextBlob.makeFromString("hello", font, drawing.TextEncoding.TEXT_ENCODING_UTF8); 7554 let pen = new drawing.Pen(); 7555 pen.setStrokeWidth(2.0); 7556 7557 let pen_color : common2D.Color = {alpha: 0xFF, red: 0xFF, green: 0x00, blue: 0x00}; 7558 pen.setColor(pen_color); 7559 canvas.attachPen(pen); 7560 canvas.drawTextBlob(textBlob, 100, 100); 7561 canvas.detachPen(); 7562 7563 let color : common2D.Color = {alpha: 0xFF, red: 0x00, green: 0xFF, blue: 0x00}; 7564 let shadowLayer = drawing.ShadowLayer.create(3, -3, 3, color); 7565 pen.setShadowLayer(shadowLayer); 7566 canvas.attachPen(pen); 7567 canvas.drawTextBlob(textBlob, 100, 200); 7568 canvas.detachPen(); 7569 7570 let brush = new drawing.Brush(); 7571 let brush_color : common2D.Color = {alpha: 0xFF, red: 0xFF, green: 0x00, blue: 0x00}; 7572 brush.setColor(brush_color); 7573 canvas.attachBrush(brush); 7574 canvas.drawTextBlob(textBlob, 300, 100); 7575 canvas.detachBrush(); 7576 7577 brush.setShadowLayer(shadowLayer); 7578 canvas.attachBrush(brush); 7579 canvas.drawTextBlob(textBlob, 300, 200); 7580 canvas.detachBrush(); 7581 } 7582} 7583``` 7584 7585### setBlendMode 7586 7587setBlendMode(mode: BlendMode) : void 7588 7589用于设置画刷的混合模式。 7590 7591**系统能力:** SystemCapability.Graphics.Drawing 7592 7593**参数:** 7594 7595| 参数名 | 类型 | 必填 | 说明 | 7596| ------ | ----------------------- | ---- | ---------------- | 7597| mode | [BlendMode](#blendmode) | 是 | 颜色的混合模式。 | 7598 7599**错误码:** 7600 7601以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 7602 7603| 错误码ID | 错误信息 | 7604| ------- | --------------------------------------------| 7605| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 7606 7607**示例:** 7608 7609```ts 7610import { drawing } from '@kit.ArkGraphics2D'; 7611const brush = new drawing.Brush(); 7612brush.setBlendMode(drawing.BlendMode.SRC); 7613``` 7614 7615### setImageFilter<sup>12+</sup> 7616 7617setImageFilter(filter: ImageFilter | null): void 7618 7619为画刷设置图像滤波器。 7620 7621**系统能力:** SystemCapability.Graphics.Drawing 7622 7623**参数:** 7624 7625| 参数名 | 类型 | 必填 | 说明 | 7626| ------ | ------ | ---- | ----------------------- | 7627| filter | [ImageFilter](#imagefilter12) \| null | 是 | 图像滤波器,为null表示清空图像滤波器效果。 | 7628 7629**错误码:** 7630 7631以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 7632 7633| 错误码ID | 错误信息 | 7634| ------- | --------------------------------------------| 7635| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types. | 7636 7637**示例:** 7638 7639```ts 7640import {drawing} from '@kit.ArkGraphics2D'; 7641let brush = new drawing.Brush(); 7642let imgFilter = drawing.ImageFilter.createBlurImageFilter(5, 10, drawing.TileMode.DECAL); 7643brush.setImageFilter(imgFilter); 7644brush.setImageFilter(null); 7645``` 7646 7647### getColorFilter<sup>12+</sup> 7648 7649getColorFilter(): ColorFilter 7650 7651获取画刷的颜色滤波器。 7652 7653**系统能力:** SystemCapability.Graphics.Drawing 7654 7655**返回值:** 7656 7657| 类型 | 说明 | 7658| --------------------------- | ------------------ | 7659| [ColorFilter](#colorfilter) | 返回一个颜色滤波器。 | 7660 7661**示例:** 7662 7663```ts 7664import {drawing} from '@kit.ArkGraphics2D'; 7665let brush = new drawing.Brush(); 7666let setColorFilter = drawing.ColorFilter.createSRGBGammaToLinear(); 7667brush.setColorFilter(setColorFilter); 7668let filter = brush.getColorFilter(); 7669``` 7670 7671### reset<sup>12+</sup> 7672 7673reset(): void 7674 7675重置当前画刷为初始状态。 7676 7677**系统能力:** SystemCapability.Graphics.Drawing 7678 7679**示例:** 7680 7681```ts 7682import { drawing } from '@kit.ArkGraphics2D'; 7683 7684const brush = new drawing.Brush(); 7685brush.reset(); 7686``` 7687 7688## ScaleToFit<sup>12+</sup> 7689 7690源矩形到目标矩形的缩放方式枚举。 7691 7692**系统能力**:SystemCapability.Graphics.Drawing 7693 7694| 名称 | 值 | 说明 | 7695| ---------------------- | ---- | ------------------------------ | 7696| FILL_SCALE_TO_FIT | 0 | 将源矩形缩放以填充满整个目标矩形,可能会改变源矩形的长宽比。 | 7697| START_SCALE_TO_FIT | 1 | 保持源矩形的长宽比进行缩放,并对齐到目标矩形的左上方。 | 7698| CENTER_SCALE_TO_FIT | 2 | 保持源矩形的长宽比进行缩放,并居中对齐到目标矩形。 | 7699| END_SCALE_TO_FIT | 3 | 保持源矩形的长宽比进行缩放,并对齐到目标矩形的右下方。 | 7700 7701## Matrix<sup>12+</sup> 7702 7703矩阵对象。 7704 7705表示为3*3的矩阵,如下图所示: 7706 7707 7708 7709矩阵中的元素从左到右,从上到下分别表示水平缩放系数、水平倾斜系数、水平位移系数、垂直倾斜系数、垂直缩放系数、垂直位移系数、X轴透视系数、Y轴透视系数、透视缩放系数。 7710设(x<sub>1</sub>, y<sub>1</sub>)为源坐标点,(x<sub>2</sub>, y<sub>2</sub>)为源坐标点通过矩阵变换后的坐标点,则两个坐标点的关系如下: 7711 7712 7713 7714### constructor<sup>12+</sup> 7715 7716constructor() 7717 7718用于构造一个矩阵对象。 7719 7720**系统能力:** SystemCapability.Graphics.Drawing 7721 7722**示例:** 7723 7724```ts 7725import { drawing } from '@kit.ArkGraphics2D'; 7726 7727let matrix = new drawing.Matrix(); 7728``` 7729 7730### setRotation<sup>12+</sup> 7731 7732setRotation(degree: number, px: number, py: number): void 7733 7734设置矩阵为单位矩阵,并围绕位于(px, py)的旋转轴点进行旋转。 7735 7736**系统能力:** SystemCapability.Graphics.Drawing 7737 7738**参数:** 7739 7740| 参数名 | 类型 | 必填 | 说明 | 7741| ----------- | ---------------------------------------- | ---- | ------------------- | 7742| degree | number | 是 | 角度,单位为度。正数表示顺时针旋转,负数表示逆时针旋转,该参数为浮点数。| 7743| px | number | 是 | 旋转轴点的横坐标,该参数为浮点数。 | 7744| py | number | 是 | 旋转轴点的纵坐标,该参数为浮点数。 | 7745 7746**错误码:** 7747 7748以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 7749 7750| 错误码ID | 错误信息 | 7751| ------- | --------------------------------------------| 7752| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 7753 7754**示例:** 7755 7756```ts 7757import { drawing } from '@kit.ArkGraphics2D'; 7758 7759let matrix = new drawing.Matrix(); 7760matrix.setRotation(90, 100, 100); 7761``` 7762 7763### setScale<sup>12+</sup> 7764 7765setScale(sx: number, sy: number, px: number, py: number): void 7766 7767设置矩阵为单位矩阵围绕位于(px, py)的中心点,以sx和sy进行缩放后的结果。 7768 7769**系统能力:** SystemCapability.Graphics.Drawing 7770 7771**参数:** 7772 7773| 参数名 | 类型 | 必填 | 说明 | 7774| ----------- | ---------------------------------------- | ---- | ------------------- | 7775| sx | number | 是 | x轴方向缩放系数,为负数时可看作是先关于y = px作镜像翻转后再进行缩放,该参数为浮点数。 | 7776| sy | number | 是 | y轴方向缩放系数,为负数时可看作是先关于x = py作镜像翻转后再进行缩放,该参数为浮点数。 | 7777| px | number | 是 | 缩放中心点的横坐标,该参数为浮点数。 | 7778| py | number | 是 | 缩放中心点的纵坐标,该参数为浮点数。 | 7779 7780**错误码:** 7781 7782以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 7783 7784| 错误码ID | 错误信息 | 7785| ------- | --------------------------------------------| 7786| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 7787 7788**示例:** 7789 7790```ts 7791import { drawing } from '@kit.ArkGraphics2D'; 7792 7793let matrix = new drawing.Matrix(); 7794matrix.setScale(100, 100, 150, 150); 7795``` 7796 7797### setTranslation<sup>12+</sup> 7798 7799setTranslation(dx: number, dy: number): void 7800 7801设置矩阵为单位矩阵平移(dx, dy)后的结果。 7802 7803**系统能力:** SystemCapability.Graphics.Drawing 7804 7805**参数:** 7806 7807| 参数名 | 类型 | 必填 | 说明 | 7808| ----------- | ---------------------------------------- | ---- | ------------------- | 7809| dx | number | 是 | x轴方向平移距离,正数表示往x轴正方向平移,负数表示往x轴负方向平移,该参数为浮点数。 | 7810| dy | number | 是 | y轴方向平移距离,正数表示往y轴正方向平移,负数表示往y轴负方向平移,该参数为浮点数。 | 7811 7812**错误码:** 7813 7814以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 7815 7816| 错误码ID | 错误信息 | 7817| ------- | --------------------------------------------| 7818| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 7819 7820**示例:** 7821 7822```ts 7823import { drawing } from '@kit.ArkGraphics2D'; 7824 7825let matrix = new drawing.Matrix(); 7826matrix.setTranslation(100, 100); 7827``` 7828 7829### setMatrix<sup>12+</sup> 7830 7831setMatrix(values: Array\<number>): void 7832 7833用于设置矩阵对象的各项参数。 7834 7835**系统能力:** SystemCapability.Graphics.Drawing 7836 7837**参数:** 7838 7839| 参数名 | 类型 | 必填 | 说明 | 7840| ------ | ---------------------------------------------------- | ---- | ---------------- | 7841| values | Array\<number> | 是 | 长度为9的浮点数组,表示矩阵对象参数。数组中的值按下标从小,到大分别表示水平缩放系数、水平倾斜系数、水平位移系数、垂直倾斜系数、垂直缩放系数、垂直位移系数、X轴透视系数、Y轴透视系数、透视缩放系数。 | 7842 7843**错误码:** 7844 7845以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 7846 7847| 错误码ID | 错误信息 | 7848| ------- | --------------------------------------------| 7849| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types; 3. Parameter verification failed. | 7850 7851**示例:** 7852 7853```ts 7854import { drawing } from '@kit.ArkGraphics2D'; 7855 7856let matrix = new drawing.Matrix(); 7857let value : Array<number> = [2, 2, 2, 2, 2, 2, 2, 2, 2]; 7858matrix.setMatrix(value); 7859``` 7860 7861### preConcat<sup>12+</sup> 7862 7863preConcat(matrix: Matrix): void 7864 7865将当前矩阵设置为当前矩阵左乘matrix的结果。 7866 7867**系统能力:** SystemCapability.Graphics.Drawing 7868 7869**参数:** 7870 7871| 参数名 | 类型 | 必填 | 说明 | 7872| ------ | ---------------------------------------------------- | ---- | ---------------- | 7873| matrix | [Matrix](#matrix12) | 是 | 表示矩阵对象,位于乘法表达式右侧。 | 7874 7875**错误码:** 7876 7877以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 7878 7879| 错误码ID | 错误信息 | 7880| ------- | --------------------------------------------| 7881| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 7882 7883**示例:** 7884 7885```ts 7886import { drawing } from '@kit.ArkGraphics2D'; 7887 7888let matrix1 = new drawing.Matrix(); 7889matrix1.setMatrix([2, 1, 3, 1, 2, 1, 3, 1, 2]); 7890let matrix2 = new drawing.Matrix(); 7891matrix2.setMatrix([-2, 1, 3, 1, 0, -1, 3, -1, 2]); 7892matrix1.preConcat(matrix2); 7893``` 7894 7895### isEqual<sup>12+</sup> 7896 7897isEqual(matrix: Matrix): Boolean 7898 7899判断两个矩阵是否相等。 7900 7901**系统能力:** SystemCapability.Graphics.Drawing 7902 7903**参数:** 7904 7905| 参数名 | 类型 | 必填 | 说明 | 7906| ------ | ---------------------------------------------------- | ---- | ---------------- | 7907| matrix | [Matrix](#matrix12) | 是 | 另一个矩阵。 | 7908 7909**返回值:** 7910 7911| 类型 | 说明 | 7912| --------------------------- | -------------------- | 7913| Boolean | 返回两个矩阵的比较结果。true表示两个矩阵相等,false表示两个矩阵不相等。 | 7914 7915**错误码:** 7916 7917以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 7918 7919| 错误码ID | 错误信息 | 7920| ------- | --------------------------------------------| 7921| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 7922 7923**示例:** 7924 7925```ts 7926import { drawing } from '@kit.ArkGraphics2D'; 7927 7928let matrix1 = new drawing.Matrix(); 7929matrix1.setMatrix([2, 1, 3, 1, 2, 1, 3, 1, 2]); 7930let matrix2 = new drawing.Matrix(); 7931matrix2.setMatrix([-2, 1, 3, 1, 0, -1, 3, -1, 2]); 7932if (matrix1.isEqual(matrix2)) { 7933 console.info("matrix1 and matrix2 are equal."); 7934} else { 7935 console.info("matrix1 and matrix2 are not equal."); 7936} 7937``` 7938 7939### invert<sup>12+</sup> 7940 7941invert(matrix: Matrix): Boolean 7942 7943将矩阵matrix设置为当前矩阵的逆矩阵,并返回是否设置成功的结果。 7944 7945**系统能力:** SystemCapability.Graphics.Drawing 7946 7947**参数:** 7948 7949| 参数名 | 类型 | 必填 | 说明 | 7950| ------ | ---------------------------------------------------- | ---- | ---------------- | 7951| matrix | [Matrix](#matrix12) | 是 | 矩阵对象,用于存储获取到的逆矩阵。 | 7952 7953**返回值:** 7954 7955| 类型 | 说明 | 7956| --------------------------- | -------------------- | 7957| Boolean | 返回matrix是否被设置为逆矩阵的结果。true表示当前矩阵可逆,matrix被填充为逆矩阵,false表示当前矩阵不可逆,matrix不被改变。 | 7958 7959**错误码:** 7960 7961以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 7962 7963| 错误码ID | 错误信息 | 7964| ------- | --------------------------------------------| 7965| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 7966 7967**示例:** 7968 7969```ts 7970import { drawing } from '@kit.ArkGraphics2D'; 7971 7972let matrix1 = new drawing.Matrix(); 7973matrix1.setMatrix([2, 1, 3, 1, 2, 1, 3, 1, 2]); 7974let matrix2 = new drawing.Matrix(); 7975matrix2.setMatrix([-2, 1, 3, 1, 0, -1, 3, -1, 2]); 7976if (matrix1.invert(matrix2)) { 7977 console.info("matrix1 is invertible and matrix2 is set as an inverse matrix of the matrix1."); 7978} else { 7979 console.info("matrix1 is not invertible and matrix2 is not changed."); 7980} 7981``` 7982 7983### isIdentity<sup>12+</sup> 7984 7985isIdentity(): Boolean 7986 7987判断矩阵是否是单位矩阵。 7988 7989**系统能力:** SystemCapability.Graphics.Drawing 7990 7991**返回值:** 7992 7993| 类型 | 说明 | 7994| --------------------------- | -------------------- | 7995| Boolean | 返回矩阵是否是单位矩阵。true表示矩阵是单位矩阵,false表示矩阵不是单位矩阵。 | 7996 7997**示例:** 7998 7999```ts 8000import { drawing } from '@kit.ArkGraphics2D'; 8001 8002let matrix = new drawing.Matrix(); 8003if (matrix.isIdentity()) { 8004 console.info("matrix is identity."); 8005} else { 8006 console.info("matrix is not identity."); 8007} 8008``` 8009 8010### getValue<sup>12+</sup> 8011 8012getValue(index: number): number 8013 8014获取矩阵给定索引位的值。索引范围0-8。 8015 8016**系统能力**:SystemCapability.Graphics.Drawing 8017 8018**参数:** 8019 8020| 参数名 | 类型 | 必填 | 说明 | 8021| --------------- | ------- | ---- | ----------------------------------------------------------- | 8022| index | number | 是 | 索引位置,范围0-8,该参数为整数。 | 8023 8024**返回值:** 8025 8026| 类型 | 说明 | 8027| --------------------- | -------------- | 8028| number | 函数返回矩阵给定索引位对应的值,该返回值为整数。 | 8029 8030**错误码:** 8031 8032以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 8033 8034| 错误码ID | 错误信息 | 8035| ------- | --------------------------------------------| 8036| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified;2. Incorrect parameter types;3. Parameter verification failed.| 8037 8038**示例:** 8039 8040```ts 8041import {drawing} from "@kit.ArkGraphics2D" 8042let matrix = new drawing.Matrix(); 8043for (let i = 0; i < 9; i++) { 8044 console.info("matrix "+matrix.getValue(i).toString()); 8045} 8046``` 8047 8048### postRotate<sup>12+</sup> 8049 8050postRotate(degree: number, px: number, py: number): void 8051 8052将矩阵设置为矩阵右乘围绕轴心点旋转一定角度的单位矩阵后得到的矩阵。 8053 8054**系统能力**:SystemCapability.Graphics.Drawing 8055 8056**参数:** 8057 8058| 参数名 | 类型 | 必填 | 说明 | 8059| --------------- | ------- | ---- | ----------------------------------------------------------- | 8060| degree | number | 是 | 旋转角度,单位为度。正数表示顺时针旋转,负数表示逆时针旋转,该参数为浮点数。 | 8061| px | number | 是 | 旋转中心点的横坐标,该参数为浮点数。 | 8062| py | number | 是 | 旋转中心点的纵坐标,该参数为浮点数。 | 8063 8064**错误码:** 8065 8066以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 8067 8068| 错误码ID | 错误信息 | 8069| ------- | --------------------------------------------| 8070| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 8071 8072**示例:** 8073 8074```ts 8075import {drawing} from "@kit.ArkGraphics2D" 8076let matrix = new drawing.Matrix(); 8077let degree: number = 2; 8078let px: number = 3; 8079let py: number = 4; 8080matrix.postRotate(degree, px, py); 8081console.info("matrix= "+matrix.getAll().toString()); 8082``` 8083 8084### postScale<sup>12+</sup> 8085 8086postScale(sx: number, sy: number, px: number, py: number): void 8087 8088将矩阵设置为矩阵右乘围绕轴心点按一定缩放系数缩放后的单位矩阵后得到的矩阵。 8089 8090**系统能力**:SystemCapability.Graphics.Drawing 8091 8092**参数:** 8093 8094| 参数名 | 类型 | 必填 | 说明 | 8095| --------------- | ------- | ---- | ----------------------------------------------------------- | 8096| sx | number | 是 | x轴方向缩放系数,为负数时可看作是先关于y = px作镜像翻转后再进行缩放,该参数为浮点数。 | 8097| sy | number | 是 | y轴方向缩放系数,为负数时可看作是先关于x = py作镜像翻转后再进行缩放,该参数为浮点数。 | 8098| px | number | 是 | 缩放中心点的横坐标,该参数为浮点数。 | 8099| py | number | 是 | 缩放中心点的纵坐标,该参数为浮点数。 | 8100 8101**错误码:** 8102 8103以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 8104 8105| 错误码ID | 错误信息 | 8106| ------- | --------------------------------------------| 8107| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 8108 8109**示例:** 8110 8111```ts 8112import {drawing} from "@kit.ArkGraphics2D" 8113let matrix = new drawing.Matrix(); 8114let sx: number = 2; 8115let sy: number = 0.5; 8116let px: number = 1; 8117let py: number = 1; 8118matrix.postScale(sx, sy, px, py); 8119console.info("matrix= "+matrix.getAll().toString()); 8120``` 8121 8122### postTranslate<sup>12+</sup> 8123 8124postTranslate(dx: number, dy: number): void 8125 8126将矩阵设置为矩阵右乘平移一定距离后的单位矩阵后得到的矩阵。 8127 8128**系统能力**:SystemCapability.Graphics.Drawing 8129 8130**参数:** 8131 8132| 参数名 | 类型 | 必填 | 说明 | 8133| --------------- | ------- | ---- | ----------------------------------------------------------- | 8134| dx | number | 是 | x轴方向平移距离,正数表示往x轴正方向平移,负数表示往x轴负方向平移,该参数为浮点数。 | 8135| dy | number | 是 | y轴方向平移距离,正数表示往y轴正方向平移,负数表示往y轴负方向平移,该参数为浮点数。 | 8136 8137**错误码:** 8138 8139以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 8140 8141| 错误码ID | 错误信息 | 8142| ------- | --------------------------------------------| 8143| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 8144 8145**示例:** 8146 8147```ts 8148import {drawing} from "@kit.ArkGraphics2D" 8149let matrix = new drawing.Matrix(); 8150let dx: number = 3; 8151let dy: number = 4; 8152matrix.postTranslate(dx, dy); 8153console.info("matrix= "+matrix.getAll().toString()); 8154``` 8155 8156### preRotate<sup>12+</sup> 8157 8158preRotate(degree: number, px: number, py: number): void 8159 8160将矩阵设置为矩阵左乘围绕轴心点旋转一定角度的单位矩阵后得到的矩阵。 8161 8162**系统能力**:SystemCapability.Graphics.Drawing 8163 8164**参数:** 8165 8166| 参数名 | 类型 | 必填 | 说明 | 8167| --------------- | ------- | ---- | ----------------------------------------------------------- | 8168| degree | number | 是 | 旋转角度,单位为度。正数表示顺时针旋转,负数表示逆时针旋转,该参数为浮点数。 | 8169| px | number | 是 | 旋转中心点的横坐标,该参数为浮点数。 | 8170| py | number | 是 | 旋转中心点的纵坐标,该参数为浮点数。 | 8171 8172**错误码:** 8173 8174以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 8175 8176| 错误码ID | 错误信息 | 8177| ------- | --------------------------------------------| 8178| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 8179 8180**示例:** 8181 8182```ts 8183import {drawing} from "@kit.ArkGraphics2D" 8184let matrix = new drawing.Matrix(); 8185let degree: number = 2; 8186let px: number = 3; 8187let py: number = 4; 8188matrix.preRotate(degree, px, py); 8189console.info("matrix= "+matrix.getAll().toString()); 8190``` 8191 8192### preScale<sup>12+</sup> 8193 8194preScale(sx: number, sy: number, px: number, py: number): void 8195 8196将矩阵设置为矩阵左乘围绕轴心点按一定缩放系数缩放后的单位矩阵后得到的矩阵。 8197 8198**系统能力**:SystemCapability.Graphics.Drawing 8199 8200**参数:** 8201 8202| 参数名 | 类型 | 必填 | 说明 | 8203| --------------- | ------- | ---- | ----------------------------------------------------------- | 8204| sx | number | 是 | x轴方向缩放系数,为负数时可看作是先关于y = px作镜像翻转后再进行缩放,该参数为浮点数。 | 8205| sy | number | 是 | y轴方向缩放系数,为负数时可看作是先关于x = py作镜像翻转后再进行缩放,该参数为浮点数。 | 8206| px | number | 是 | 轴心点横坐标,该参数为浮点数。 | 8207| py | number | 是 | 轴心点纵坐标,该参数为浮点数。 | 8208 8209**错误码:** 8210 8211以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 8212 8213| 错误码ID | 错误信息 | 8214| ------- | --------------------------------------------| 8215| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 8216 8217**示例:** 8218 8219```ts 8220import {drawing} from "@kit.ArkGraphics2D" 8221let matrix = new drawing.Matrix(); 8222let sx: number = 2; 8223let sy: number = 0.5; 8224let px: number = 1; 8225let py: number = 1; 8226matrix.preScale(sx, sy, px, py); 8227console.info("matrix"+matrix.getAll().toString()); 8228``` 8229 8230### preTranslate<sup>12+</sup> 8231 8232preTranslate(dx: number, dy: number): void 8233 8234将矩阵设置为矩阵左乘平移一定距离后的单位矩阵后得到的矩阵。 8235 8236**系统能力**:SystemCapability.Graphics.Drawing 8237 8238**参数:** 8239 8240| 参数名 | 类型 | 必填 | 说明 | 8241| --------------- | ------- | ---- | ----------------------------------------------------------- | 8242| dx | number | 是 | x轴方向平移距离,正数表示往x轴正方向平移,负数表示往x轴负方向平移,该参数为浮点数。 | 8243| dy | number | 是 | y轴方向平移距离,正数表示往y轴正方向平移,负数表示往y轴负方向平移,该参数为浮点数。 | 8244 8245**错误码:** 8246 8247以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 8248 8249| 错误码ID | 错误信息 | 8250| ------- | --------------------------------------------| 8251| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 8252 8253**示例:** 8254 8255```ts 8256import {drawing} from "@kit.ArkGraphics2D" 8257let matrix = new drawing.Matrix(); 8258let dx: number = 3; 8259let dy: number = 4; 8260matrix.preTranslate(dx, dy); 8261console.info("matrix"+matrix.getAll().toString()); 8262``` 8263 8264### reset<sup>12+</sup> 8265 8266reset(): void 8267 8268重置当前矩阵为单位矩阵。 8269 8270**系统能力**:SystemCapability.Graphics.Drawing 8271 8272**示例:** 8273 8274```ts 8275import {drawing} from "@kit.ArkGraphics2D" 8276let matrix = new drawing.Matrix(); 8277matrix.postScale(2, 3, 4, 5); 8278matrix.reset(); 8279console.info("matrix= "+matrix.getAll().toString()); 8280``` 8281 8282### mapPoints<sup>12+</sup> 8283 8284mapPoints(src: Array\<common2D.Point>): Array\<common2D.Point> 8285 8286通过矩阵变换将源点数组映射到目标点数组。 8287 8288**系统能力**:SystemCapability.Graphics.Drawing 8289 8290**参数:** 8291 8292| 参数名 | 类型 | 必填 | 说明 | 8293| --------------- | ------- | ---- | ----------------------------------------------------------- | 8294| src | Array\<[common2D.Point](js-apis-graphics-common2D.md#point)> | 是 | 源点数组。 | 8295 8296**返回值:** 8297 8298| 类型 | 说明 | 8299| --------------------- | -------------- | 8300| Array\<[common2D.Point](js-apis-graphics-common2D.md#point)> | 源点数组经矩阵变换后的点数组。 | 8301 8302**错误码:** 8303 8304以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 8305 8306| 错误码ID | 错误信息 | 8307| ------- | --------------------------------------------| 8308| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 8309 8310**示例:** 8311 8312```ts 8313import {drawing,common2D} from "@kit.ArkGraphics2D" 8314let src: Array<common2D.Point> = []; 8315src.push({x: 15, y: 20}); 8316src.push({x: 20, y: 15}); 8317src.push({x: 30, y: 10}); 8318let matrix = new drawing.Matrix(); 8319let dst: Array<common2D.Point> = matrix.mapPoints(src); 8320console.info("matrix= src: "+JSON.stringify(src)); 8321console.info("matrix= dst: "+JSON.stringify(dst)); 8322``` 8323 8324### getAll<sup>12+</sup> 8325 8326getAll(): Array\<number> 8327 8328获取矩阵所有元素值。 8329 8330**系统能力**:SystemCapability.Graphics.Drawing 8331 8332**返回值:** 8333 8334| 类型 | 说明 | 8335| --------------------- | -------------- | 8336| Array\<number> | 存储矩阵元素值的浮点数组,长度为9。 | 8337 8338**示例:** 8339 8340```ts 8341import {drawing} from "@kit.ArkGraphics2D" 8342let matrix = new drawing.Matrix(); 8343console.info("matrix "+ matrix.getAll()); 8344``` 8345 8346### mapRect<sup>12+</sup> 8347 8348mapRect(dst: common2D.Rect, src: common2D.Rect): boolean 8349 8350将目标矩形设置为源矩形通过矩阵变换后的图形的外接矩形。如下图所示,蓝色矩形为源矩形,假设黄色矩形为源矩形通过矩阵变换形成的图形,此时黄色矩形的边不与坐标轴平行,无法使用矩形对象表示,因此,将目标矩形设置为黄色矩形的外接矩形,即黑色矩形。 8351 8352 8353 8354**系统能力**:SystemCapability.Graphics.Drawing 8355 8356**参数:** 8357 8358| 参数名 | 类型 | 必填 | 说明 | 8359| --------------- | ------- | ---- | ----------------------------------------------------------- | 8360| dst | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是 | 目标矩形对象,用于存储源矩形经矩阵变换后的的图形的外接矩形。 | 8361| src |[common2D.Rect](js-apis-graphics-common2D.md#rect) | 是 | 源矩形对象。 | 8362 8363**返回值:** 8364 8365| 类型 | 说明 | 8366| --------------------- | -------------- | 8367| boolean | 返回源矩形经过矩阵变换后的图形是否仍然是矩形的结果,true表示是矩形,false表示不是矩形。 | 8368 8369**错误码:** 8370 8371以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 8372 8373| 错误码ID | 错误信息 | 8374| ------- | --------------------------------------------| 8375| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 8376 8377**示例:** 8378 8379```ts 8380import {drawing,common2D} from "@kit.ArkGraphics2D" 8381let dst: common2D.Rect = { left: 100, top: 20, right: 130, bottom: 60 }; 8382let src: common2D.Rect = { left: 100, top: 80, right: 130, bottom: 120 }; 8383let matrix = new drawing.Matrix(); 8384if (matrix.mapRect(dst, src)) { 8385 console.info("matrix= dst "+JSON.stringify(dst)); 8386} 8387``` 8388 8389### setRectToRect<sup>12+</sup> 8390 8391setRectToRect(src: common2D.Rect, dst: common2D.Rect, scaleToFit: ScaleToFit): boolean 8392 8393将当前矩阵设置为能使源矩形映射到目标矩形的变换矩阵。 8394 8395**系统能力**:SystemCapability.Graphics.Drawing 8396 8397**参数:** 8398 8399| 参数名 | 类型 | 必填 | 说明 | 8400| --------------- | ------- | ---- | ----------------------------------------------------------- | 8401| src | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是 | 源矩形。 | 8402| dst | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是 | 目标矩形。 | 8403| scaleToFit | [ScaleToFit](#scaletofit12) | 是 | 源矩形到目标矩形的映射方式。 | 8404 8405**返回值:** 8406 8407| 类型 | 说明 | 8408| --------------------- | -------------- | 8409| boolean | 返回矩阵是否可以表示矩形之间的映射,true表示可以,false表示不可以。特别地,如果源矩形的宽高任意一个小于等于0,则返回false,并将矩阵设置为单位矩阵;如果目标矩形的宽高任意一个小于等于0,则返回true,并将矩阵设置为除透视缩放系数为1外其余值皆为0的矩阵。 | 8410 8411**错误码:** 8412 8413以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 8414 8415| 错误码ID | 错误信息 | 8416| ------- | --------------------------------------------| 8417| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 8418 8419**示例:** 8420 8421```ts 8422import {drawing,common2D} from "@kit.ArkGraphics2D" 8423let src: common2D.Rect = { left: 100, top: 100, right: 300, bottom: 300 }; 8424let dst: common2D.Rect = { left: 200, top: 200, right: 600, bottom: 600 }; 8425let scaleToFit: drawing.ScaleToFit = drawing.ScaleToFit.FILL_SCALE_TO_FIT 8426let matrix = new drawing.Matrix(); 8427if (matrix.setRectToRect(src, dst, scaleToFit)) { 8428 console.info("matrix"+matrix.getAll().toString()); 8429} 8430``` 8431 8432### setPolyToPoly<sup>12+</sup> 8433 8434setPolyToPoly(src: Array\<common2D.Point>, dst: Array\<common2D.Point>, count: number): boolean 8435 8436将当前矩阵设置为能使源点数组映射到目标点数组的变换矩阵。源点以及目标点的个数要大于等于0,小于等于4。 8437 8438**系统能力**:SystemCapability.Graphics.Drawing 8439 8440**参数:** 8441 8442| 参数名 | 类型 | 必填 | 说明 | 8443| --------------- | ------- | ---- | ----------------------------------------------------------- | 8444| src | Array\<[common2D.Point](js-apis-graphics-common2D.md#point)> | 是 | 源点数组,长度必须为count。 | 8445| dst | Array\<[common2D.Point](js-apis-graphics-common2D.md#point)> | 是 | 目标点数组,长度必须为count。 | 8446| count | number | 是 | 在src和dst点的数量,该参数为整数。 | 8447 8448**返回值:** 8449 8450| 类型 | 说明 | 8451| --------------------- | -------------- | 8452| boolean | 返回设置矩阵是否成功的结果,true表示设置成功,false表示设置失败。 | 8453 8454**错误码:** 8455 8456以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 8457 8458| 错误码ID | 错误信息 | 8459| ------- | --------------------------------------------| 8460| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 8461 8462**示例:** 8463 8464```ts 8465import {drawing,common2D} from "@kit.ArkGraphics2D" 8466let srcPoints: Array<common2D.Point> = [ {x: 10, y: 20}, {x: 200, y: 150} ]; 8467let dstPoints: Array<common2D.Point> = [{ x:0, y: 10 }, { x:300, y: 600 }]; 8468let matrix = new drawing.Matrix(); 8469if (matrix.setPolyToPoly(srcPoints, dstPoints, 2)) { 8470 console.info("matrix"+matrix.getAll().toString()); 8471} 8472``` 8473 8474## RoundRect<sup>12+</sup> 8475 8476圆角矩形对象。 8477 8478### constructor<sup>12+</sup> 8479 8480constructor(rect: common2D.Rect, xRadii: number, yRadii: number) 8481 8482构造一个圆角矩形对象,当且仅当xRadii和yRadii均大于0时,圆角生效,否则只会构造一个矩形。 8483 8484**系统能力:** SystemCapability.Graphics.Drawing 8485 8486**参数:** 8487 8488| 参数名 | 类型 | 必填 | 说明 | 8489| ----------- | ---------------------------------------- | ---- | ------------------- | 8490| rect | [common2D.Rect](js-apis-graphics-common2D.md#rect) | 是 | 需要创建的圆角矩形区域。 | 8491| xRadii | number | 是 | X轴上的圆角半径,该参数为浮点数,小于等于0时无效。 | 8492| yRadii | number | 是 | Y轴上的圆角半径,该参数为浮点数,小于等于0时无效。 | 8493 8494**错误码:** 8495 8496以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 8497 8498| 错误码ID | 错误信息 | 8499| ------- | --------------------------------------------| 8500| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 8501 8502**示例:** 8503 8504```ts 8505import { common2D, drawing } from '@kit.ArkGraphics2D'; 8506 8507let rect: common2D.Rect = {left : 100, top : 100, right : 500, bottom : 300}; 8508let roundRect = new drawing.RoundRect(rect, 50, 50); 8509``` 8510### setCorner<sup>12+</sup> 8511 8512setCorner(pos: CornerPos, x: number, y: number): void 8513 8514用于设置圆角矩形中指定圆角位置的圆角半径。 8515 8516**系统能力:** SystemCapability.Graphics.Drawing 8517 8518**参数:** 8519 8520| 参数名 | 类型 | 必填 | 说明 | 8521| -------- | -------------------------------------------- | ---- | ------------------------------- | 8522| pos | [CornerPos](#cornerpos12) | 是 | 圆角位置。 | 8523| x | number | 是 | x轴方向的圆角半径,该参数为浮点数,小于等于0时无效。 | 8524| y | number | 是 | y轴方向的圆角半径,该参数为浮点数,小于等于0时无效。 | 8525 8526**错误码:** 8527 8528以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 8529 8530| 错误码ID | 错误信息 | 8531| ------- | --------------------------------------------| 8532| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 8533 8534**示例:** 8535 8536```ts 8537import { drawing } from '@kit.ArkGraphics2D'; 8538let roundRect : drawing.RoundRect = new drawing.RoundRect({left: 0, top: 0, right: 300, bottom: 300}, 50, 50); 8539roundRect.setCorner(drawing.CornerPos.TOP_LEFT_POS, 150, 150); 8540``` 8541 8542### getCorner<sup>12+</sup> 8543 8544getCorner(pos: CornerPos): common2D.Point 8545 8546获取圆角矩形中指定圆角位置的圆角半径。 8547 8548**系统能力:** SystemCapability.Graphics.Drawing 8549 8550**参数:** 8551 8552| 参数名 | 类型 | 必填 | 说明 | 8553| -------- | -------------------------------------------- | ---- | ------------------------------- | 8554| pos | [CornerPos](#cornerpos12) | 是 | 圆角位置。 | 8555 8556**返回值:** 8557 8558| 类型 | 说明 | 8559| --------------------- | -------------- | 8560| [common2D.Point](js-apis-graphics-common2D.md#point) | 返回一个点,其横坐标表示圆角x轴方向上的半径,纵坐标表示y轴方向上的半径。 | 8561 8562**错误码:** 8563 8564以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 8565 8566| 错误码ID | 错误信息 | 8567| ------- | --------------------------------------------| 8568| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types;3.Parameter verification failed. | 8569 8570**示例:** 8571 8572```ts 8573import { drawing } from '@kit.ArkGraphics2D'; 8574let roundRect : drawing.RoundRect = new drawing.RoundRect({left: 0, top: 0, right: 300, bottom: 300}, 50, 50); 8575let cornerRadius = roundRect.getCorner(drawing.CornerPos.BOTTOM_LEFT_POS); 8576console.info("getCorner---"+cornerRadius.x) 8577console.info("getCorner---"+cornerRadius.y) 8578``` 8579 8580### offset<sup>12+</sup> 8581 8582offset(dx: number, dy: number): void 8583 8584将圆角矩形分别沿x轴方向和y轴方向平移dx,dy。 8585 8586**系统能力:** SystemCapability.Graphics.Drawing 8587 8588**参数:** 8589 8590| 参数名 | 类型 | 必填 | 说明 | 8591| -------- | -------------------------------------------- | ---- | ------------------------------- | 8592| dx | number | 是 | 表示x轴方向上的偏移量,正数表示往x轴正方向平移,负数表示往x轴负方向平移,该参数为浮点数。 | 8593| dy | number | 是 | 表示y轴方向上的偏移量,正数表示往y轴正方向平移,负数表示往y轴负方向平移,该参数为浮点数。 | 8594 8595**错误码:** 8596 8597以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 8598 8599| 错误码ID | 错误信息 | 8600| ------- | --------------------------------------------| 8601| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 8602 8603**示例:** 8604 8605```ts 8606import { drawing } from '@kit.ArkGraphics2D'; 8607let roundRect : drawing.RoundRect = new drawing.RoundRect({left: 0, top: 0, right: 300, bottom: 300}, 50, 50); 8608roundRect.offset(100, 100); 8609``` 8610 8611## Region<sup>12+</sup> 8612 8613区域对象,用于描述所绘制图形的区域信息。 8614 8615### isPointContained<sup>12+</sup> 8616 8617isPointContained(x: number, y: number) : boolean 8618 8619用于判断测试点是否在区域内。 8620 8621**系统能力:** SystemCapability.Graphics.Drawing 8622 8623**参数:** 8624 8625| 参数名 | 类型 | 必填 | 说明 | 8626| ------ | ------ | ---- | ----------------------- | 8627| x | number | 是 | 测试点的x轴坐标。该参数必须为整数。当输入的数字带小数时,小数部分会被舍去。 | 8628| y | number | 是 | 测试点的y轴坐标。该参数必须为整数。当输入的数字带小数时,小数部分会被舍去。 | 8629 8630**返回值:** 8631 8632| 类型 | 说明 | 8633| ------- | -------------- | 8634| boolean | 返回测试点是否在区域内的结果。true表示测试点在区域内,false表示测试点不在区域内。 | 8635 8636**错误码:** 8637 8638以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 8639 8640| 错误码ID | 错误信息 | 8641| ------- | --------------------------------------------| 8642| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 8643 8644**示例:** 8645 8646```ts 8647import { RenderNode } from '@kit.ArkUI'; 8648import { drawing } from '@kit.ArkGraphics2D'; 8649class DrawingRenderNode extends RenderNode { 8650 draw(context : DrawContext) { 8651 const canvas = context.canvas; 8652 const pen = new drawing.Pen(); 8653 pen.setColor({ alpha: 255, red: 255, green: 0, blue: 0 }); 8654 pen.setStrokeWidth(10); 8655 canvas.attachPen(pen); 8656 let region = new drawing.Region(); 8657 region.setRect(100, 100, 400, 400); 8658 let flag: boolean = false; 8659 flag = region.isPointContained(200,200); 8660 console.info("region isPointContained : " + flag); 8661 canvas.drawPoint(200,200); 8662 canvas.drawRegion(region); 8663 canvas.detachPen(); 8664 } 8665} 8666``` 8667 8668### isRegionContained<sup>12+</sup> 8669 8670isRegionContained(other: Region) : boolean 8671 8672用于判断其他区域是否在当前区域内。 8673 8674**系统能力:** SystemCapability.Graphics.Drawing 8675 8676**参数:** 8677 8678| 参数名 | 类型 | 必填 | 说明 | 8679| ------ | ------ | ---- | ----------------------- | 8680| other | [Region](#region12) | 是 | 区域对象。 | 8681 8682**返回值:** 8683 8684| 类型 | 说明 | 8685| ------- | -------------- | 8686| boolean | 返回其他区域是否在当前区域内的结果。true表示其他区域在当前区域内,false表示其他区域不在当前区域内。 | 8687 8688**错误码:** 8689 8690以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 8691 8692| 错误码ID | 错误信息 | 8693| ------- | --------------------------------------------| 8694| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 8695 8696**示例:** 8697 8698```ts 8699import { RenderNode } from '@kit.ArkUI'; 8700import { drawing } from '@kit.ArkGraphics2D'; 8701class DrawingRenderNode extends RenderNode { 8702 draw(context : DrawContext) { 8703 const canvas = context.canvas; 8704 const pen = new drawing.Pen(); 8705 pen.setColor({ alpha: 255, red: 255, green: 0, blue: 0 }); 8706 pen.setStrokeWidth(10); 8707 canvas.attachPen(pen); 8708 let region = new drawing.Region(); 8709 let other = new drawing.Region(); 8710 region.setRect(100, 100, 400, 400); 8711 other.setRect(150, 150, 250 ,250); 8712 let flag: boolean = false; 8713 flag = region.isRegionContained(other); 8714 console.info("region isRegionContained : " + flag); 8715 canvas.drawRegion(region); 8716 canvas.drawRegion(other); 8717 canvas.detachPen(); 8718 } 8719} 8720``` 8721 8722### op<sup>12+</sup> 8723 8724op(region: Region, regionOp: RegionOp) : boolean 8725 8726用于将当前区域与指定区域进行指定运算操作,并将当前区域替换为运算结果。 8727 8728**系统能力:** SystemCapability.Graphics.Drawing 8729 8730**参数:** 8731 8732| 参数名 | 类型 | 必填 | 说明 | 8733| ------ | ------ | ---- | ----------------------- | 8734| region | [Region](#region12) | 是 | 区域对象。 | 8735| regionOp | [RegionOp](#regionop12) | 是 | 区域合并操作类型。 | 8736 8737**返回值:** 8738 8739| 类型 | 说明 | 8740| ------- | -------------- | 8741| boolean | 返回区域运算结果是否成功替换当前区域。true表示区域运算结果替换当前区域成功,false表示区域运算结果替换当前区域失败。 | 8742 8743**错误码:** 8744 8745以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 8746 8747| 错误码ID | 错误信息 | 8748| ------- | --------------------------------------------| 8749| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 8750 8751**示例:** 8752 8753```ts 8754import { RenderNode } from '@kit.ArkUI'; 8755import { drawing } from '@kit.ArkGraphics2D'; 8756class DrawingRenderNode extends RenderNode { 8757 draw(context : DrawContext) { 8758 const canvas = context.canvas; 8759 const pen = new drawing.Pen(); 8760 pen.setColor({ alpha: 255, red: 255, green: 0, blue: 0 }); 8761 pen.setStrokeWidth(10); 8762 canvas.attachPen(pen); 8763 let region = new drawing.Region(); 8764 region.setRect(200, 200, 400, 400); 8765 let othregion = new drawing.Region(); 8766 othregion.setRect(110, 110, 240, 240); 8767 let flag: boolean = false; 8768 flag = region.op(othregion,drawing.RegionOp.REPLACE); 8769 console.info("region op : " + flag); 8770 canvas.drawRegion(region); 8771 canvas.detachPen(); 8772 } 8773} 8774``` 8775 8776### quickReject<sup>12+</sup> 8777 8778quickReject(left: number, top: number, right: number, bottom: number) : boolean 8779 8780用于快速判断矩形和区域是否不相交,实际上比较的是矩形和区域的外接矩形是否不相交,因此会有误差。 8781 8782**系统能力:** SystemCapability.Graphics.Drawing 8783 8784**参数:** 8785 8786| 参数名 | 类型 | 必填 | 说明 | 8787| ------ | ------ | ---- | ----------------------- | 8788| left | number | 是 | 矩形区域的左侧位置。该参数必须为整数。当输入的数字带小数时,小数部分会被舍去。 | 8789| top | number | 是 | 矩形区域的顶部位置。该参数必须为整数。当输入的数字带小数时,小数部分会被舍去。 | 8790| right | number | 是 | 矩形区域的右侧位置。该参数必须为整数。当输入的数字带小数时,小数部分会被舍去。 | 8791| bottom | number | 是 | 矩形区域的底部位置。该参数必须为整数。当输入的数字带小数时,小数部分会被舍去。 | 8792 8793**返回值:** 8794 8795| 类型 | 说明 | 8796| ------- | -------------- | 8797| boolean | 返回矩形是否与区域不相交的结果。true表示矩形与区域不相交,false表示矩形与区域相交。 | 8798 8799**错误码:** 8800 8801以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 8802 8803| 错误码ID | 错误信息 | 8804| ------- | --------------------------------------------| 8805| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 8806 8807**示例:** 8808 8809```ts 8810import { RenderNode } from '@kit.ArkUI'; 8811import { drawing } from '@kit.ArkGraphics2D'; 8812class DrawingRenderNode extends RenderNode { 8813 draw(context : DrawContext) { 8814 const canvas = context.canvas; 8815 const pen = new drawing.Pen(); 8816 pen.setColor({ alpha: 255, red: 255, green: 0, blue: 0 }); 8817 pen.setStrokeWidth(10); 8818 canvas.attachPen(pen); 8819 let region = new drawing.Region(); 8820 region.setRect(100, 100, 400, 400); 8821 let flag: boolean = false; 8822 flag = region.quickReject(50, 50, 70, 70); 8823 console.info("region quickReject : " + flag); 8824 canvas.drawRegion(region); 8825 canvas.detachPen(); 8826 } 8827} 8828``` 8829 8830### setPath<sup>12+</sup> 8831 8832setPath(path: Path, clip: Region) : boolean 8833 8834设置一个与裁剪区域内路径的轮廓相匹配的区域。 8835 8836**系统能力:** SystemCapability.Graphics.Drawing 8837 8838**参数:** 8839 8840| 参数名 | 类型 | 必填 | 说明 | 8841| ------ | ------ | ---- | ----------------------- | 8842| path | [Path](#path) | 是 | 路径对象。 | 8843| clip | [Region](#region12) | 是 | 区域对象。 | 8844 8845**返回值:** 8846 8847| 类型 | 说明 | 8848| ------- | -------------- | 8849| boolean | 返回是否成功设置一个与裁剪区域内路径的轮廓相匹配的区域。true表示设置成功,false表示设置失败。 | 8850 8851**错误码:** 8852 8853以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 8854 8855| 错误码ID | 错误信息 | 8856| ------- | --------------------------------------------| 8857| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 8858 8859**示例:** 8860 8861```ts 8862import { RenderNode } from '@kit.ArkUI'; 8863import { drawing } from '@kit.ArkGraphics2D'; 8864class DrawingRenderNode extends RenderNode { 8865 draw(context : DrawContext) { 8866 const canvas = context.canvas; 8867 const pen = new drawing.Pen(); 8868 pen.setColor({ alpha: 255, red: 255, green: 0, blue: 0 }); 8869 pen.setStrokeWidth(10); 8870 canvas.attachPen(pen); 8871 let region = new drawing.Region(); 8872 let path = new drawing.Path(); 8873 region.setRect(100, 100, 400, 400); 8874 path.arcTo(50, 50, 300, 300, 0, 359); 8875 let flag: boolean = false; 8876 flag = region.setPath(path,region); 8877 console.info("region setPath : " + flag); 8878 canvas.drawRegion(region); 8879 canvas.detachPen(); 8880 } 8881} 8882``` 8883 8884### setRect<sup>12+</sup> 8885 8886setRect(left: number, top: number, right: number, bottom: number) : boolean 8887 8888设置一个矩形区域。 8889 8890**系统能力:** SystemCapability.Graphics.Drawing 8891 8892**参数:** 8893 8894| 参数名 | 类型 | 必填 | 说明 | 8895| ------ | ------ | ---- | ----------------------- | 8896| left | number | 是 | 矩形区域的左侧位置。该参数必须为整数。当输入的数字带小数时,小数部分会被舍去。 | 8897| top | number | 是 | 矩形区域的顶部位置。该参数必须为整数。当输入的数字带小数时,小数部分会被舍去。 | 8898| right | number | 是 | 矩形区域的右侧位置。该参数必须为整数。当输入的数字带小数时,小数部分会被舍去。 | 8899| bottom | number | 是 | 矩形区域的底部位置。该参数必须为整数。当输入的数字带小数时,小数部分会被舍去。 | 8900 8901**返回值:** 8902 8903| 类型 | 说明 | 8904| ------- | -------------- | 8905| boolean | 返回设置矩形区域是否成功的结果。true表示设置矩形区域成功,false表示设置矩形区域失败。 | 8906 8907**错误码:** 8908 8909以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 8910 8911| 错误码ID | 错误信息 | 8912| ------- | --------------------------------------------| 8913| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 8914 8915**示例:** 8916 8917```ts 8918import { RenderNode } from '@kit.ArkUI'; 8919import { drawing } from '@kit.ArkGraphics2D'; 8920class DrawingRenderNode extends RenderNode { 8921 draw(context : DrawContext) { 8922 const canvas = context.canvas; 8923 const pen = new drawing.Pen(); 8924 pen.setColor({ alpha: 255, red: 255, green: 0, blue: 0 }); 8925 pen.setStrokeWidth(10); 8926 canvas.attachPen(pen); 8927 let region = new drawing.Region(); 8928 let flag: boolean = false; 8929 flag = region.setRect(50, 50, 300, 300); 8930 console.info("region setRect : " + flag); 8931 canvas.drawRegion(region); 8932 canvas.detachPen(); 8933 } 8934} 8935``` 8936 8937## TileMode<sup>12+</sup> 8938 8939着色器效果平铺模式的枚举。 8940 8941**系统能力**:SystemCapability.Graphics.Drawing 8942 8943| 名称 | 值 | 说明 | 8944| ---------------------- | ---- | ------------------------------ | 8945| CLAMP | 0 | 如果着色器效果超出其原始边界,剩余区域使用着色器的边缘颜色填充。 | 8946| REPEAT | 1 | 在水平和垂直方向上重复着色器效果。 | 8947| MIRROR | 2 | 在水平和垂直方向上重复着色器效果,交替镜像图像,以便相邻图像始终接合。 | 8948| DECAL | 3 | 仅在其原始边界内渲染着色器效果。| 8949 8950## ShaderEffect<sup>12+</sup> 8951 8952着色器。画刷和画笔设置着色器后,会使用着色器效果而不是颜色属性去绘制,但此时画笔和画刷的透明度属性仍然生效。 8953 8954### createColorShader<sup>12+</sup> 8955 8956static createColorShader(color: number): ShaderEffect 8957 8958创建具有单一颜色的着色器。 8959 8960**系统能力:** SystemCapability.Graphics.Drawing 8961 8962**参数:** 8963 8964| 参数名 | 类型 | 必填 | 说明 | 8965| ------ | -------------------------------------------------- | ---- | -------------- | 8966| color | number | 是 | 表示着色器的ARGB格式颜色,该参数为32位无符号整数。 | 8967 8968**返回值:** 8969 8970| 类型 | 说明 | 8971| ------- | ------------------------- | 8972| [ShaderEffect](#shadereffect12) | 返回具有单一颜色的着色器对象。 | 8973 8974**错误码:** 8975 8976以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 8977 8978| 错误码ID | 错误信息 | 8979| ------- | --------------------------------------------| 8980| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 8981 8982**示例:** 8983 8984```ts 8985import { drawing } from '@kit.ArkGraphics2D'; 8986 8987let shaderEffect = drawing.ShaderEffect.createColorShader(0xFFFF0000); 8988``` 8989 8990### createLinearGradient<sup>12+</sup> 8991 8992static createLinearGradient(startPt: common2D.Point, endPt: common2D.Point, colors: Array 8993\<number>, mode: TileMode, pos?: Array\<number> | null, matrix?: Matrix | null): ShaderEffect 8994 8995创建着色器,在两个指定点之间生成线性渐变。 8996 8997**系统能力:** SystemCapability.Graphics.Drawing 8998 8999**参数:** 9000 9001| 参数名 | 类型 | 必填 | 说明 | 9002| ------ | -------------------------------------------------- | ---- | -------------- | 9003| startPt | [common2D.Point](js-apis-graphics-common2D.md#point) | 是 | 表示渐变的起点。 | 9004| endPt | [common2D.Point](js-apis-graphics-common2D.md#point) | 是 | 表示渐变的终点。 | 9005| colors | Array\<number> | 是 | 表示在两个点之间分布的颜色数组,数组中的值为32位(ARGB)无符号整数。 | 9006| mode | [TileMode](#tilemode12) | 是 | 着色器效果平铺模式。 | 9007| pos | Array\<number> \|null| 否 | 表示每种对应颜色在颜色数组中的相对位置。数组长度需和colors保持一致,数组的首个元素应当是0.0,末尾元素应当是1.0,中间的元素应当在0与1之间并且逐下标递增,表示colors中每个对应颜色的相对位置。默认为null,表示颜色均匀分布在起点和终点之间。 | 9008| matrix | [Matrix](#matrix12) \| null | 否 | 矩阵对象,用于对着色器做矩阵变换。默认为null,表示单位矩阵。 | 9009 9010 9011 9012如上图是设置颜色数组为红绿蓝,位置数组为0.0,0.75,1.0后的显示效果。三角下标即为对应的颜色所在起始点和终点之间的相对位置,颜色与颜色之间使用渐变填充。 9013 9014**返回值:** 9015 9016| 类型 | 说明 | 9017| ------- | ------------------------- | 9018| [ShaderEffect](#shadereffect12) | 返回创建的着色器对象。 | 9019 9020**错误码:** 9021 9022以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 9023 9024| 错误码ID | 错误信息 | 9025| ------- | --------------------------------------------| 9026| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types; 3. Parameter verification failed. | 9027 9028**示例:** 9029 9030```ts 9031import { common2D,drawing } from '@kit.ArkGraphics2D'; 9032 9033let startPt: common2D.Point = { x: 100, y: 100 }; 9034let endPt: common2D.Point = { x: 300, y: 300 }; 9035let shaderEffect = drawing.ShaderEffect.createLinearGradient(startPt, endPt, [0xFF00FF00, 0xFFFF0000], drawing.TileMode.REPEAT); 9036``` 9037 9038### createRadialGradient<sup>12+</sup> 9039 9040static createRadialGradient(centerPt: common2D.Point, radius: number, colors: Array\<number>, mode: TileMode, pos?: Array\<number> | null, matrix?: Matrix | null): ShaderEffect; 9041 9042创建着色器,使用给定圆心和半径生成径向渐变。从圆心到圆边界,颜色由内到外生成圆形渐变(从圆心向外一圈圈扩散)称为径向渐变。 9043 9044**系统能力:** SystemCapability.Graphics.Drawing 9045 9046**参数:** 9047 9048| 参数名 | 类型 | 必填 | 说明 | 9049| ------ | -------------------------------------------------- | ---- | -------------- | 9050| centerPt | [common2D.Point](js-apis-graphics-common2D.md#point) | 是 | 表示渐变的圆心。 | 9051| radius | number | 是 | 表示渐变的半径,小于等于0时无效,该参数为浮点数。 | 9052| colors | Array\<number> | 是 | 表示在圆心和圆边界之间分布的颜色数组,数组中的值为32位(ARGB)无符号整数。 | 9053| mode | [TileMode](#tilemode12) | 是 | 着色器效果平铺模式。 | 9054| pos | Array\<number> \| null | 否 | 表示每种对应颜色在颜色数组中的相对位置。数组长度需和colors保持一致,数组的首个元素应当是0.0,末尾元素应当是1.0,中间的元素应当在0与1之间并且逐下标递增,表示colors中每个对应颜色的相对位置。默认为null,表示颜色均匀分布在圆心和圆边界之间。 | 9055| matrix | [Matrix](#matrix12) \| null | 否 | 矩阵对象,用于对着色器做矩阵变换。默认为null,表示单位矩阵。 | 9056 9057 9058 9059如上图是设置颜色数组为红绿蓝,位置数组为0.0,0.75,1.0后的显示效果。三角下标即为对应的颜色所在圆心和圆边界之间的相对位置,颜色与颜色之间使用渐变填充。 9060 9061**返回值:** 9062 9063| 类型 | 说明 | 9064| ------- | ------------------------- | 9065| [ShaderEffect](#shadereffect12) | 返回创建的着色器对象。 | 9066 9067**错误码:** 9068 9069以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 9070 9071| 错误码ID | 错误信息 | 9072| ------- | --------------------------------------------| 9073| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types; 3. Parameter verification failed. | 9074 9075**示例:** 9076 9077```ts 9078import { common2D,drawing } from '@kit.ArkGraphics2D'; 9079 9080let centerPt: common2D.Point = { x: 100, y: 100 }; 9081let shaderEffect = drawing.ShaderEffect.createRadialGradient(centerPt, 100, [0xFF00FF00, 0xFFFF0000], drawing.TileMode.REPEAT); 9082``` 9083 9084### createSweepGradient<sup>12+</sup> 9085 9086static createSweepGradient(centerPt: common2D.Point, colors: Array\<number>, 9087 mode: TileMode, startAngle: number, endAngle: number, pos?: Array\<number> | null, 9088 matrix?: Matrix | null): ShaderEffect; 9089 9090创建着色器,该着色器在给定中心的情况下生成扫描渐变。以给定中心为圆心,颜色在顺时针或逆时针方向上生成渐变称为扫描渐变。 9091 9092**系统能力:** SystemCapability.Graphics.Drawing 9093 9094**参数:** 9095 9096| 参数名 | 类型 | 必填 | 说明 | 9097| ------ | -------------------------------------------------- | ---- | -------------- | 9098| centerPt | [common2D.Point](js-apis-graphics-common2D.md#point) | 是 | 表示渐变的圆心。 | 9099| colors | Array\<number> | 是 | 表示在起始角度和结束角度之间分布的颜色数组,数组中的值为32位(ARGB)无符号整数。 | 9100| mode | [TileMode](#tilemode12) | 是 | 着色器效果平铺模式。 | 9101| startAngle | number | 是 | 表示扇形渐变的起始角度,单位为度。0度时为x轴正方向,正数往顺时针方向偏移,负数往逆时针方向偏移。该参数为浮点数。 | 9102| endAngle | number | 是 | 表示扇形渐变的结束角度,单位为度。0度时为x轴正方向,正数往顺时针方向偏移,负数往逆时针方向偏移。小于起始角度时无效。该参数为浮点数。 | 9103| pos | Array\<number> \| null | 否 | 表示每种对应颜色在颜色数组中的相对位置。数组长度需和colors保持一致,数组的首个元素应当是0.0,末尾元素应当是1.0,中间的元素应当在0与1之间并且逐下标递增,表示colors中每个对应颜色的相对位置。默认为null,表示颜色均匀分布在起始角度和结束角度之间。 | 9104| matrix | [Matrix](#matrix12) \| null | 否 |矩阵对象,用于对着色器做矩阵变换。默认为null,表示单位矩阵。 | 9105 9106 9107 9108如上图是设置颜色数组为红绿蓝,位置数组为0.0,0.75,1.0,起始角度设置为0度,结束角度设置为180度后的显示效果。0.0对应0度的位置,0.75对应135度的位置,1.0对应180度的位置,颜色与颜色之间使用渐变填充。 9109 9110**返回值:** 9111 9112| 类型 | 说明 | 9113| ------- | ------------------------- | 9114| [ShaderEffect](#shadereffect12) | 返回创建的着色器对象。 | 9115 9116**错误码:** 9117 9118以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 9119 9120| 错误码ID | 错误信息 | 9121| ------- | --------------------------------------------| 9122| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types; 3. Parameter verification failed. | 9123 9124**示例:** 9125 9126```ts 9127import { common2D,drawing } from '@kit.ArkGraphics2D'; 9128 9129let centerPt: common2D.Point = { x: 100, y: 100 }; 9130let shaderEffect = drawing.ShaderEffect.createSweepGradient(centerPt, [0xFF00FF00, 0xFFFF0000], drawing.TileMode.REPEAT, 100, 200); 9131``` 9132 9133### createConicalGradient<sup>12+</sup> 9134 9135static createConicalGradient(startPt: common2D.Point, startRadius: number, endPt: common2D.Point, endRadius: number, colors: Array\<number>, mode: TileMode, 9136pos?: Array\<number> | null, matrix?: Matrix | null): ShaderEffect; 9137 9138创建着色器,在给定两个圆之间生成径向渐变。 9139 9140**系统能力:** SystemCapability.Graphics.Drawing 9141 9142**参数:** 9143 9144| 参数名 | 类型 | 必填 | 说明 | 9145| ------ | -------------------------------------------------- | ---- | -------------- | 9146| startPt | [common2D.Point](js-apis-graphics-common2D.md#point) | 是 |表示渐变的起始圆的圆心。 | 9147| startRadius | number | 是 | 表示渐变的起始圆的半径,小于0时无效。该参数为浮点数。 | 9148| endPt | [common2D.Point](js-apis-graphics-common2D.md#point) | 是 | 表示渐变的结束圆的圆心。 | 9149| endRadius | number | 是 | 表示渐变的结束圆的半径,小于0时无效。该参数为浮点数。 | 9150| colors | Array\<number> | 是 | 表示在起始圆和结束圆之间分布的颜色数组,数组中的值为32位(ARGB)无符号整数。 | 9151| mode | [TileMode](#tilemode12) | 是 | 着色器效果平铺模式。 | 9152| pos | Array\<number> \| null | 否 | 表示每种对应颜色在颜色数组中的相对位置。数组长度需和colors保持一致,数组的首个元素应当是0.0,末尾元素应当是1.0,中间的元素应当在0与1之间并且逐下标递增,表示colors中每个对应颜色的相对位置。默认为null,表示颜色均匀分布在起始圆和结束圆之间。| 9153| matrix | [Matrix](#matrix12) \| null | 否 | 矩阵对象,用于对着色器做矩阵变换。默认为null,表示单位矩阵。 | 9154 9155 9156 9157如上图是设置颜色数组为红绿蓝,位置数组为0.0,0.5,1.0的绘制结果。左侧为起始圆不在结束圆内的绘制结果,右侧为起始圆在结束圆内的绘制结果。 9158 9159**返回值:** 9160 9161| 类型 | 说明 | 9162| ------- | ------------------------- | 9163| [ShaderEffect](#shadereffect12) | 返回创建的着色器对象。 | 9164 9165**错误码:** 9166 9167以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 9168 9169| 错误码ID | 错误信息 | 9170| ------- | --------------------------------------------| 9171| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types; 3. Parameter verification failed. | 9172 9173**示例:** 9174 9175```ts 9176import { common2D,drawing } from '@kit.ArkGraphics2D'; 9177 9178let startPt: common2D.Point = { x: 100, y: 100 }; 9179let endPt: common2D.Point = {x: 200, y: 200}; 9180let shaderEffect = drawing.ShaderEffect.createConicalGradient(startPt, 100, endPt, 50, [0xFF00FF00, 0xFFFF0000], drawing.TileMode.REPEAT); 9181``` 9182 9183## Tool<sup>15+</sup> 9184 9185本模块定义的工具类,仅提供静态的方法,主要完成其他模块和[common2D](js-apis-graphics-common2D.md)中定义的数据结构的转换功能等操作。 9186 9187### makeColorFromResourceColor<sup>15+</sup> 9188 9189static makeColorFromResourceColor(resourceColor: ResourceColor): common2D.Color 9190 9191将ResourceColor类型的值转换为common2D.Color对象。 9192 9193**系统能力:** SystemCapability.Graphics.Drawing 9194 9195**参数:** 9196 9197| 参数名 | 类型 | 必填 | 说明 | 9198| ------ | -------------------------------------------------- | ---- | -------------- | 9199| 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)。 | 9200 9201**返回值:** 9202 9203| 类型 | 说明 | 9204| ------- | ------------------------- | 9205| [common2D.Color](js-apis-graphics-common2D.md#color) | 转换后的common2D.Color颜色对象,若转换失败则返回空指针。 | 9206 9207**错误码:** 9208 9209以下错误码的详细介绍请参见[通用错误码](../errorcode-universal.md)。 9210 9211| 错误码ID | 错误信息 | 9212| ------- | --------------------------------------------| 9213| 401 | Parameter error.Possible causes:1.Mandatory parameters are left unspecified;2.Incorrect parameter types. | 9214 9215**示例:** 9216 9217```ts 9218import { drawing, common2D } from '@kit.ArkGraphics2D'; 9219 9220// Color 9221let color1: common2D.Color = drawing.Tool.makeColorFromResourceColor(Color.Blue); 9222 9223// Number 9224let color2: common2D.Color = drawing.Tool.makeColorFromResourceColor(0xffc0cb); 9225let color3: common2D.Color = drawing.Tool.makeColorFromResourceColor(0x11ffa500); 9226 9227// String 9228let color4: common2D.Color = drawing.Tool.makeColorFromResourceColor('#ff0000'); 9229let color5: common2D.Color = drawing.Tool.makeColorFromResourceColor('#110000ff'); 9230let color6: common2D.Color = drawing.Tool.makeColorFromResourceColor('#00f'); 9231let color7: common2D.Color = drawing.Tool.makeColorFromResourceColor('#100f'); 9232let color8: common2D.Color = drawing.Tool.makeColorFromResourceColor('rgb(255, 100, 255)'); 9233let color9: common2D.Color = drawing.Tool.makeColorFromResourceColor('rgba(255, 100, 255, 0.5)'); 9234 9235// Resource 9236let color10: common2D.Color = drawing.Tool.makeColorFromResourceColor($r('sys.color.ohos_id_color_secondary')); 9237let color11: common2D.Color = drawing.Tool.makeColorFromResourceColor($r('app.color.appColorTest')); 9238let color12: common2D.Color = drawing.Tool.makeColorFromResourceColor($r('app.string.appColorTest')); 9239let color13: common2D.Color = drawing.Tool.makeColorFromResourceColor($r('app.integer.appColorTest')); 9240 9241// Use color 9242let brush = new drawing.Brush(); 9243brush.setColor(color1); 9244``` 9245 9246## RegionOp<sup>12+</sup> 9247 9248两个区域合并时的操作的枚举。 9249 9250**系统能力**:SystemCapability.Graphics.Drawing 9251 9252| 名称 | 值 | 说明 | 示意图 | 9253| --------------------- | ---- | ------------------------------ | -------- | 9254| DIFFERENCE | 0 | 两个区域相减操作。 |  | 9255| INTERSECT | 1 | 两个区域相交操作。 |  | 9256| UNION | 2 | 两个区域联合操作。 |  | 9257| XOR | 3 | 两个区域异或操作。 |  | 9258| REVERSE_DIFFERENCE | 4 | 两个区域反向相减操作。 |  | 9259| REPLACE | 5 | 两个区域替换操作。 |  | 9260 9261> **说明:** 9262> 9263> 示意图展示的是以一个红色区域为基础,使用不同枚举值与另一个蓝色区域合并后获得的结果,其中绿色区域为最终得到的区域。 9264 9265## CornerPos<sup>12+</sup> 9266 9267圆角位置枚举。 9268 9269**系统能力**:SystemCapability.Graphics.Drawing 9270 9271| 名称 | 值 | 说明 | 9272| --------------------- | ---- | ------------------------------ | 9273| TOP_LEFT_POS | 0 | 左上角圆角位置。 | 9274| TOP_RIGHT_POS | 1 | 右上角圆角位置。 | 9275| BOTTOM_RIGHT_POS | 2 | 右下角圆角位置。 | 9276| BOTTOM_LEFT_POS | 3 | 左下角圆角位置。 |