diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-select.md b/en/application-dev/reference/arkui-ts/ts-basic-components-select.md index 06ea2a8cfc12b54048c6a91c70313fcc48c876f9..834d98d902de5e5bc0244201cae0b2455ccbcb15 100644 --- a/en/application-dev/reference/arkui-ts/ts-basic-components-select.md +++ b/en/application-dev/reference/arkui-ts/ts-basic-components-select.md @@ -28,17 +28,18 @@ In addition to the [universal attributes](ts-universal-attributes-size.md), the | Name | Type | Description | | ----------------------- | ------------------------------------- | --------------------------------------------- | | selected | number | Index of the initial selected option in the drop-down list box. The index of the first option is **0**.
If this attribute is not set, the default value **-1** is used, indicating that no option is selected.
Since API version 10, this attribute supports [$$](../../quick-start/arkts-two-way-sync.md) for two-way binding of variables.| -| value | string | Text of the drop-down button. By default, it will be replaced by the content of the selected option.
Since API version 10, this parameter supports [$$](../../quick-start/arkts-two-way-sync.md) for two-way binding of variables.| -| font | [Font](ts-types.md#font) | Text font of the drop-down button.
Default value:
{
size: '16fp',
weight: FontWeight.Medium
} | +| value | string | Text of the drop-down button. By default, it will be replaced by the content of the selected option.
Since API version 10, this attribute supports [$$](../../quick-start/arkts-two-way-sync.md) for two-way binding of variables. | +| font | [Font](ts-types.md#font) | Text font of the drop-down button.
Default value:
{
size: '16fp',
weight: FontWeight.Medium
} | | fontColor | [ResourceColor](ts-types.md#resourcecolor) | Text color of the drop-down button.
Default value: **'\#E6FFFFFF'**| | selectedOptionBgColor | [ResourceColor](ts-types.md#resourcecolor) | Background color of the selected option in the drop-down list box.
Default value: **'\#33007DFF'**| -| selectedOptionFont | [Font](ts-types.md#font) | Text font of the selected option in the drop-down list box.
Default value:
{
size: '16fp',
weight: FontWeight.Regular
} | +| selectedOptionFont | [Font](ts-types.md#font) | Text font of the selected option in the drop-down list box.
Default value:
{
size: '16fp',
weight: FontWeight.Regular
} | | selectedOptionFontColor | [ResourceColor](ts-types.md#resourcecolor) | Text color of the selected option in the drop-down list box.
Default value: **'\#ff007dff'**| | optionBgColor | [ResourceColor](ts-types.md#resourcecolor) | Background color of an option in the drop-down list box.
Default value: **'\#ffffffff'**| -| optionFont | [Font](ts-types.md#font) | Text font of an option in the drop-down list box.
Default value:
{
size: '16fp',
weight: FontWeight.Regular
} | +| optionFont | [Font](ts-types.md#font) | Text font of an option in the drop-down list box.
Default value:
{
size: '16fp',
weight: FontWeight.Regular
} | | optionFontColor | [ResourceColor](ts-types.md#resourcecolor) | Text color of an option in the drop-down list box.
Default value: **'\#ff182431'**| | space10+ | [Length](ts-types.md#length) | Spacing between the text and arrow of an option.
**NOTE**
This attribute cannot be set in percentage.| | arrowPosition10+ | [ArrowPosition](#arrowposition10) | Alignment between the text and arrow of an option.
Default value: **ArrowPosition.END**| +| menuAlign10+ | alignType: [MenuAlignType](#menualigntype10),
offset?: [Offset](ts-types.md#offset) | Alignment between the drop-down button and the drop-down menu.
- **alignType**: alignment type. Mandatory.
- **offset**: offset of the drop-down menu relative to the drop-down button after alignment based on the specified alignment type.
Default value: **{dx: 0, dy: 0}**| ## ArrowPosition10+ @@ -47,11 +48,20 @@ In addition to the [universal attributes](ts-universal-attributes-size.md), the | END10+ | The text is in front of the arrow.| | START10+ | The arrow is in front of the text.| + +## MenuAlignType10+ + +| Name | Description | +| ------------------- | ------------------ | +| START | Aligned with the start edge in the same direction as the language in use.| +| CENTER | Aligned with the center.| +| END | Aligned with the end edge in the same direction as the language in use.| + ## Events | Name | Description | | ------------------------------------------------------------ | ------------------------------------------------------------ | -| onSelect(callback: (index: number, value?: string) => void) | Invoked when an option in the drop-down list box is selected.
**index**: index of the selected option.
**value**: value of the selected option.| +| onSelect(callback: (index: number, value?: string) => void) | Invoked when an option in the drop-down list box is selected.
**index**: index of the selected option.
**value**: value of the selected option.| ## Example