1# Enums 2 3## Color 4 5Since API version 9, this API is supported in ArkTS widgets. 6 7| Color | Value | Illustration | 8| ------------------------ | -------- | ------------------------------------------------------------ | 9| Black | 0x000000 |  | 10| Blue | 0x0000ff |  | 11| Brown | 0xa52a2a |  | 12| Gray | 0x808080 |  | 13| Grey | 0x808080 |  | 14| Green | 0x008000 |  | 15| Orange | 0xffa500 |  | 16| Pink | 0xffc0cb |  | 17| Red | 0xff0000 |  | 18| White | 0xffffff |  | 19| Yellow | 0xffff00 |  | 20| Transparent<sup>9+</sup> | rgba(0,0,0,0) | Transparent | 21 22## ImageFit 23 24Since API version 9, this API is supported in ArkTS widgets. 25 26| Name | Description | 27| --------- | ------------------------------------------------------------ | 28| Contain | The image is scaled with its aspect ratio retained for the content to be completely displayed within the display boundaries. | 29| Cover | The image is scaled with its aspect ratio retained for both sides to be greater than or equal to the display boundaries.| 30| Auto | The image is scaled automatically to fit the display area. | 31| Fill | The image is scaled to fill the display area, and its aspect ratio is not retained. | 32| ScaleDown | The image is displayed with its aspect ratio retained, in a size smaller than or equal to the original size. | 33| None | The original size is retained. | 34 35## BorderStyle 36 37Since API version 9, this API is supported in ArkTS widgets. 38 39| Name | Description | 40| ------ | ----------------------------------------------- | 41| Dotted | Dotted border. The radius of a dot is half of **borderWidth**.| 42| Dashed | Dashed border. | 43| Solid | Solid border. | 44 45## LineJoinStyle 46 47Since API version 9, this API is supported in ArkTS widgets. 48 49| Name | Description | 50| ----- | -------------------- | 51| Bevel | Bevel is used to connect paths.| 52| Miter | Miter is used to connect paths.| 53| Round | Round is used to connect paths.| 54 55## TouchType 56 57| Name | Description | 58| ------ | ------------------------------ | 59| Down | A finger is pressed. | 60| Up | A finger is lifted. | 61| Move | A finger moves on the screen in pressed state.| 62| Cancel | A touch event is canceled. | 63 64## MouseButton 65 66| Name | Description | 67| ------- | ---------------- | 68| Left | Left button on the mouse. | 69| Right | Right button on the mouse. | 70| Middle | Middle button on the mouse. | 71| Back | Back button on the left of the mouse.| 72| Forward | Forward button on the left of the mouse.| 73| None | No button. | 74 75## MouseAction 76 77| Name | Description | 78| ------- | -------------- | 79| Press | The mouse button is pressed.| 80| Release | The mouse button is released.| 81| Move | The mouse cursor moves. | 82| Hover | The mouse pointer is hovered on an element. | 83 84## Curve 85 86Since API version 9, this API is supported in ArkTS widgets. 87 88| Name | Description | 89| ------------------- | ------------------------------------------------------------ | 90| Linear | The animation speed keeps unchanged. | 91| Ease | The animation starts slowly, accelerates, and then slows down towards the end. The cubic-bezier curve (0.25, 0.1, 0.25, 1.0) is used.| 92| EaseIn | The animation starts at a low speed and then picks up speed until the end. The cubic-bezier curve (0.42, 0.0, 1.0, 1.0) is used. | 93| EaseOut | The animation ends at a low speed. The cubic-bezier curve (0.0, 0.0, 0.58, 1.0) is used. | 94| EaseInOut | The animation starts and ends at a low speed. The cubic-bezier curve (0.42, 0.0, 0.58, 1.0) is used.| 95| FastOutSlowIn | The animation uses the standard cubic-bezier curve (0.4, 0.0, 0.2, 1.0). | 96| LinearOutSlowIn | The animation uses the deceleration cubic-bezier curve (0.0, 0.0, 0.2, 1.0). | 97| FastOutLinearIn | The animation uses the acceleration cubic-bezier curve (0.4, 0.0, 1.0, 1.0). | 98| ExtremeDeceleration | The animation uses the extreme deceleration cubic-bezier curve (0.0, 0.0, 0.0, 1.0). | 99| Sharp | The animation uses the sharp cubic-bezier curve (0.33, 0.0, 0.67, 1.0). | 100| Rhythm | The animation uses the rhythm cubic-bezier curve (0.7, 0.0, 0.2, 1.0). | 101| Smooth | The animation uses the smooth cubic-bezier curve (0.4, 0.0, 0.4, 1.0). | 102| Friction | The animation uses the friction cubic-bezier curve (0.2, 0.0, 0.2, 1.0). | 103 104## AnimationStatus 105 106| Name | Description | 107| ------- | ------------------ | 108| Initial | The animation is in the initial state. | 109| Running | The animation is being played.| 110| Paused | The animation is paused.| 111| Stopped | The animation is stopped.| 112 113## FillMode 114 115| Name | Description | 116| --------- | ------------------------------------------------------------ | 117| None | Before execution, the animation does not apply any styles to the target component. After execution, the animation restores the target component to its default state.| 118| Forwards | The target component retains the state set by the last keyframe encountered during execution of the animation. | 119| Backwards | The animation applies the values defined in the first relevant keyframe once it is applied to the target component, and retains the values during the period set by **delay**. The first relevant keyframe depends on the value of **playMode**. If **playMode** is **Normal** or **Alternate**, the first relevant keyframe is in the **from** state. If **playMode** is **Reverse** or **AlternateReverse**, the first relevant keyframe is in the **to** state.| 120| Both | The animation follows the rules for both **Forwards** and **Backwards**, extending the animation attributes in both directions.| 121 122## PlayMode 123 124Since API version 9, this API is supported in ArkTS widgets. 125 126| Name | Description | 127| ---------------- | ------------------------------------------------------------ | 128| Normal | The animation is played forwards. | 129| Reverse | The animation is played backwards. | 130| Alternate | The animation is played forwards for an odd number of times (1, 3, 5...) and backwards for an even number of times (2, 4, 6...).| 131| AlternateReverse | The animation is played backwards for an odd number of times (1, 3, 5...) and forwards for an even number of times (2, 4, 6...).| 132 133## KeyType 134 135| Name| Description | 136| ---- | ---------- | 137| Down | The key is pressed.| 138| Up | The key is released.| 139 140## KeySource 141 142| Name | Description | 143| -------- | -------------------- | 144| Unknown | Unknown input device. | 145| Keyboard | The input device is a keyboard.| 146 147## Edge 148 149| Name | Description | 150| -------- | ---------------------- | 151| Top | Top edge in the vertical direction.<br>Since API version 9, this API is supported in ArkTS widgets.| 152| Center<sup>(deprecated) </sup> | Center position in the vertical direction.<br> This API is deprecated since API version 9.| 153| Bottom | Bottom edge in the vertical direction.<br>Since API version 9, this API is supported in ArkTS widgets.| 154| Baseline<sup>(deprecated) </sup> | Text baseline position in the cross axis direction.<br> This API is deprecated since API version 9.| 155| Start | Start position in the horizontal direction.<br>Since API version 9, this API is supported in ArkTS widgets.| 156| Middle<sup>(deprecated) </sup> | Center position in the horizontal direction.<br> This API is deprecated since API version 9.| 157| End | End position in the horizontal direction.<br>Since API version 9, this API is supported in ArkTS widgets.| 158 159## Week 160 161| Name | Description | 162| -------- | ---------------------- | 163| Mon | Monday. | 164| Tue | Tuesday. | 165| Wed | Wednesday. | 166| Thur | Thursday. | 167| Fri | Friday. | 168| Sat | Saturday. | 169| Sun | Sunday. | 170 171## Direction 172 173Since API version 9, this API is supported in ArkTS widgets. 174 175| Name| Description | 176| ---- | ---------------------- | 177| Ltr | Components are arranged from left to right. | 178| Rtl | Components are arranged from right to left. | 179| Auto | The default layout direction is used.| 180 181## BarState 182 183Since API version 9, this API is supported in ArkTS widgets. 184 185| Name| Description | 186| ---- | -------------------------------- | 187| Off | Not displayed. | 188| On | Always displayed. | 189| Auto | Displayed when the screen is touched and hidden after 2s.| 190 191## EdgeEffect 192 193Since API version 9, this API is supported in ArkTS widgets. 194 195| Name | Description | 196| ------ | ------------------------------------------------------------ | 197| Spring | Spring effect. When at one of the edges, the component can move beyond the bounds through touches, and produces a bounce effect when the user releases their finger.| 198| Fade | Fade effect. When at one of the edges, the component produces a fade effect. | 199| None | No effect when the component is at one of the edges. | 200 201## Alignment 202 203Since API version 9, this API is supported in ArkTS widgets. 204 205| Name | Description | 206| ----------- | ---------------- | 207| TopStart | Top start. | 208| Top | Horizontally centered on the top. | 209| TopEnd | Top end. | 210| Start | Vertically centered start.| 211| Center | Horizontally and vertically centered.| 212| End | Vertically centered end. | 213| BottomStart | Bottom start. | 214| Bottom | Horizontally centered on the bottom. | 215| BottomEnd | Bottom end. | 216 217## TransitionType 218 219Since API version 9, this API is supported in ArkTS widgets. 220 221| Name | Description | 222| ------ | -------------------------------------------------- | 223| All | The transition takes effect in all scenarios.| 224| Insert | The transition takes effect when a component is inserted or displayed.| 225| Delete | The transition takes effect when a component is deleted or hidden.| 226 227## RelateType 228 229| Name | Description | 230| ------ | ------------------------------- | 231| FILL | The current child component is scaled to fill the parent component. | 232| FIT | The current child component is scaled to adapt to the parent component. | 233 234## Visibility 235 236Since API version 9, this API is supported in ArkTS widgets. 237 238| Name | Description | 239| ------- | -------------------------------- | 240| Hidden | The component is hidden, and a placeholder is used for it in the layout. | 241| Visible | The component is visible. | 242| None | The component is hidden. It is not involved in the layout, and no placeholder is used for it.| 243 244## LineCapStyle 245 246Since API version 9, this API is supported in ArkTS widgets. 247 248| Name | Description | 249| ------ | -------------------- | 250| Butt | The ends of the line are squared off, and the line does not extend beyond its two endpoints.| 251| Round | The line is extended at the endpoints by a half circle whose diameter is equal to the line width.| 252| Square | The line is extended at the endpoints by a rectangle whose width is equal to half the line width and height equal to the line width.| 253 254## Axis 255 256Since API version 9, this API is supported in ArkTS widgets. 257 258| Name | Description | 259| ---------- | ------------ | 260| Vertical | Vertical direction.| 261| Horizontal | Horizontal direction.| 262 263## HorizontalAlign 264 265Since API version 9, this API is supported in ArkTS widgets. 266 267| Name | Description | 268| ------ | ------------------------ | 269| Start | Aligned with the start edge in the same direction as the language in use.| 270| Center | Aligned with the center. This is the default alignment mode.| 271| End | Aligned with the end edge in the same direction as the language in use. | 272 273## FlexAlign 274 275Since API version 9, this API is supported in ArkTS widgets. 276 277| Name | Description | 278| ------------ | ------------------------------------------------------------ | 279| Start | The child components are aligned with the start edge of the main axis. The first component is aligned with the main-start, and subsequent components are aligned with the previous one.| 280| Center | The child components are aligned in the center of the main axis. The space between the first component and the main-start is the same as that between the last component and the main-end.| 281| End | The child components are aligned with the end edge of the main axis. The last component is aligned with the main-end, and other components are aligned with the next one.| 282| SpaceBetween | The child components are evenly distributed along the main axis. The space between any two adjacent components is the same. The first component is aligned with the main-start, the last component is aligned with the main-end, and the remaining components are distributed so that the space between any two adjacent components is the same.| 283| SpaceAround | The child components are evenly distributed along the main axis. The space between any two adjacent components is the same. The space between the first component and main-start, and that between the last component and cross-main are both half the size of the space between two adjacent components.| 284| SpaceEvenly | The child components are evenly distributed along the main axis. The space between the first component and main-start, the space between the last component and main-end, and the space between any two adjacent components are the same.| 285 286## ItemAlign 287 288Since API version 9, this API is supported in ArkTS widgets. 289 290| Name | Description | 291| -------- | ------------------------------------------------------------ | 292| Auto | The default configuration of the flex container is used. | 293| Start | The items in the flex container are aligned with the cross-start edge. | 294| Center | The items in the flex container are centered along the cross axis. | 295| End | The items in the flex container are aligned with the cross-end edge. | 296| Stretch | The items in the flex container are stretched and padded along the cross axis. If the flex container has the **Wrap** attribute set to **FlexWrap.Wrap** or **FlexWrap.WrapReverse**, the items are stretched to the cross size of the widest element on the current row or column. In other cases, the items with no size set are stretched to the container size.| 297| Baseline | The items in the flex container are aligned in such a manner that their text baselines are aligned along the cross axis. | 298 299## FlexDirection 300 301Since API version 9, this API is supported in ArkTS widgets. 302 303| Name | Description | 304| ------------- | ------------------------------ | 305| Row | The child components are arranged in the same direction as the main axis runs along the rows.| 306| RowReverse | The child components are arranged opposite to the **Row** direction. | 307| Column | The child components are arranged in the same direction as the main axis runs down the columns.| 308| ColumnReverse | The child components are arranged opposite to the **Column** direction. | 309 310## FlexWrap 311 312Since API version 9, this API is supported in ArkTS widgets. 313 314| Name | Description | 315| ----------- | ------------------------------------------------- | 316| NoWrap | The child components in the flex container are arranged in a single line, and they cannot overflow. | 317| Wrap | The child components in the flex container are arranged in multiple lines, and they may overflow. | 318| WrapReverse | The child components in the flex container are reversely arranged in multiple lines, and they may overflow.| 319 320## VerticalAlign 321 322Since API version 9, this API is supported in ArkTS widgets. 323 324| Name | Description | 325| ------ | ------------------------ | 326| Top | Top aligned. | 327| Center | Center aligned. This is the default alignment mode.| 328| Bottom | Bottom aligned. | 329 330## ImageRepeat 331 332Since API version 9, this API is supported in ArkTS widgets. 333 334| Name | Description | 335| -------- | -------------------------- | 336| X | The image is repeatedly drawn only along the horizontal axis.| 337| Y | The image is repeatedly drawn only along the vertical axis.| 338| XY | The image is repeatedly drawn along both axes. | 339| NoRepeat | The image is not repeatedly drawn. | 340 341## ImageSize 342 343Since API version 9, this API is supported in ArkTS widgets. 344 345| Type | Description | 346| ------- | ------------------------------------------------------------ | 347| Cover | Default value. The image is scaled with its aspect ratio retained for both sides to be greater than or equal to the display boundaries.| 348| Contain | The image is scaled with its aspect ratio retained for the content to be completely displayed within the display boundaries. | 349| Auto | The original image aspect ratio is retained. | 350 351## GradientDirection 352 353Since API version 9, this API is supported in ArkTS widgets. 354 355| Name | Description | 356| ----------- | ---------- | 357| Left | The gradient direction is from right to left.| 358| Top | The gradient direction is from bottom to top.| 359| Right | The gradient direction is from left to right.| 360| Bottom | The gradient direction is from top to bottom.| 361| LeftTop | The gradient direction is upper left. | 362| LeftBottom | The gradient direction is lower left. | 363| RightTop | The gradient direction is upper right. | 364| RightBottom | The gradient direction is lower right. | 365| None | No gradient. | 366 367## SharedTransitionEffectType 368 369| Name | Description | 370| ----------- | ---------- | 371| Static | The element position remains unchanged on the target page, and transition opacity can be configured. Currently, this effect is only valid in redirecting to the target page.| 372| Exchange | The element is relocated and scaled properly on the target page.| 373 374## FontStyle 375 376Since API version 9, this API is supported in ArkTS widgets. 377 378| Name | Description | 379| ------ | ---------------- | 380| Normal | Standard font style.| 381| Italic | Italic font style.| 382 383## FontWeight 384 385Since API version 9, this API is supported in ArkTS widgets. 386 387| Name | Description | 388| ------- | -------------- | 389| Lighter | The font weight is lighter. | 390| Normal | The font weight is normal.| 391| Regular | The font weight is regular.| 392| Medium | The font weight is medium.| 393| Bold | The font weight is bold. | 394| Bolder | The font weight is bolder. | 395 396## TextAlign 397 398Since API version 9, this API is supported in ArkTS widgets. 399 400| Name | Description | 401| --------------------- | -------------- | 402| Start | Aligned with the start.| 403| Center | Horizontally centered.| 404| End | Aligned with the end.| 405 406## TextOverflow 407 408Since API version 9, this API is supported in ArkTS widgets. 409 410| Name | Description | 411| --------------------- | -------------------------------------- | 412| Clip | Extra-long text is clipped. | 413| Ellipsis | An ellipsis (...) is used to represent text overflow.| 414| None | No clipping or ellipsis is used for text overflow. | 415 416## TextDecorationType 417 418Since API version 9, this API is supported in ArkTS widgets. 419 420| Name | Description | 421| ----------- | ------------------ | 422| Underline | Line under the text. | 423| LineThrough | Line through the text.| 424| Overline | Line over the text. | 425| None | No decorative lines.| 426 427## TextCase 428 429Since API version 9, this API is supported in ArkTS widgets. 430 431| Name | Description | 432| --------- | -------------------- | 433| Normal | The original case of the text is retained.| 434| LowerCase | All letters in the text are in lowercase. | 435| UpperCase | All letters in the text are in uppercase. | 436 437## ResponseType<sup>8+</sup> 438 439| Name | Description | 440| ---------- | -------------------------- | 441| LongPress | The menu is displayed when the component is long-pressed. | 442| RightClick | The menu is displayed when the component is right-clicked.| 443 444## HoverEffect<sup>8+</sup> 445 446| Name | Description | 447| --------- | ---------------------------- | 448| Auto | Default hover effect.| 449| Scale | Scale effect. | 450| Highlight | Background fade-in and fade-out effect. | 451| None | No effect. | 452 453## Placement<sup>8+</sup> 454 455| Name | Description | 456| ------------- | ------------------------------------------------------------ | 457| Left | The popup is on the left of the component, vertically aligned with the component on the left. | 458| Right | The popup is on the right of the component, vertically aligned with the component on the right. | 459| Top | The popup is at the top of the component, horizontally aligned with the component at the top. | 460| Bottom | The popup is at the bottom of the component, horizontally aligned with the component at the bottom. | 461| TopLeft | The popup is at the top of the component and, since API version 9, aligned with the left of the component.| 462| TopRight | The popup is at the top of the component and, since API version 9, aligned with the right of the component.| 463| BottomLeft | The popup is at the bottom of the component and, since API version 9, aligned with the left of the component.| 464| BottomRight | The popup is at the bottom of the component and, since API version 9, aligned with the right of the component.| 465| LeftTop9+ | The popup is on the left of the component and aligned with the top of the component. | 466| LeftBottom9+ | The popup is on the left of the component and aligned with the bottom of the component. | 467| RightTop9+ | The popup is on the right of the component and aligned with the top of the component. | 468| RightBottom9+ | The popup is on the right of the component and aligned with the bottom of the component. | 469 470## CopyOptions<sup>9+</sup> 471 472Since API version 9, this API is supported in ArkTS widgets. 473 474| Name | Description | 475| ----------- | -------------------- | 476| None | Copy is not allowed. | 477| InApp | Intra-application copy is allowed.| 478| LocalDevice | Intra-device copy is allowed.| 479 480## HitTestMode<sup>9+</sup> 481 482| Name | Description | 483| ----------- | -------------------- | 484| Default | Both the node and its child node respond to the hit test of a touch event, but its sibling node is blocked from the hit test. | 485| Block | The node responds to the hit test of a touch event, but its child node and sibling node are blocked from the hit test. | 486| Transparent | Both the node and its child node respond to the hit test of a touch event, and its sibling node is also considered during the hit test.| 487| None | The node does not respond to the hit test of a touch event, but its child node and sibling node are considered during the hit test.| 488