# Built-in Enums ## Color | Color | Value | Illustration | | ------------------------ | -------- | ------------------------------------------------------------ | | Black | 0x000000 | ![en-us_image_0000001219864153](figures/en-us_image_0000001219864153.png) | | Blue | 0x0000ff | ![en-us_image_0000001174104404](figures/en-us_image_0000001174104404.png) | | Brown | 0xa52a2a | ![en-us_image_0000001219744201](figures/en-us_image_0000001219744201.png) | | Gray | 0x808080 | ![en-us_image_0000001174264376](figures/en-us_image_0000001174264376.png) | | Grey | 0x808080 | ![en-us_image_0000001174264376](figures/en-us_image_0000001174264376.png) | | Green | 0x008000 | ![en-us_image_0000001174422914](figures/en-us_image_0000001174422914.png) | | Orange | 0xffa500 | ![en-us_image_0000001219662661](figures/en-us_image_0000001219662661.png) | | Pink | 0xffc0cb | ![en-us_image_0000001219662663](figures/en-us_image_0000001219662663.png) | | Red | 0xff0000 | ![en-us_image_0000001219662665](figures/en-us_image_0000001219662665.png) | | White | 0xffffff | ![en-us_image_0000001174582866](figures/en-us_image_0000001174582866.png) | | Yellow | 0xffff00 | ![en-us_image_0000001174582864](figures/en-us_image_0000001174582864.png) | | Transparent9+ | rgba(0,0,0,0) | Transparent | ## ImageFit | Name | Description | | --------- | ------------------------------------------------------------ | | Contain | The image is scaled with its aspect ratio retained for the content to be completely displayed within the display boundaries. | | Cover | The image is scaled with its aspect ratio retained for both sides to be greater than or equal to the display boundaries.| | Auto | The image is scaled automatically to fit the display area. | | Fill | The image is scaled to fill the display area, and its aspect ratio is not retained. | | ScaleDown | The image is displayed with its aspect ratio retained, in a size smaller than or equal to the original size. | | None | The original size is retained. | ## BorderStyle | Name | Description | | ------ | ----------------------------------------------- | | Dotted | Dotted border. The radius of a dot is half of **borderWidth**.| | Dashed | Dashed border. | | Solid | Solid border. | ## LineJoinStyle | Name | Description | | ----- | -------------------- | | Bevel | Bevel is used to connect paths.| | Miter | Miter is used to connect paths.| | Round | Round is used to connect paths.| ## TouchType | Name | Description | | ------ | ------------------------------ | | Down | A finger is pressed. | | Up | A finger is lifted. | | Move | A finger moves on the screen in pressed state.| | Cancel | A touch event is canceled. | ## MouseButton | Name | Description | | ------- | ---------------- | | Left | Left button on the mouse. | | Right | Right button on the mouse. | | Middle | Middle button on the mouse. | | Back | Back button on the left of the mouse.| | Forward | Forward button on the left of the mouse.| | None | No button. | ## MouseAction | Name | Description | | ------- | -------------- | | Press | The mouse button is pressed.| | Release | The mouse button is released.| | Move | The mouse cursor moves. | | Hover | The mouse pointer is hovered on an element. | ## Curve | Name | Description | | ------------------- | ------------------------------------------------------------ | | Linear | The animation speed keeps unchanged. | | 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.| | 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. | | EaseOut | The animation ends at a low speed. The cubic-bezier curve (0.0, 0.0, 0.58, 1.0) is used. | | EaseInOut | The animation starts and ends at a low speed. The cubic-bezier curve (0.42, 0.0, 0.58, 1.0) is used.| | FastOutSlowIn | The animation uses the standard cubic-bezier curve (0.4, 0.0, 0.2, 1.0). | | LinearOutSlowIn | The animation uses the deceleration cubic-bezier curve (0.0, 0.0, 0.2, 1.0). | | FastOutLinearIn | The animation uses the acceleration cubic-bezier curve (0.4, 0.0, 1.0, 1.0). | | ExtremeDeceleration | The animation uses the extreme deceleration cubic-bezier curve (0.0, 0.0, 0.0, 1.0). | | Sharp | The animation uses the sharp cubic-bezier curve (0.33, 0.0, 0.67, 1.0). | | Rhythm | The animation uses the rhythm cubic-bezier curve (0.7, 0.0, 0.2, 1.0). | | Smooth | The animation uses the smooth cubic-bezier curve (0.4, 0.0, 0.4, 1.0). | | Friction | The animation uses the friction cubic-bezier curve (0.2, 0.0, 0.2, 1.0). | ## AnimationStatus | Name | Description | | ------- | ------------------ | | Initial | The animation is in the initial state. | | Running | The animation is being played.| | Paused | The animation is paused.| | Stopped | The animation is stopped.| ## FillMode | Name | Description | | --------- | ------------------------------------------------------------ | | 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.| | Forwards | The target component retains the state set by the last keyframe encountered during execution of the animation. | | 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.| | Both | The animation follows the rules for both **Forwards** and **Backwards**, extending the animation attributes in both directions.| ## PlayMode | Name | Description | | ---------------- | ------------------------------------------------------------ | | Normal | The animation is played forwards. | | Reverse | The animation is played backwards. | | 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...).| | 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...).| ## KeyType | Name| Description | | ---- | ---------- | | Down | The key is pressed.| | Up | The key is released.| ## KeySource | Name | Description | | -------- | -------------------- | | Unknown | Unknown input device. | | Keyboard | The input device is a keyboard.| ## Edge | Name | Description | | -------- | ---------------------- | | Top | Top edge in the vertical direction. | | Center(deprecated) | Center position in the vertical direction.
This API is deprecated since API version 9. | | Bottom | Bottom edge in the vertical direction. | | Baseline(deprecated) | Text baseline position in the cross axis direction.
This API is deprecated since API version 9.| | Start | Start position in the horizontal direction. | | Middle(deprecated) | Center position in the horizontal direction.
This API is deprecated since API version 9. | | End | End position in the horizontal direction. | ## Week | Name | Description | | -------- | ---------------------- | | Mon | Monday. | | Tue | Tuesday. | | Wed | Wednesday. | | Thur | Thursday. | | Fri | Friday. | | Sat | Saturday. | | Sun | Sunday. | ## Direction | Name| Description | | ---- | ---------------------- | | Ltr | Components are arranged from left to right. | | Rtl | Components are arranged from right to left. | | Auto | The default layout direction is used.| ## BarState | Name| Description | | ---- | -------------------------------- | | Off | Not displayed. | | On | Always displayed. | | Auto | Displayed when the screen is touched and hidden after 2s.| ## EdgeEffect | Name | Description | | ------ | ------------------------------------------------------------ | | 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.| | Fade | Fade effect. When at one of the edges, the component produces a fade effect. | | None | No effect when the component is at one of the edges. | ## Alignment | Name | Description | | ----------- | ---------------- | | TopStart | Top start. | | Top | Horizontally centered on the top. | | TopEnd | Top end. | | Start | Vertically centered start.| | Center | Horizontally and vertically centered.| | End | Vertically centered end. | | BottomStart | Bottom start. | | Bottom | Horizontally centered on the bottom. | | BottomEnd | Bottom end. | ## TransitionType | Name | Description | | ------ | -------------------------------------------------- | | All | The transition takes effect in all scenarios.| | Insert | The transition takes effect when a component is inserted. | | Delete | The transition takes effect when a component is deleted. | ## RelateType | Name | Description | | ------ | ------------------------------- | | FILL | The current child component is scaled to fill the parent component. | | FIT | The current child component is scaled to adapt to the parent component. | ## Visibility | Name | Description | | ------- | -------------------------------- | | Hidden | The component is hidden, and a placeholder is used for it in the layout. | | Visible | The component is visible. | | None | The component is hidden. It is not involved in the layout, and no placeholder is used for it.| ## LineCapStyle | Name | Description | | ------ | -------------------- | | Butt | The ends of the line are squared off, and the line does not extend beyond its two endpoints.| | Round | The line is extended at the endpoints by a half circle whose diameter is equal to the line width.| | 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.| ## Axis | Name | Description | | ---------- | ------------ | | Vertical | Vertical direction.| | Horizontal | Horizontal direction.| ## HorizontalAlign | Name | Description | | ------ | ------------------------ | | Start | Aligned with the start edge in the same direction as the language in use.| | Center | Aligned with the center. This is the default alignment mode.| | End | Aligned with the end edge in the same direction as the language in use. | ## FlexAlign | Name | Description | | ------------ | ------------------------------------------------------------ | | 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.| | 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.| | 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.| | 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.| | 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.| | 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.| ## ItemAlign | Name | Description | | -------- | ------------------------------------------------------------ | | Auto | The default configuration in the flex container is used. | | Start | The elements are in the flex container, top-aligned in the cross-axis direction. | | Center | The elements are in the flex container, centered in the cross-axis direction. | | End | The elements are in the flex container, bottom-aligned in the cross-axis direction. | | 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.| | Baseline | The elements are in the flex container, text baseline aligned in the cross-axis direction. | ## FlexDirection | Name | Description | | ------------- | ------------------------------ | | Row | The child components are arranged in the same direction as the main axis runs along the rows.| | RowReverse | The child components are arranged opposite to the **Row** direction. | | Column | The child components are arranged in the same direction as the main axis runs down the columns.| | ColumnReverse | The child components are arranged opposite to the **Column** direction. | ## FlexWrap | Name | Description | | ----------- | ------------------------------------------------- | | NoWrap | The child components in the flex container are arranged in a single line, and they cannot overflow. | | Wrap | The child components in the flex container are arranged in multiple lines, and they may overflow. | | WrapReverse | The child components in the flex container are reversely arranged in multiple lines, and they may overflow.| ## VerticalAlign | Name | Description | | ------ | ------------------------ | | Top | Top aligned. | | Center | Center aligned. This is the default alignment mode.| | Bottom | Bottom aligned. | ## ImageRepeat | Name | Description | | -------- | -------------------------- | | X | The image is repeatedly drawn only along the horizontal axis.| | Y | The image is repeatedly drawn only along the vertical axis.| | XY | The image is repeatedly drawn along both axes. | | NoRepeat | The image is not repeatedly drawn. | ## ImageSize | Type | Description | | ------- | ------------------------------------------------------------ | | 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.| | Contain | The image is scaled with its aspect ratio retained for the content to be completely displayed within the display boundaries. | | Auto | The original image aspect ratio is retained. | ## GradientDirection | Name | Description | | ----------- | ---------- | | Left | The gradient direction is from right to left.| | Top | The gradient direction is from bottom to top.| | Right | The gradient direction is from left to right.| | Bottom | The gradient direction is from top to bottom.| | LeftTop | The gradient direction is upper left. | | LeftBottom | The gradient direction is lower left. | | RightTop | The gradient direction is upper right. | | RightBottom | The gradient direction is lower right. | | None | No gradient. | ## SharedTransitionEffectType | Name | Description | | ----------- | ---------- | | 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.| | Exchange | The element is relocated and scaled properly on the target page.| ## FontStyle | Name | Description | | ------ | ---------------- | | Normal | Standard font style.| | Italic | Italic font style.| ## FontWeight | Name | Description | | ------- | -------------- | | Lighter | The font weight is lighter. | | Normal | The font weight is normal.| | Regular | The font weight is regular.| | Medium | The font weight is medium.| | Bold | The font weight is bold. | | Bolder | The font weight is bolder. | ## TextAlign | Name | Description | | ------ | -------------- | | Start | Aligned with the start.| | Center | Horizontally centered.| | End | Aligned with the end.| ## TextOverflow | Name | Description | | -------- | -------------------------------------- | | Clip | Extra-long text is truncated. | | Ellipsis | An ellipsis (...) is used to represent clipped text.| | None | No truncation or ellipsis is used for extra-long text. | ## TextDecorationType | Name | Description | | ----------- | ------------------ | | Underline | Line under the text. | | LineThrough | Line through the text.| | Overline | Line over the text. | | None | No decorative lines.| ## TextCase | Name | Description | | --------- | -------------------- | | Normal | The original case of the text is retained.| | LowerCase | All letters in the text are in lowercase. | | UpperCase | All letters in the text are in uppercase. | ## ResponseType8+ | Name | Description | | ---------- | -------------------------- | | LongPress | The menu is displayed when the component is long-pressed. | | RightClick | The menu is displayed when the component is right-clicked.| ## HoverEffect8+ | Name | Description | | --------- | ---------------------------- | | Auto | Default hover effect.| | Scale | Scale effect. | | Highlight | Background fade-in and fade-out effect. | | None | No effect. | ## Placement8+ | Name | Description | | ------------- | ------------------------------------------------------------ | | Left | The popup is on the left of the component, vertically aligned with the component on the left. | | Right | The popup is on the right of the component, vertically aligned with the component on the right. | | Top | The popup is at the top of the component, horizontally aligned with the component at the top. | | Bottom | The popup is at the bottom of the component, horizontally aligned with the component at the bottom. | | TopLeft | The popup is at the top of the component and, since API version 9, aligned with the left of the component.| | TopRight | The popup is at the top of the component and, since API version 9, aligned with the right of the component.| | BottomLeft | The popup is at the bottom of the component and, since API version 9, aligned with the left of the component.| | BottomRight | The popup is at the bottom of the component and, since API version 9, aligned with the right of the component.| | LeftTop9+ | The popup is on the left of the component and aligned with the top of the component. | | LeftBottom9+ | The popup is on the left of the component and aligned with the bottom of the component. | | RightTop9+ | The popup is on the right of the component and aligned with the top of the component. | | RightBottom9+ | The popup is on the right of the component and aligned with the bottom of the component. | ## CopyOptions9+ | Name | Description | | ----------- | -------------------- | | None | Copy and paste is not allowed. | | InApp | Intra-application copy and paste is allowed.| | LocalDevice | Intra-device copy and paste is allowed.| ## HitTestMode9+ | Name | Description | | ----------- | -------------------- | | 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. | | 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. | | 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.| | 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.|