1# Built-in Enums 2 3## Color 4 5| Color | Value | Illustration | 6| ------------------------ | -------- | ------------------------------------------------------------ | 7| Black | 0x000000 |  | 8| Blue | 0x0000ff |  | 9| Brown | 0xa52a2a |  | 10| Gray | 0x808080 |  | 11| Green | 0x008000 |  | 12| Orange | 0xffa500 |  | 13| Pink | 0xffc0cb |  | 14| Red | 0xff0000 |  | 15| White | 0xffffff |  | 16| Yellow | 0xffff00 |  | 17| Grey | 0x808080 |  | 18 19## ImageFit 20 21| Name | Description | 22| --------- | ------------------------------------------------------------ | 23| Contain | The image is scaled with its aspect ratio retained for the content to be completely displayed within the display boundaries. | 24| Cover | The image is scaled with its aspect ratio retained for both sides to be greater than or equal to the display boundaries.| 25| Auto | The image is scaled automatically to fit the display area. | 26| Fill | The image is scaled to fill the display area, and its aspect ratio is not retained. | 27| ScaleDown | The image is displayed with its aspect ratio retained, in a size smaller than or equal to the original size. | 28| None | The original size is retained. | 29 30## BorderStyle 31 32| Name | Description | 33| ------ | ----------------------------------------------- | 34| Dotted | Dotted border. The radius of a dot is half of **borderWidth**.| 35| Dashed | Dashed border. | 36| Solid | Solid border. | 37 38## LineJoinStyle 39 40| Name | Description | 41| ----- | -------------------- | 42| Bevel | Bevel is used to connect paths.| 43| Miter | Miter is used to connect paths.| 44| Round | Round is used to connect paths.| 45 46## TouchType 47 48| Name | Description | 49| ------ | ------------------------------ | 50| Down | A finger is pressed. | 51| Up | A finger is lifted. | 52| Move | A finger moves on the screen in pressed state.| 53| Cancel | A touch event is canceled. | 54 55## MouseButton 56 57| Name | Description | 58| ------- | ---------------------------------------- | 59| Left | Left button on the mouse. | 60| Right | Right button on the mouse. | 61| Middle | Middle button on the mouse. | 62| Back | Back button on the left of the mouse. | 63| Forward | Forward button on the left of the mouse. | 64| None | No button. | 65 66## MouseAction 67 68| Name | Description | 69| ------- | -------------- | 70| Press | The mouse button is pressed.| 71| Release | The mouse button is released.| 72| Move | The mouse cursor moves. | 73| Hover | The mouse pointer is hovered on an element. | 74 75## Curve 76 77| Name | Description | 78| ------------------- | ------------------------------------------------------------ | 79| Linear | The animation speed keeps unchanged. | 80| 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.| 81| 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. | 82| EaseOut | The animation ends at a low speed. The cubic-bezier curve (0.0, 0.0, 0.58, 1.0) is used. | 83| EaseInOut | The animation starts and ends at a low speed. The cubic-bezier curve (0.42, 0.0, 0.58, 1.0) is used.| 84| FastOutSlowIn | The animation uses the standard cubic-bezier curve (0.4, 0.0, 0.2, 1.0). | 85| LinearOutSlowIn | The animation uses the deceleration cubic-bezier curve (0.0, 0.0, 0.2, 1.0). | 86| FastOutLinearIn | The animation uses the acceleration cubic-bezier curve (0.4, 0.0, 1.0, 1.0). | 87| ExtremeDeceleration | The animation uses the extreme deceleration cubic-bezier curve (0.0, 0.0, 0.0, 1.0). | 88| Sharp | The animation uses the sharp cubic-bezier curve (0.33, 0.0, 0.67, 1.0). | 89| Rhythm | The animation uses the rhythm cubic-bezier curve (0.7, 0.0, 0.2, 1.0). | 90| Smooth | The animation uses the smooth cubic-bezier curve (0.4, 0.0, 0.4, 1.0). | 91| Friction | The animation uses the friction cubic-bezier curve (0.2, 0.0, 0.2, 1.0). | 92 93## AnimationStatus 94 95| Name | Description | 96| ------- | ------------------ | 97| Initial | The animation is in the initial state. | 98| Running | The animation is being played.| 99| Paused | The animation is paused.| 100| Stopped | The animation is stopped.| 101 102## FillMode 103 104| Name | Description | 105| -------- | -------------------------------- | 106| None | After the playback is complete, the animation restores to the initial state. | 107| Forwards | After the playback is complete, the animation remains in the end state.| 108| Backwards | The start attribute value is applied during the specified period and before the animation is played. | 109| Both | Both the **Forwards** and **Backwards** modes are applied. | 110 111## PlayMode 112 113| Name | Description | 114| ---------------- | ------------------------------------------------------------ | 115| Normal | The animation is played forwards. | 116| Reverse | The animation is played backwards. | 117| 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...).| 118| 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...).| 119 120## KeyType 121 122| Name| Description | 123| ---- | ---------- | 124| Down | The key is pressed.| 125| Up | The key is released.| 126 127## KeySource 128 129| Name | Description | 130| -------- | -------------------- | 131| Unknown | Unknown input device. | 132| Keyboard | The input device is a keyboard.| 133 134## Edge 135 136| Name | Description | 137| -------- | ---------------------- | 138| Top | Top edge in the vertical direction. | 139| Center | Center position in the vertical direction. | 140| Bottom | Bottom edge in the vertical direction. | 141| Baseline | Text baseline position in the cross axis direction.| 142| Start | Start position in the horizontal direction. | 143| Middle | Center position in the horizontal direction. | 144| End | End position in the horizontal direction. | 145 146## Week 147 148| Name | Description | 149| -------- | ---------------------- | 150| Mon | Monday. | 151| Tue | Tuesday. | 152| Wed | Wednesday. | 153| Thur | Thursday. | 154| Fri | Friday. | 155| Sat | Saturday. | 156| Sun | Sunday. | 157 158## Direction 159 160| Name| Description | 161| ---- | ---------------------- | 162| Ltr | Components are arranged from left to right. | 163| Rtl | Components are arranged from right to left. | 164| Auto | The default layout direction is used.| 165 166## BarState 167 168| Name| Description | 169| ---- | -------------------------------- | 170| Off | Not displayed. | 171| On | Always displayed. | 172| Auto | Displayed when the screen is touched and hidden after 2s.| 173 174## EdgeEffect 175 176| Name | Description | 177| ------ | ------------------------------------------------------------ | 178| 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.| 179| Fade | Fade effect. When at one of the edges, the component produces a fade effect. | 180| None | No effect when the component is at one of the edges. | 181 182## Alignment 183 184| Name | Description | 185| ----------- | ---------------- | 186| TopStart | Top start. | 187| Top | Horizontally centered on the top. | 188| TopEnd | Top end. | 189| Start | Vertically centered start.| 190| Center | Horizontally and vertically centered.| 191| End | Vertically centered end. | 192| BottomStart | Bottom start. | 193| Bottom | Horizontally centered on the bottom. | 194| BottomEnd | Bottom end. | 195 196## TransitionType 197 198| Name | Description | 199| ------ | -------------------------------------------------- | 200| All | The transition takes effect in all scenarios.| 201| Insert | The transition takes effect when a component is inserted. | 202| Delete | The transition takes effect when a component is deleted. | 203 204## RelateType 205 206| Name | Description | 207| ------ | ------------------------------- | 208| FILL | The current child component is scaled to fill the parent component. | 209| FIT | The current child component is scaled to adapt to the parent component. | 210 211## Visibility 212 213| Name | Description | 214| ------- | -------------------------------- | 215| Hidden | The component is hidden, and a placeholder is used for it in the layout. | 216| Visible | The component is visible. | 217| None | The component is hidden. It is not involved in the layout, and no placeholder is used for it.| 218 219## LineCapStyle 220 221| Name | Description | 222| ------ | -------------------- | 223| Butt | The ends of dividing lines are butt.| 224| Round | The ends of dividing lines are rounded. | 225| Square | The ends of dividing lines are butt.| 226 227## Axis 228 229| Name | Description | 230| ---------- | ------------ | 231| Vertical | Vertical direction.| 232| Horizontal | Horizontal direction.| 233 234## HorizontalAlign 235 236| Name | Description | 237| ------ | ------------------------ | 238| Start | Aligned with the start edge in the same direction as the language in use.| 239| Center | Aligned with the center. This is the default alignment mode.| 240| End | Aligned with the end edge in the same direction as the language in use. | 241 242## FlexAlign 243 244| Name | Description | 245| ------------ | ------------------------------------------------------------ | 246| 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.| 247| 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.| 248| 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.| 249| 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.| 250| 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.| 251| SpaceEvenly | The child components are equally 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 two adjacent components are the same.| 252 253## ItemAlign 254 255| Name | Description | 256| -------- | ------------------------------------------------------------ | 257| Auto | The default configuration in the flex container is used. | 258| Start | The elements are in the flex container, top-aligned in the cross-axis direction. | 259| Center | The elements are in the flex container, centered in the cross-axis direction. | 260| End | The elements are in the flex container, bottom-aligned in the cross-axis direction. | 261| Stretch | The elements are in the flex container, stretched and padded in the cross-axis direction. If the size is not set, the elements are stretched to the container size.| 262| Baseline | The elements are in the flex container, text baseline aligned in the cross-axis direction. | 263 264## FlexDirection 265 266| Name | Description | 267| ------------- | ------------------------------ | 268| Row | The child components are arranged in the same direction as the main axis runs along the rows.| 269| RowReverse | The child components are arranged opposite to the **Row** direction. | 270| Column | The child components are arranged in the same direction as the main axis runs down the columns.| 271| ColumnReverse | The child components are arranged opposite to the **Column** direction. | 272 273## FlexWrap 274 275| Name | Description | 276| ----------- | ------------------------------------------------- | 277| NoWrap | The child components in the flex container are arranged in a single line, and they cannot overflow. | 278| Wrap | The child components in the flex container are arranged in multiple lines, and they may overflow. | 279| WrapReverse | The child components in the flex container are reversely arranged in multiple lines, and they may overflow. | 280 281## VerticalAlign 282 283| Name | Description | 284| ------ | ------------------------ | 285| Top | Top aligned. | 286| Center | Center aligned. This is the default alignment mode.| 287| Bottom | Bottom aligned. | 288 289## ImageRepeat 290 291| Name | Description | 292| -------- | -------------------------- | 293| X | The image is repeatedly drawn only along the horizontal axis.| 294| Y | The image is repeatedly drawn only along the vertical axis.| 295| XY | The image is repeatedly drawn along both axes. | 296| NoRepeat | The image is not repeatedly drawn. | 297 298## ImageSize 299 300| Type | Description | 301| ------- | ------------------------------------------------------------ | 302| 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.| 303| Contain | The image is scaled with its aspect ratio retained for the content to be completely displayed within the display boundaries. | 304| Auto | The original image aspect ratio is retained. | 305 306## GradientDirection 307 308| Name | Description | 309| ----------- | ---------- | 310| Left | The gradient direction is from right to left.| 311| Top | The gradient direction is from bottom to top.| 312| Right | The gradient direction is from left to right.| 313| Bottom | The gradient direction is from top to bottom.| 314| LeftTop | The gradient direction is upper left. | 315| LeftBottom | The gradient direction is lower left. | 316| RightTop | The gradient direction is upper right. | 317| RightBottom | The gradient direction is lower right. | 318| None | No gradient. | 319 320## SharedTransitionEffectType 321 322| Name | Description | 323| ----------- | ---------- | 324| 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.| 325| Exchange | The element is relocated and scaled properly on the target page.| 326 327## FontStyle 328 329| Name | Description | 330| ------ | ---------------- | 331| Normal | Standard font style.| 332| Italic | Italic font style.| 333 334## FontWeight 335 336| Name | Description | 337| ------- | -------------- | 338| Lighter | The font weight is lighter. | 339| Normal | The font weight is normal.| 340| Regular | The font weight is regular.| 341| Medium | The font weight is medium.| 342| Bold | The font weight is bold. | 343| Bolder | The font weight is bolder. | 344 345## TextAlign 346 347| Name | Description | 348| ------ | -------------- | 349| Start | Aligned with the start.| 350| Center | Horizontally centered.| 351| End | Aligned with the end.| 352 353## TextOverflow 354 355| Name | Description | 356| -------- | -------------------------------------- | 357| Clip | Extra-long text is truncated. | 358| Ellipsis | An ellipsis (...) is used to represent clipped text.| 359| None | No truncation or ellipsis is used for extra-long text. | 360 361## TextDecorationType 362 363| Name | Description | 364| ----------- | ------------------ | 365| Underline | Line under the text. | 366| LineThrough | Line through the text.| 367| Overline | Line over the text. | 368| None | No decorative lines.| 369 370## TextCase 371 372| Name | Description | 373| --------- | -------------------- | 374| Normal | The original case of the text is retained.| 375| LowerCase | All letters in the text are in lowercase. | 376| UpperCase | All letters in the text are in uppercase. | 377 378## ResponseType<sup>8+</sup> 379 380| Name | Description | 381| ---------- | -------------------------- | 382| LongPress | The menu is displayed when the component is long-pressed. | 383| RightClick | The menu is displayed when the component is right-clicked.| 384 385## HoverEffect<sup>8+</sup> 386 387| Name | Description | 388| --------- | ---------------------------- | 389| Auto | Default hover effect.| 390| Scale | Scale effect. | 391| Highlight | Background fade-in and fade-out effect. | 392| None | No effect. | 393 394## Placement<sup>8+</sup> 395 396| Name | Description | 397| ------------- | ------------------------------------------------------------ | 398| Left | The popup is on the left of the component, vertically aligned with the component on the left. | 399| Right | The popup is on the right of the component, vertically aligned with the component on the right. | 400| Top | The popup is at the top of the component, horizontally aligned with the component at the top. | 401| Bottom | The popup is at the bottom of the component, horizontally aligned with the component at the bottom. | 402| TopLeft | The popup is at the top of the component. | 403| TopRight | The popup is at the top of the component. | 404| BottomLeft | The popup is at the bottom of the component. | 405| BottomRight | The popup is at the bottom of the component. | 406
