| Auto | The default configuration of the flex container is used. |
| Start | The items in the flex container are aligned with the cross-start edge. |
| Center | The items in the flex container are centered along the cross axis. |
| End | The items in the flex container are aligned with the cross-end edge. |
| 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.|
| Baseline | The items in the flex container are aligned in such a manner that their text baselines are aligned along the cross axis. |
| Auto | The default configuration of the container (**\<Flex>** or **\<GridRow>**) is used. |
| Start | The items in the container (**\<Flex>** or **\<GridRow>**) are aligned with the cross-start edge. |
| Center | The items in the container (**\<Flex>** or **\<GridRow>**) are centered along the cross axis. |
| End | The items in the container (**\<Flex>** or **\<GridRow>**) are aligned with the cross-end edge. |
| Stretch | The items in the container (**\<Flex>** or **\<GridRow>**) 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.|
| Baseline | The items in the container (**\<Flex>** or **\<GridRow>**) are aligned in such a manner that their text baselines are aligned along the cross axis. |
## FlexDirection
...
...
@@ -384,8 +370,6 @@ Since API version 9, this API is supported in ArkTS widgets.
## SharedTransitionEffectType
Since API version 9, this API is supported in ArkTS widgets.
| 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.|
...
...
@@ -458,8 +442,6 @@ Since API version 9, this API is supported in ArkTS widgets.
## ResponseType<sup>8+</sup>
Since API version 9, this API is supported in ArkTS widgets.
| Name | Description |
| ---------- | -------------------------- |
| LongPress | The menu is displayed when the component is long-pressed. |
...
...
@@ -467,8 +449,6 @@ Since API version 9, this API is supported in ArkTS widgets.
## HoverEffect<sup>8+</sup>
Since API version 9, this API is supported in ArkTS widgets.
| Name | Description |
| --------- | ---------------------------- |
| Auto | Default hover effect.|
...
...
@@ -478,8 +458,6 @@ Since API version 9, this API is supported in ArkTS widgets.
## Placement<sup>8+</sup>
Since API version 9, this API is supported in ArkTS widgets.
| alignItems<sup>10+</sup> | [ItemAlign](ts-appendix-enums.md#itemalign) | Alignment mode of the **\<GridCol>** cross axis.<br>Default value: **ItemAlign.Start**<br>**NOTE**<br>The alignment mode of the **\<GridCol>** component can also be set using **alignSelf([ItemAlign](ts-appendix-enums.md#itemalign))**. If both of the preceding methods are used, the setting of **alignSelf(ItemAlign)** prevails.<br>Since API version 10, this API is supported in ArkTS widgets.|
| alignItems<sup>10+</sup> | [ItemAlign](ts-appendix-enums.md#itemalign) | Alignment mode of the **\<GridCol>** cross axis.<br>Default value: **ItemAlign.Start**<br>**NOTE**<br>In **ItemAlign**, only the enumerated values **Start**, **Center**, **End**, and **Stretch** are supported.<br>The alignment mode of the **\<GridCol>** component can also be set using **alignSelf([ItemAlign](ts-appendix-enums.md#itemalign))**. If both of the preceding methods are used, the setting of **alignSelf(ItemAlign)** prevails.<br>Since API version 10, this API is supported in ArkTS widgets.|
> - The APIs of this module are supported since API version 7. Updates will be marked with a superscript to indicate their earliest API version.
>
> - The flex layout is valid only when the parent component is a **\<Flex>**, **\<Column>**, or **\<Row>** component.
> - The flex layout is valid only when the parent component is a **\<Flex>**, **\<Column>**, **\<Row>**, or **\<GridRow>** component.
## Attributes
...
...
@@ -13,7 +13,7 @@
| flexBasis | number \| string | Base size of the component in the main axis of the parent container.<br>Default value: **'auto'** (indicating that the base size of the component in the main axis is the original size of the component)<br>This attribute cannot be set in percentage.<br>Since API version 9, this API is supported in ArkTS widgets.|
| flexGrow | number | Percentage of the parent container's remaining space that is allocated to the component.<br>Default value: **0**<br>Since API version 9, this API is supported in ArkTS widgets.|
| flexShrink | number | Percentage of the parent container's shrink size that is allocated to the component.<br>When the parent container is **\<Row>** or **\<Column>**, the default value is **0**.<br> When the parent container is **\<Flex>**, the default value is **1**.<br>Since API version 9, this API is supported in ArkTS widgets.|
| alignSelf | [ItemAlign](ts-appendix-enums.md#itemalign) | Alignment mode of the child components along the cross axis of the parent container. The setting overwrites the **alignItems** setting of the parent container.<br>Default value: **ItemAlign.Auto**<br>Since API version 9, this API is supported in ArkTS widgets.|
| alignSelf | [ItemAlign](ts-appendix-enums.md#itemalign) | Alignment mode of the child components along the cross axis of the parent container. The setting overwrites the **alignItems** setting of the parent container (**\<Flex>**, **\<Column>**, **\<Row>**, or **\<GridRow>**).<br>**\<GridCol>** can have the **alignsSelf** attribute bound to change its own layout along the cross axis.<br>Default value: **ItemAlign.Auto**<br>Since API version 9, this API is supported in ArkTS widgets.|
