1# SymbolGlyph 2 3The **SymbolGlyph** component represents a symbol glyph. 4 5> **NOTE** 6> 7> This component is supported since API version 11. Updates will be marked with a superscript to indicate their earliest API version. 8 9## Child Components 10 11Not supported 12 13## APIs 14 15SymbolGlyph(value?: Resource) 16 17**Widget capability**: This API can be used in ArkTS widgets since API version 12. 18 19**Atomic service API**: This API can be used in atomic services since API version 12. 20 21**System capability**: SystemCapability.ArkUI.ArkUI.Full 22 23**Parameters** 24 25| Name| Type| Mandatory| Description| 26| -------- | -------- | -------- | -------- | 27| value | [Resource](ts-types.md#resource)| No| Resource of the **SymbolGlyph** component, for example, **$r('sys.symbol.ohos_wifi')**.| 28 29> **NOTE** 30> 31> The resources referenced in **$r('sys.symbol.ohos_wifi')** are preset in the system. The **SymbolGlyph** component supports only the preset symbol resources. If unsupported resources are referenced, an exception occurs. 32 33## Attributes 34 35The [universal attributes](ts-component-general-attributes.md) are supported. With regard to text attributes, only the following attributes are supported. 36 37### fontColor 38 39fontColor(value: Array<ResourceColor>) 40 41Sets the color of the **SymbolGlyph** component. 42 43**Widget capability**: This API can be used in ArkTS widgets since API version 12. 44 45**Atomic service API**: This API can be used in atomic services since API version 12. 46 47**System capability**: SystemCapability.ArkUI.ArkUI.Full 48 49**Parameters** 50 51| Name| Type| Mandatory| Description | 52| ------ | ---- | ---- | ----- | 53| value | Array\<[ResourceColor](ts-types.md#resourcecolor)\> | Yes | Color of the **SymbolGlyph** component.<br> Default value: depending on the rendering strategy| 54 55### fontSize 56 57fontSize(value: number | string | Resource) 58 59Sets the size of the **SymbolGlyph** component. When using the string type, numeric string values with optional units, for example, **"10"** or **"10fp"**, are supported. 60 61The display size of the symbol glyph is controlled by the **fontSize** setting. Once **width** or **height** is specified, other universal attributes will only affect the size of the component's placeholder, not the symbol glyph itself. 62 63**Widget capability**: This API can be used in ArkTS widgets since API version 12. 64 65**Atomic service API**: This API can be used in atomic services since API version 12. 66 67**System capability**: SystemCapability.ArkUI.ArkUI.Full 68 69**Parameters** 70 71| Name| Type| Mandatory| Description | 72| ------ | ---- | ---- | ----- | 73| value | number \| string \| [Resource](ts-types.md#resource) | Yes | Size of the **SymbolGlyph** component.<br>Default value: **16fp**<br>Unit: fp<br>Percentage strings are not supported.| 74 75### fontWeight 76 77fontWeight(value: number | FontWeight | string) 78 79Sets the font weight of the **SymbolGlyph** component. For the number type, the value ranges from 100 to 900, at an interval of 100. A larger value indicates a heavier font weight. The default value is **400**. For the string type, only strings of the number type are supported, for example, **"400"**, **"bold"**, **"bolder"**, **"lighter"**, **"regular"**, and **"medium"**, which correspond to the enumerated values in **FontWeight**. 80 81The **sys.symbol.ohos_lungs** icon does not support font weight setting. 82 83**Widget capability**: This API can be used in ArkTS widgets since API version 12. 84 85**Atomic service API**: This API can be used in atomic services since API version 12. 86 87**System capability**: SystemCapability.ArkUI.ArkUI.Full 88 89**Parameters** 90 91| Name| Type | Mandatory| Description | 92| ------ | ------------------------------------------------------------ | ---- | --------------------------------------------------- | 93| value | number \| [FontWeight](ts-appendix-enums.md#fontweight) \| string | Yes | Font weight of the **SymbolGlyph** component.<br>Default value: **FontWeight.Normal**| 94 95### renderingStrategy 96 97renderingStrategy(value: SymbolRenderingStrategy) 98 99Sets the rendering strategy of the **SymbolGlyph** component. 100 101**Widget capability**: This API can be used in ArkTS widgets since API version 12. 102 103**Atomic service API**: This API can be used in atomic services since API version 12. 104 105**System capability**: SystemCapability.ArkUI.ArkUI.Full 106 107**Parameters** 108 109| Name| Type| Mandatory| Description | 110| ------ | ---- | ---- | ----- | 111| value | [SymbolRenderingStrategy](#symbolrenderingstrategy11) | Yes | Rendering strategy of the **SymbolGlyph** component.<br>Default value: **SymbolRenderingStrategy.SINGLE**| 112 113The figure below shows the effects of different rendering strategies. 114 115 116 117### effectStrategy 118 119effectStrategy(value: SymbolEffectStrategy) 120 121Sets the effect strategy of the **SymbolGlyph** component. 122 123**Widget capability**: This API can be used in ArkTS widgets since API version 12. 124 125**Atomic service API**: This API can be used in atomic services since API version 12. 126 127**System capability**: SystemCapability.ArkUI.ArkUI.Full 128 129**Parameters** 130 131| Name| Type| Mandatory| Description | 132| ------ | ---- | ---- | ----- | 133| value | [SymbolEffectStrategy](#symboleffectstrategy11) | Yes | Effect strategy of the **SymbolGlyph** component.<br>Default value: **SymbolEffectStrategy.NONE**| 134 135### symbolEffect<sup>12+</sup> 136 137symbolEffect(symbolEffect: SymbolEffect, isActive?: boolean) 138 139Sets the symbol effect and effect state for the **SymbolGlyph** component. 140 141**Widget capability**: This API can be used in ArkTS widgets since API version 12. 142 143**Atomic service API**: This API can be used in atomic services since API version 12. 144 145**System capability**: SystemCapability.ArkUI.ArkUI.Full 146 147**Parameters** 148 149| Name| Type| Mandatory| Description | 150| ------ | ---- | ---- | ----- | 151| symbolEffect | [SymbolEffect](#symboleffect12) | Yes | Symbol effect of the **SymbolGlyph** component.<br>Default value: [SymbolEffect](#symboleffect12) | 152| isActive | boolean | No | Whether the effect is active.<br>Default value: **false**| 153 154### symbolEffect<sup>12+</sup> 155 156symbolEffect(symbolEffect: SymbolEffect, triggerValue?: number) 157 158Sets the symbol effect and effect trigger for the **SymbolGlyph** component. 159 160**Widget capability**: This API can be used in ArkTS widgets since API version 12. 161 162**Atomic service API**: This API can be used in atomic services since API version 12. 163 164**System capability**: SystemCapability.ArkUI.ArkUI.Full 165 166**Parameters** 167 168| Name| Type| Mandatory| Description | 169| ------ | ---- | ---- | ----- | 170| symbolEffect | [SymbolEffect](#symboleffect12) | Yes | Symbol effect of the **SymbolGlyph** component.<br>Default value: [SymbolEffect](#symboleffect12) | 171| triggerValue | number | No | Value that, when changed, initiates the animation of the **SymbolGlyph** component.<br>To prevent the motion effect from triggering initially, set it to **-1**.| 172 173> **NOTE** 174> 175> When configuring the symbol effect, use the **effectStrategy** attribute or a single **symbolEffect** attribute. Mixing multiple effect attributes is not allowed. 176 177### minFontScale<sup>18+</sup> 178 179minFontScale(scale: Optional\<number | Resource>) 180 181Sets the minimum font scale factor for the **SymbolGlyph** component. 182 183**Atomic service API**: This API can be used in atomic services since API version 18. 184 185**System capability**: SystemCapability.ArkUI.ArkUI.Full 186 187**Parameters** 188 189| Name| Type| Mandatory| Description | 190| ------ | ---- | ---- | ----- | 191| scale |[Optional](ts-universal-attributes-custom-property.md#optional12)\<number \| [Resource](ts-types.md#resource)> | Yes | Minimum font scale factor for the **SymbolGlyph** component.<br>Value range: [0, 1]<br>The value **0** results in the minimum scaling.<br>**NOTE**<br>A value less than 0 is handled as 0. A value greater than 1 is handled as 1. Abnormal values are ineffective by default. | 192 193### maxFontScale<sup>18+</sup> 194 195maxFontScale(scale: Optional\<number | Resource>) 196 197Sets the maximum font scale factor for the **SymbolGlyph** component. 198 199**Atomic service API**: This API can be used in atomic services since API version 18. 200 201**System capability**: SystemCapability.ArkUI.ArkUI.Full 202 203**Parameters** 204 205| Name| Type| Mandatory| Description | 206| ------ | ---- | ---- | ----- | 207| scale |[Optional](ts-universal-attributes-custom-property.md#optional12)\<number \| [Resource](ts-types.md#resource)> | Yes | Maximum font scale factor for the **SymbolGlyph** component.<br>Value range: [1, +∞)<br>**NOTE**<br>A value less than 1 is handled as **1**. Abnormal values are ineffective by default.| 208 209## ScaleSymbolEffect<sup>12+</sup> 210 211Inherits from **SymbolEffect**. 212 213**Widget capability**: This API can be used in ArkTS widgets since API version 12. 214 215**Atomic service API**: This API can be used in atomic services since API version 12. 216 217**System capability**: SystemCapability.ArkUI.ArkUI.Full 218 219### Attributes 220 221| Name| Type| Mandatory| Description | 222| ---- | ---- | ---- | ---- | 223| scope | [EffectScope](#effectscope12) | No | Effect scope.<br>Default value: **EffectScope.LAYER** | 224| direction | [EffectDirection](#effectdirection12) | No | Effect direction.<br>Default value: **EffectDirection.DOWN**| 225 226### constructor<sup>12+</sup> 227 228constructor(scope?: EffectScope, direction?: EffectDirection) 229 230A constructor used to create a **ScaleSymbolEffect** instance, which comes with a scaling animation effect. 231 232**Widget capability**: This API can be used in ArkTS widgets since API version 12. 233 234**Atomic service API**: This API can be used in atomic services since API version 12. 235 236**System capability**: SystemCapability.ArkUI.ArkUI.Full 237 238**Parameters** 239 240| Name| Type| Mandatory| Description | 241| ---- | ---- | ---- | ---- | 242| scope | [EffectScope](#effectscope12) | No | Effect scope.<br>Default value: **EffectScope.LAYER** | 243| direction | [EffectDirection](#effectdirection12) | No | Effect direction.<br>Default value: **EffectDirection.DOWN**| 244 245## HierarchicalSymbolEffect<sup>12+</sup> 246 247Inherits from **SymbolEffect**. 248 249**Widget capability**: This API can be used in ArkTS widgets since API version 12. 250 251**Atomic service API**: This API can be used in atomic services since API version 12. 252 253**System capability**: SystemCapability.ArkUI.ArkUI.Full 254 255### Attributes 256 257| Name| Type| Mandatory| Description | 258| ---- | ---- | ---- | ---- | 259| fillStyle | [EffectFillStyle](#effectfillstyle12) | No | Effect fill style.<br>Default value: **EffectFillStyle.CUMULATIVE**| 260 261### constructor<sup>12+</sup> 262 263constructor(fillStyle?: EffectFillStyle) 264 265A constructor used to create a **HierarchicalSymbolEffect** instance, which comes with a hierarchical animation effect. 266 267**Widget capability**: This API can be used in ArkTS widgets since API version 12. 268 269**Atomic service API**: This API can be used in atomic services since API version 12. 270 271**System capability**: SystemCapability.ArkUI.ArkUI.Full 272 273**Parameters** 274 275| Name| Type| Mandatory| Description | 276| ---- | ---- | ---- | ---- | 277| fillStyle | [EffectFillStyle](#effectfillstyle12) | No | Effect fill style.<br>Default value: **EffectFillStyle.CUMULATIVE**| 278 279## AppearSymbolEffect<sup>12+</sup> 280 281Inherits from **SymbolEffect**. 282 283**Widget capability**: This API can be used in ArkTS widgets since API version 12. 284 285**Atomic service API**: This API can be used in atomic services since API version 12. 286 287**System capability**: SystemCapability.ArkUI.ArkUI.Full 288 289### Attributes 290 291| Name| Type| Mandatory| Description | 292| ---- | ---- | ---- | ---- | 293| scope | [EffectScope](#effectscope12) | No | Effect scope.<br>Default value: **EffectScope.LAYER**| 294 295### constructor<sup>12+</sup> 296 297constructor(scope?: EffectScope) 298 299A constructor used to create an **AppearSymbolEffect** instance, which comes with an appear animation effect. 300 301**Widget capability**: This API can be used in ArkTS widgets since API version 12. 302 303**Atomic service API**: This API can be used in atomic services since API version 12. 304 305**System capability**: SystemCapability.ArkUI.ArkUI.Full 306 307**Parameters** 308 309| Name| Type| Mandatory| Description | 310| ---- | ---- | ---- | ---- | 311| scope | [EffectScope](#effectscope12) | No | Effect scope.<br>Default value: **EffectScope.LAYER**| 312 313## DisappearSymbolEffect<sup>12+</sup> 314 315Inherits from **SymbolEffect**. 316 317**Widget capability**: This API can be used in ArkTS widgets since API version 12. 318 319**Atomic service API**: This API can be used in atomic services since API version 12. 320 321**System capability**: SystemCapability.ArkUI.ArkUI.Full 322 323### Attributes 324 325| Name| Type| Mandatory| Description | 326| ---- | ---- | ---- | ---- | 327| scope | [EffectScope](#effectscope12) | No | Effect scope.<br>Default value: **EffectScope.LAYER**| 328 329### constructor<sup>12+</sup> 330 331constructor(scope?: EffectScope) 332 333A constructor used to create a **DisappearSymbolEffect** instance, which comes with a disappear animation effect. 334 335**Widget capability**: This API can be used in ArkTS widgets since API version 12. 336 337**Atomic service API**: This API can be used in atomic services since API version 12. 338 339**System capability**: SystemCapability.ArkUI.ArkUI.Full 340 341**Parameters** 342 343| Name| Type| Mandatory| Description | 344| ---- | ---- | ---- | ---- | 345| scope | [EffectScope](#effectscope12) | No | Effect scope.<br>Default value: **EffectScope.LAYER**| 346 347## BounceSymbolEffect<sup>12+</sup> 348 349Inherits from **SymbolEffect**. 350 351**Widget capability**: This API can be used in ArkTS widgets since API version 12. 352 353**Atomic service API**: This API can be used in atomic services since API version 12. 354 355**System capability**: SystemCapability.ArkUI.ArkUI.Full 356 357### Attributes 358 359| Name| Type| Mandatory| Description | 360| ---- | ---- | ---- | ---- | 361| scope | [EffectScope](#effectscope12) | No | Effect scope.<br>Default value: **EffectScope.LAYER** | 362| direction | [EffectDirection](#effectdirection12) | No | Effect direction.<br>Default value: **EffectDirection.DOWN**| 363 364### constructor<sup>12+</sup> 365 366constructor(scope?: EffectScope, direction?: EffectDirection) 367 368A constructor used to create a **BounceSymbolEffect** instance, which comes with a bounce animation effect. 369 370**Widget capability**: This API can be used in ArkTS widgets since API version 12. 371 372**Atomic service API**: This API can be used in atomic services since API version 12. 373 374**System capability**: SystemCapability.ArkUI.ArkUI.Full 375 376**Parameters** 377 378| Name| Type| Mandatory| Description | 379| ---- | ---- | ---- | ---- | 380| scope | [EffectScope](#effectscope12) | No | Effect scope.<br>Default value: **EffectScope.LAYER** | 381| direction | [EffectDirection](#effectdirection12) | No | Effect direction.<br>Default value: **EffectDirection.DOWN**| 382 383## ReplaceSymbolEffect<sup>12+</sup> 384 385Inherits from **SymbolEffect**. 386 387**Widget capability**: This API can be used in ArkTS widgets since API version 12. 388 389**Atomic service API**: This API can be used in atomic services since API version 12. 390 391**System capability**: SystemCapability.ArkUI.ArkUI.Full 392 393### Attributes 394 395| Name| Type| Mandatory| Description | 396| ---- | ---- | ---- | ---- | 397| scope | [EffectScope](#effectscope12) | No | Effect scope.<br>Default value: **EffectScope.LAYER**| 398 399### constructor<sup>12+</sup> 400 401constructor(scope?: EffectScope) 402 403A constructor used to create a **ReplaceSymbolEffect** instance, which comes with a replace animation effect. 404 405**Widget capability**: This API can be used in ArkTS widgets since API version 12. 406 407**Atomic service API**: This API can be used in atomic services since API version 12. 408 409**System capability**: SystemCapability.ArkUI.ArkUI.Full 410 411**Parameters** 412 413| Name| Type| Mandatory| Description | 414| ---- | ---- | ---- | ---- | 415| scope | [EffectScope](#effectscope12) | No | Effect scope.<br>Default value: **EffectScope.LAYER**| 416 417## SymbolEffectStrategy<sup>11+</sup> 418 419Enumerates symbol effect types. Once applied, the symbol effect becomes active instantly, eliminating the need for triggering. 420 421**Widget capability**: This API can be used in ArkTS widgets since API version 12. 422 423**Atomic service API**: This API can be used in atomic services since API version 12. 424 425**System capability**: SystemCapability.ArkUI.ArkUI.Full 426 427| Name | Value| Description | 428| ------ | --- | ----------------------------- | 429| NONE | 0 | No effect (default value).| 430| SCALE | 1 | Scale effect as a whole. | 431| HIERARCHICAL | 2 | Hierarchical effect. | 432 433## SymbolRenderingStrategy<sup>11+</sup> 434 435Enumerates the rendering modes. 436 437**Widget capability**: This API can be used in ArkTS widgets since API version 12. 438 439**Atomic service API**: This API can be used in atomic services since API version 12. 440 441**System capability**: SystemCapability.ArkUI.ArkUI.Full 442 443| Name | Value| Description | 444| ------ | --- | ----------------------------- | 445| SINGLE | 0 | Single-color mode (default value).<br> The default color is black.<br> You can set one or multiple colors, but only the first color will be applied.| 446| MULTIPLE_COLOR | 1 | Multi-color mode.<br> A maximum of three colors can be set. If only one color is set, it updates the color of the first layer, leaving other colors at their default values.<br> The sequence of color settings matches the layering order of the symbol; any colors beyond the number of symbol layers will not take effect.<br> Only color values are accepted. Opacity settings do not take effect.| 447| MULTIPLE_OPACITY | 2 | Layered mode.<br> The default color is black. You can set one or multiple colors, but only the first color will be applied.<br>Opacity is predefined for the layers: 100% for the first layer, 50% for the second layer, and 20% for the third layer. | 448 449## SymbolEffect<sup>12+</sup> 450 451Defines the **SymbolEffect** class. 452 453**Widget capability**: This API can be used in ArkTS widgets since API version 12. 454 455**Atomic service API**: This API can be used in atomic services since API version 12. 456 457**System capability**: SystemCapability.ArkUI.ArkUI.Full 458 459## PulseSymbolEffect<sup>12+</sup> 460 461A constructor used to create a **PulseSymbolEffect** instance, which comes with a pulse animation effect. 462 463**Widget capability**: This API can be used in ArkTS widgets since API version 12. 464 465**Atomic service API**: This API can be used in atomic services since API version 12. 466 467**System capability**: SystemCapability.ArkUI.ArkUI.Full 468 469## EffectDirection<sup>12+</sup> 470 471**Widget capability**: This API can be used in ArkTS widgets since API version 12. 472 473**Atomic service API**: This API can be used in atomic services since API version 12. 474 475**System capability**: SystemCapability.ArkUI.ArkUI.Full 476 477| Name| Value | Description | 478| ---- | ---- | ---------------- | 479| DOWN | 0 | The symbol scales down and then returns to its original size.| 480| UP | 1 | The symbol scales up and then returns to its original size.| 481 482## EffectScope<sup>12+</sup> 483 484**Widget capability**: This API can be used in ArkTS widgets since API version 12. 485 486**Atomic service API**: This API can be used in atomic services since API version 12. 487 488**System capability**: SystemCapability.ArkUI.ArkUI.Full 489 490| Name | Value | Description | 491| ----- | ---- | ---------- | 492| LAYER | 0 | Layered mode.| 493| WHOLE | 1 | Whole mode.| 494 495## EffectFillStyle<sup>12+</sup> 496 497**Widget capability**: This API can be used in ArkTS widgets since API version 12. 498 499**Atomic service API**: This API can be used in atomic services since API version 12. 500 501**System capability**: SystemCapability.ArkUI.ArkUI.Full 502 503| Name | Value | Description | 504| ---------- | ---- | ---------- | 505| CUMULATIVE | 0 | Cumulative style.| 506| ITERATIVE | 1 | Iterative style.| 507 508## Events 509 510The [universal events](ts-component-general-events.md) are supported. 511 512## Example 513 514### Example 1: Setting Rendering and Effect Strategies 515 516This example demonstrates different rendering and effect strategies using **renderingStrategy** and **effectStrategy**. 517 518```ts 519// xxx.ets 520@Entry 521@Component 522struct Index { 523 build() { 524 Column() { 525 Row() { 526 Column() { 527 Text("Light") 528 SymbolGlyph($r('sys.symbol.ohos_trash')) 529 .fontWeight(FontWeight.Lighter) 530 .fontSize(96) 531 } 532 533 Column() { 534 Text("Normal") 535 SymbolGlyph($r('sys.symbol.ohos_trash')) 536 .fontWeight(FontWeight.Normal) 537 .fontSize(96) 538 } 539 540 Column() { 541 Text("Bold") 542 SymbolGlyph($r('sys.symbol.ohos_trash')) 543 .fontWeight(FontWeight.Bold) 544 .fontSize(96) 545 } 546 } 547 548 Row() { 549 Column() { 550 Text("Single-color mode") 551 SymbolGlyph($r('sys.symbol.ohos_folder_badge_plus')) 552 .fontSize(96) 553 .renderingStrategy(SymbolRenderingStrategy.SINGLE) 554 .fontColor([Color.Black, Color.Green, Color.White]) 555 } 556 557 Column() { 558 Text("Multi-color mode") 559 SymbolGlyph($r('sys.symbol.ohos_folder_badge_plus')) 560 .fontSize(96) 561 .renderingStrategy(SymbolRenderingStrategy.MULTIPLE_COLOR) 562 .fontColor([Color.Black, Color.Green, Color.White]) 563 } 564 565 Column() { 566 Text ("Layered mode") 567 SymbolGlyph($r('sys.symbol.ohos_folder_badge_plus')) 568 .fontSize(96) 569 .renderingStrategy(SymbolRenderingStrategy.MULTIPLE_OPACITY) 570 .fontColor([Color.Black, Color.Green, Color.White]) 571 } 572 } 573 574 Row() { 575 Column() { 576 Text("No effect") 577 SymbolGlyph($r('sys.symbol.ohos_wifi')) 578 .fontSize(96) 579 .effectStrategy(SymbolEffectStrategy.NONE) 580 } 581 582 Column() { 583 Text("Overall scale effect") 584 SymbolGlyph($r('sys.symbol.ohos_wifi')) 585 .fontSize(96) 586 .effectStrategy(1) 587 } 588 589 Column() { 590 Text("Hierarchical effect") 591 SymbolGlyph($r('sys.symbol.ohos_wifi')) 592 .fontSize(96) 593 .effectStrategy(2) 594 } 595 } 596 } 597 } 598} 599``` 600 601 602### Example 2: Setting Effects 603 604This example demonstrates the effects of variable color animation and replacement animation using **symbolEffect**. 605 606```ts 607// xxx.ets 608@Entry 609@Component 610struct Index { 611 @State isActive: boolean = true; 612 @State triggerValueReplace: number = 0; 613 replaceFlag: boolean = true; 614 615 build() { 616 Column() { 617 Row() { 618 Column() { 619 Text("Variable color animation") 620 SymbolGlyph($r('sys.symbol.ohos_wifi')) 621 .fontSize(96) 622 .symbolEffect(new HierarchicalSymbolEffect(EffectFillStyle.ITERATIVE), this.isActive) 623 Button(this.isActive ? 'Off' : 'Play').onClick(() => { 624 this.isActive = !this.isActive; 625 }) 626 }.margin({ right: 20 }) 627 628 Column() { 629 Text("Replacement animation") 630 SymbolGlyph(this.replaceFlag ? $r('sys.symbol.checkmark_circle') : $r('sys.symbol.repeat_1')) 631 .fontSize(96) 632 .symbolEffect(new ReplaceSymbolEffect(EffectScope.WHOLE), this.triggerValueReplace) 633 Button('Trigger').onClick(() => { 634 this.replaceFlag = !this.replaceFlag; 635 this.triggerValueReplace = this.triggerValueReplace + 1; 636 }) 637 } 638 } 639 }.margin({ 640 left: 30, 641 top: 50 642 }) 643 } 644} 645``` 646 647
