** component parses and displays HTML text.
+> **NOTE**
+>
+> This component is supported since API version 8. Updates will be marked with a superscript to indicate their earliest API version.
+
## Required Permissions
None
@@ -15,40 +16,39 @@ None
## APIs
-RichText\(content:string\)
+RichText(content:string)
-- Parameters
+**Parameters**
- | Name| Type | Mandatory | Default Value | Description |
- | -------- | -------- | -------- | -------- | -------- |
- | content | string | Yes| - | Text string in HTML format. |
+| Name| Type| Mandatory| Default Value| Description|
+| -------- | -------- | -------- | -------- | -------- |
+| content | string | Yes| - | String in HTML format.|
## Events
-| Name | Description|
+| Name| Description|
| -------- | -------- |
-| onStart() => void | Triggered when web page loading starts. |
-| onComplete() => void | Triggered when web page loading is completed. |
+| onStart(callback: () => void) | Triggered when web page loading starts. |
+| onComplete(callback: () => void) | Triggered when web page loading is completed.|
## Supported Tags
-| Name | Description | Example |
+| Name| Description| Example|
| -------- | -------- | -------- |
-| \--\ | Defines six levels of headings in the HTML document. \ defines the most important heading, and \ defines the least important heading. | \This is an H1 heading\
\This is an H2 heading\
|
-| \
\
| Defines a paragraph. | \This is a paragraph\
|
-| \
| Inserts a newline character. | \This is a paragraph\
This is a new paragraph\
|
-| \
| Defines a thematic break (such as a shift of topic) on an HTML page and creates a horizontal line. | \This is a paragraph\
\
\This is a paragraph\
|
-| \\
| Defines a generic container that is generally used to group block-level elements. It allows you to apply CSS styles to multiple elements at the same time. | \\
This is the heading in a div element\
\ |
-| \\ | Displays text in italic style. | \This is in italic style\ |
-| \\ | Defines text that should be styled differently or have a non-textual annotation, such as misspelt words or a proper name in Chinese text. It is recommended that you avoid using the \ tag where it could be confused with a hyperlink. | \\This is an underlined paragraph\\
|
-| \ | Used to embed CSS within an HTML document. | \ |
-| style | Defines the inline style of an element and is placed inside the tag. Use quotation marks (') to separate the styling text and use semicolons (;) to separate styles, for example, **style='width: 500px;height: 500px;border: 1px solid;margin: 0 auto;'**. | \
This is a heading\
\This is a paragraph\
|
-| \ | Used to embed or reference a client-side script, such as JavaScript. | \ |
+| \--\ | Defines six levels of headings in the HTML document. \ defines the most important heading, and \ defines the least important heading.| \This is an H1 heading\
\This is an H2 heading\
|
+| \
\
| Defines a paragraph.| \This is a paragraph\
|
+| \
| Inserts a newline character.| \This is a paragraph\
This is a new paragraph\
|
+| \
| Defines a thematic break (such as a shift of topic) on an HTML page and creates a horizontal line.| \This is a paragraph\
\
\This is a paragraph\
|
+| \\
| Defines a generic container that is generally used to group block-level elements. It allows you to apply CSS styles to multiple elements at the same time.| \\
This is the heading in a div element\
\ |
+| \\ | Displays text in italic style.| \This is in italic style\|
+| \\ | Defines text that should be styled differently or have a non-textual annotation, such as misspelt words or a proper name in Chinese text. It is recommended that you avoid using the \ tag where it could be confused with a hyperlink.| \\This is an underlined paragraph\\
|
+| \ | Used to embed CSS within an HTML document.| \ |
+| style | Defines the inline style of an element and is placed inside the tag. Use quotation marks (') to separate the styling text and use semicolons (;) to separate styles, for example, **style='width: 500px;height: 500px;border: 1px solid;margin: 0 auto;'**.| \This is a heading\
\This is a paragraph\
|
+| \ | Used to embed or reference a client-side script, such as JavaScript.| \ |
## Example
-
You can preview how this component looks on a real device. The preview is not yet available in the DevEco Studio Previewer.
```ts
// xxx.ets
diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-scrollbar.md b/en/application-dev/reference/arkui-ts/ts-basic-components-scrollbar.md
index c0f5b51dfe9a767842dd32ba7c4ebb61fa085d63..f87d471b580ea09127f939d391af7a1acdaf6201 100644
--- a/en/application-dev/reference/arkui-ts/ts-basic-components-scrollbar.md
+++ b/en/application-dev/reference/arkui-ts/ts-basic-components-scrollbar.md
@@ -1,15 +1,10 @@
# ScrollBar
-> **NOTE**
-> This component is supported since API version 8. Updates will be marked with a superscript to indicate their earliest API version.
-
-
The **\** is used together with scrollable components, such as **\**, **\**, and **\**.
-
-## Required Permissions
-
-None
+> **NOTE**
+>
+> This component is supported since API version 8. Updates will be marked with a superscript to indicate their earliest API version.
## Child Components
@@ -21,23 +16,26 @@ This component can contain a single child component.
ScrollBar(value: { scroller: Scroller, direction?: ScrollBarDirection, state?: BarState })
-- ScrollBarOptions
- | Name| Type| Mandatory| Default Value| Description|
- | -------- | -------- | -------- | -------- | -------- |
- | scroller | [Scroller](ts-container-scroll.md#scroller) | Yes| - | Scroller, which can be bound to scrollable components.|
- | direction | ScrollBarDirection | No| ScrollBarDirection.Vertical | Scrollbar direction in which scrollable components scroll.|
- | state | [BarState](ts-appendix-enums.md#barstate) | No| BarState.Auto | Scrollbar state.|
-
- > **NOTE**
- > The **<\ScrollBar>** component defines the behavior style of the scrollable area, and its subnodes define the behavior style of the scrollbar.
- >
- > This component is bound to a scrollable component through **scroller**, and can be used to scroll the scrollable component only when their directions are the same. The **\** component can be bound to only one scrollable component, and vice versa.
-
-- ScrollBarDirection enums
- | Name| Description|
- | -------- | -------- |
- | Vertical | Vertical scrollbar.|
- | Horizontal | Horizontal scrollbar.|
+**Parameters**
+
+| Name| Type| Mandatory| Description|
+| -------- | -------- | -------- | -------- |
+| scroller | [Scroller](ts-container-scroll.md#scroller) | Yes| Scroller, which can be bound to scrollable components.|
+| direction | ScrollBarDirection | No| Scrollbar direction in which scrollable components scroll.
Default value: **ScrollBarDirection.Vertical**|
+| state | [BarState](ts-appendix-enums.md#barstate) | No| Scrollbar state.
Default value: **BarState.Auto**|
+
+> **NOTE**
+>
+> The **\** component defines the behavior style of the scrollable area, and its subnodes define the behavior style of the scrollbar.
+>
+> This component is bound to a scrollable component through **scroller**, and can be used to scroll the scrollable component only when their directions are the same. The **\** component can be bound to only one scrollable component, and vice versa.
+
+## ScrollBarDirection
+
+| Name| Description|
+| -------- | -------- |
+| Vertical | Vertical scrollbar.|
+| Horizontal | Horizontal scrollbar.|
## Example
diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-search.md b/en/application-dev/reference/arkui-ts/ts-basic-components-search.md
index b67cfbe4702823a97f90e5dbf97537bce464bddd..7922b137af019939f94297a8b47f615701933549 100644
--- a/en/application-dev/reference/arkui-ts/ts-basic-components-search.md
+++ b/en/application-dev/reference/arkui-ts/ts-basic-components-search.md
@@ -6,10 +6,6 @@ The **\** component provides an input area for users to search.
>
> This component is supported since API version 8. Updates will be marked with a superscript to indicate their earliest API version.
-## Required Permissions
-
-None
-
## Child Components
Not supported
@@ -18,25 +14,27 @@ Not supported
Search(options?: { value?: string; placeholder?: string; icon?: string; controller?: SearchController })
-- Parameters
-
- | Name | Type | Mandatory | Default Value | Description |
- | ----------- | ---------------- | ---- | ---- | ---------------------------------------- |
- | value | string | No | - | Text input in the search text box. |
- | placeholder | string | No | - | Text displayed when there is no input. |
- | icon | string | No | - | Path to the search icon. By default, the system search icon is used. The supported icon formats are .svg, .jpg, and .png.|
- | controller | SearchController | No | - | Controller. |
+**Parameters**
+| Name | Type | Mandatory| Description |
+| ----------- | ---------------- | ---- | ------------------------------------------------------------ |
+| value | string | No | Text input in the search text box. |
+| placeholder | string | No | Text displayed when there is no input. |
+| icon | string | No | Path to the search icon. By default, the system search icon is used. The supported icon formats are .svg, .jpg, and .png.|
+| controller | SearchController | No | Controller. |
## Attributes
-| Name | Type | Default Value | Description |
-| ----------------------- | ---------------------------------------- | ---- | --------------------- |
-| searchButton | string | – | Text on the search button located next to the search text box. By default, there is no search button.|
-| placeholderColor | [ResourceColor](../../ui/ts-types.md) | - | Placeholder text color. |
-| placeholderFont | [Font](../../ui/ts-types.md) | - | Placeholder text style. |
-| textFont | [Font](../../ui/ts-types.md) | - | Text font for the search text box. |
-| copyOption9+ | [CopyOptions](ts-basic-components-text.md) | CopyOptions.CrossDevice | Whether copy and paste is allowed.|
+In addition to the [universal attributes](ts-universal-attributes-size.md), the following attributes are supported.
+
+| Name | Type | Description |
+| ----------------------- | ------------------------------------------------ | ---------------------------------------------- |
+| searchButton | string | Text on the search button located next to the search text box. By default, there is no search button. |
+| placeholderColor | [ResourceColor](ts-types.md#resourcecolor) | Placeholder text color. |
+| placeholderFont | [Font](ts-types.md#font) | Placeholder text style. |
+| textFont | [Font](ts-types.md#font) | Text font for the search text box. |
+| copyOption9+ | [CopyOptions](ts-appendix-enums.md#copyoptions9) | Whether copy and paste is allowed. |
+| textAlign | [TextAlign](ts-appendix-enums.md#textalign) | Text alignment mode.
Default value: **TextAlign.Start**|
## Events
@@ -62,13 +60,11 @@ caretPosition(value: number): void
Sets the position of the caret.
-- Parameters
-
- | Name | Type | Mandatory | Default Value | Description |
- | ----- | ------ | ---- | ---- | ----------------- |
- | value | number | Yes | - | Length from the start of the character string to the position where the caret is located.|
-
+**Parameters**
+| Name| Type| Mandatory| Description |
+| ------ | -------- | ---- | ---------------------------------- |
+| value | number | Yes | Length from the start of the character string to the position where the caret is located.|
## Example
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 b4727d71a822630d2b748a378b066a9cb1ed34e0..0fb1a2b4f69a97ff126bbf97dd7f9390a7f2bc19 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
@@ -2,13 +2,9 @@
The **** component provides a drop-down list box that allows users to select among multiple options.
-> **NOTE**
+> **NOTE**
>
-> This component is supported since API version 8. Updates will be marked with a superscript to indicate their earliest API version.
-
-## Required Permissions
-
-None
+> This component is supported since API version 8. Updates will be marked with a superscript to indicate their earliest API version.
## Child Components
@@ -16,35 +12,35 @@ Not supported
## APIs
-Select(options: Array\\)
+Select(options: Array\)
-- SelectOption parameters
+**SelectOption**
- | Name| Type| Mandatory| Default Value| Description|
- | ------ | ----------------------------------------------- | ---- | ------ | -------------- |
- | value | [ResourceStr](../../ui/ts-types.md) | Yes | - | Value of an option in the drop-down list box. |
- | icon | [ResourceStr](../../ui/ts-types.md) | No | - | Icon of an option in the drop-down list box. |
+| Name| Type | Mandatory| Description |
+| ------ | ----------------------------------- | ---- | -------------- |
+| value | [ResourceStr](ts-types.md#resourcestr) | Yes | Value of an option in the drop-down list box.|
+| icon | [ResourceStr](ts-types.md#resourcestr) | No | Icon of an option in the drop-down list box.|
## Attributes
-| Name| Type| Default Value| Description|
-| ----------------------- | --------------------------------------------------- | ------ | ----------------------------------------------- |
-| selected | number | - | Index of the initial selected option in the drop-down list box. The index of the first option is **0**. |
-| value | string | - | Text of the drop-down button. |
-| font | [Font](../../ui/ts-types.md) | - | Text font of the drop-down button. |
-| fontColor | [ResourceColor](../../ui/ts-types.md) | - | Text color of the drop-down button. |
-| selectedOptionBgColor | [ResourceColor](../../ui/ts-types.md) | - | Background color of the selected option in the drop-down list box. |
-| selectedOptionFont | [Font](../../ui/ts-types.md) | - | Text font of the selected option in the drop-down list box. |
-| selectedOptionFontColor | [ResourceColor](../../ui/ts-types.md) | - | Text color of the selected option in the drop-down list box. |
-| optionBgColor | [ResourceColor](../../ui/ts-types.md) | - | Background color of an option in the drop-down list box. |
-| optionFont | [Font](../../ui/ts-types.md) | - | Text font of an option in the drop-down list box. |
-| optionFontColor | [ResourceColor](../../ui/ts-types.md) | - | Text color of an option in the drop-down list box. |
+| 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**.|
+| value | string | Text of the drop-down button. |
+| font | [Font](ts-types.md#font) | Text font of the drop-down button. |
+| fontColor | [ResourceColor](ts-types.md#resourcecolor) | Text color of the drop-down button. |
+| selectedOptionBgColor | [ResourceColor](ts-types.md#resourcecolor) | Background color of the selected option in the drop-down list box. |
+| selectedOptionFont | [Font](ts-types.md#font) | Text font of the selected option in the drop-down list box. |
+| selectedOptionFontColor | [ResourceColor](ts-types.md#resourcecolor) | Text color of the selected option in the drop-down list box. |
+| optionBgColor | [ResourceColor](ts-types.md#resourcecolor) | Background color of an option in the drop-down list box. |
+| optionFont | [Font](ts-types.md#font) | Text font of an option in the drop-down list box. |
+| optionFontColor | [ResourceColor](ts-types.md#resourcecolor) | Text color of an option in the drop-down list box. |
## Events
-| Name| Description|
-| ------------------------------------------------------------ | ------------------------------------------------------------ |
-| onSelect(callback: (index: number, value?:string) => void) | Invoked when an option in the drop-down list box is selected. **index** indicates the index of the selected option. **value** indicates the value of the selected option. |
+| 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. |
## Example
diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-slider.md b/en/application-dev/reference/arkui-ts/ts-basic-components-slider.md
index 1b8984dc496819fdb53d8409b2e3913e3dee38f3..13b561a928dec4e704b80f229cdfacd5eb7b11f7 100644
--- a/en/application-dev/reference/arkui-ts/ts-basic-components-slider.md
+++ b/en/application-dev/reference/arkui-ts/ts-basic-components-slider.md
@@ -1,17 +1,10 @@
# Slider
+The **\** component is used to quickly adjust settings, such as the volume and brightness.
-> **NOTE**
+> **NOTE**
>
-> This component is supported since API version 7. Updates will be marked with a superscript to indicate their earliest API version.
-
-
-The *\** component is used to quickly adjust settings, such as the volume and brightness.
-
-
-## Required Permissions
-
-None
+> This component is supported since API version 7. Updates will be marked with a superscript to indicate their earliest API version.
## Child Components
@@ -21,57 +14,61 @@ Not supported
## APIs
-Slider(value:{value?: number, min?: number, max?: number, step?: number, style?: SliderStyle, direction?: Axis})
+Slider(options?: {value?: number, min?: number, max?: number, step?: number, style?: SliderStyle, direction?: Axis, reverse?: boolean})
-- Parameters
- | Name | Type | Mandatory | Default Value | Description |
- | ---------------------- | --------------------------------------- | --------- | ------------------ | ---------------------------------------- |
- | value | number | No | 0 | Current progress. |
- | min | number | No | 0 | Minimum value. |
- | max | number | No | 100 | Maximum value. |
- | step | number | No | 1 | Step of the slider. When the corresponding step is set, the slider slides intermittently. |
- | style | SliderStyle | No | SliderStyle.OutSet | Style of the slider. |
- | direction8+ | [Axis](ts-appendix-enums.md#axis-enums) | No | Axis.Horizontal | Whether the slider moves horizontally or vertically. |
- | reverse8+ | boolean | No | false | Whether the slider values are reversed. |
+**Parameters**
-- SliderStyle enums
- | Name | Description |
- | ------ | --------------------------------- |
- | OutSet | The slider is on the slider rail. |
- | InSet | The slider is in the slider rail. |
+| Name| Type| Mandatory| Description|
+| -------- | -------- | -------- | -------- |
+| value | number | No| Current progress.
Default value: **0**|
+| min | number | No| Minimum value.
Default value: **0**|
+| max | number | No| Maximum value.
Default value: **100**|
+| step | number | No| Step of the slider. When the corresponding step is set, the slider slides intermittently.
Default value: **1**|
+| style | SliderStyle | No| Style of the slider.
Default value: **SliderStyle.OutSet**|
+| direction8+ | [Axis](ts-appendix-enums.md#axis) | No| Whether the slider moves horizontally or vertically.
Default value: **Axis.Horizontal**|
+| reverse8+ | boolean | No| Whether the slider values are reversed.
Default value: **false**|
+
+## SliderStyle
+
+| Name| Description|
+| -------- | -------- |
+| OutSet | The slider is on the slider rail.|
+| InSet | The slider is in the slider rail.|
## Attributes
Touch target configuration is not supported.
-| Name | Type | Default Value | Description |
-| ------------- | ------- | ------------- | ---------------------------------------- |
-| blockColor | Color | - | Color of the slider. |
-| trackColor | Color | - | Background color of the slider. |
-| selectedColor | Color | - | Color of the slider rail that has been slid. |
-| showSteps | boolean | false | Whether to display the current step. |
-| showTips | boolean | false | Whether to display a bubble to indicate the percentage when sliding. |
+| Name| Type| Description|
+| -------- | -------- | -------- |
+| blockColor | [ResourceColor](ts-types.md#resourcecolor) | Color of the slider.|
+| trackColor | [ResourceColor](ts-types.md#resourcecolor) | Background color of the slider.|
+| selectedColor | [ResourceColor](ts-types.md#resourcecolor) | Color of the slider rail that has been slid.|
+| showSteps | boolean | Whether to display the current step.
Default value: **false**|
+| showTips | boolean | Whether to display a bubble to indicate the percentage when sliding.
Default value: **false**|
+| trackThickness | [Length](ts-types.md#length) | Track thickness of the slider.|
## Events
-Among all the universal events, only **OnAppear** and **OnDisAppear** are supported.
+In addition to the **OnAppear** and **OnDisAppear** universal events, the following events are supported.
-| Name | Description |
-| ---------------------------------------- | ---------------------------------------- |
-| onChange(callback: (value: number, mode: SliderChangeMode) => void) | Callback invoked when the slider slides.
**value**: current progress.
**mode**: dragging state. |
+| Name| Description|
+| -------- | -------- |
+| onChange(callback: (value: number, mode: SliderChangeMode) => void) | Invoked when the slider slides.
**value**: current progress.
**mode**: dragging state.|
-- SliderChangeMode enums
- | Name | Value | Description |
- | ------ | ----- | ----------------------------------- |
- | Begin | 0 | The user starts to drag the slider. |
- | Moving | 1 | The user is dragging the slider. |
- | End | 2 | The user stops dragging the slider. |
+## SliderChangeMode
+| Name| Value| Description|
+| -------- | -------- | -------- |
+| Begin | 0 | The user starts to drag the slider.|
+| Moving | 1 | The user is dragging the slider.|
+| End | 2 | The user stops dragging the slider.|
+| Click | 3 | The user moves the slider by touching the slider rail.|
-## Example
+## Example
```ts
// xxx.ets
diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-span.md b/en/application-dev/reference/arkui-ts/ts-basic-components-span.md
index 57afaf9543689837cd76a63fcc4d1a03b7eff2ac..0c7c4044634d3751fb653df18bb1be10d98dccaa 100644
--- a/en/application-dev/reference/arkui-ts/ts-basic-components-span.md
+++ b/en/application-dev/reference/arkui-ts/ts-basic-components-span.md
@@ -1,55 +1,53 @@
# Span
+The **\** component is used to display inline text in the **\** component.
-> **NOTE**
-> This component is supported since API version 7. Updates will be marked with a superscript to indicate their earliest API version.
-
-
-The **<Span>** component is used to display a paragraph of textual information. It can be used only as a child component in the **<Text>** component.
-
-
-## Required Permissions
-
-None
+> **NOTE**
+>
+> This component is supported since API version 7. Updates will be marked with a superscript to indicate their earliest API version.
## Child Components
-None
+Not supported
## APIs
-Span(content: string)
+Span(value: string | Resource)
+
+**Parameters**
+
+| Name| Type| Mandatory| Description|
+| -------- | -------- | -------- | -------- |
+| value | string \| [Resource](ts-types.md#resource) | Yes| Plain text.|
-- Parameters
- | Name | Type | Mandatory | Default Value | Description |
- | -------- | -------- | -------- | -------- | -------- |
- | content | string | Yes | - | Text content. |
## Attributes
-In addition to the text style attributes, the attributes below are supported.
+In addition to the [universal text style](ts-universal-attributes-text-style.md) attributes, the following attributes are supported.
-| Name | Type | Default Value | Description |
-| -------- | -------- | -------- | -------- |
-| decoration | {
type: [TextDecorationType](ts-appendix-enums.md#textdecorationtype-enums),
color?: Color
} | {
type: TextDecorationType.None
} | Style and color of the text decorative line. |
-| textCase | [TextCase](ts-appendix-enums.md#textcase-enums) | Normal | Text case. |
+| Name| Type| Description|
+| -------- | -------- | -------- |
+| decoration | {
type: [TextDecorationType](ts-appendix-enums.md#textdecorationtype),
color?: [ResourceColor](ts-types.md#resourcecolor)
} | Style and color of the text decorative line.
Default value: {
type: TextDecorationType.None
color: Color.Black
} |
+| letterSpacing | number \| string | Letter spacing. |
+| textCase | [TextCase](ts-appendix-enums.md#textcase) | Text case.
Default value: **TextCase.Normal**|
## Events
-Among all the universal events, only the click event is supported.
+Among all the [universal events](ts-universal-attributes-click.md), only the click event is supported.
-> **NOTE**
-> As the **<Span>** component does not have size information, the **target** attribute of the **ClickEvent** object returned by the click event is invalid.
+> **NOTE**
+>
+> As the **\** component does not include size information, the **target** attribute of the **ClickEvent** object returned by the click event is invalid.
## Example
-
-```
+```ts
+// xxx.ets
@Entry
@Component
struct SpanExample {
diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-stepper.md b/en/application-dev/reference/arkui-ts/ts-basic-components-stepper.md
index 15248aea8986f361ff29691a77351ca1c3bbba0c..0453fcaf79e40f0931217466cba8736c7542ffad 100644
--- a/en/application-dev/reference/arkui-ts/ts-basic-components-stepper.md
+++ b/en/application-dev/reference/arkui-ts/ts-basic-components-stepper.md
@@ -2,16 +2,10 @@
The **\** component provides a step navigator.
-> **NOTE**
->
-> This component is supported since API version 8. Updates will be marked with a superscript to indicate their earliest API version.
-
-
-
-
-## Required Permissions
-None
+> **NOTE**
+>
+> This component is supported since API version 8. Updates will be marked with a superscript to indicate their earliest API version.
## Child Components
@@ -23,11 +17,10 @@ Only the child component **\<[StepperItem](ts-basic-components-stepperitem.md)>*
Stepper(value?: { index?: number })
-
-- Parameters
- | Name | Type | Mandatory | Default Value | Description |
- | -------- | -------- | -------- | -------- | -------- |
- | index | number | No | 0 | Index of the **\** that is currently displayed. |
+**Parameters**
+| Name| Type| Mandatory| Description|
+| -------- | -------- | -------- | -------- |
+| index | number | No| Index of the **\** that is currently displayed.
Default value: **0** |
## Attributes
@@ -37,16 +30,17 @@ None
## Events
-| Name | Description |
+| Name| Description|
| -------- | -------- |
| onFinish(callback: () => void) | Invoked when the **nextLabel** of the last **\** in the **\** is clicked. |
| onSkip(callback: () => void) | Invoked when the current **\** is **ItemState.Skip** and the **nextLabel** is clicked. |
-| onChange(callback: (prevIndex?: number, index?: number) => void) | Invoked when the text button on the left or right is clicked to switch between steps.
- **prevIndex**: index of the step page before the switching.
- **index**: index of the step page after the switching, that is, index of the previous or next page. |
+| onChange(callback: (prevIndex?: number, index?: number) => void) | Invoked when the text button on the left or right is clicked to switch between steps.
- **prevIndex**: index of the step page before the switching.
- **index**: index of the step page after the switching, that is, index of the previous or next page. |
+| onNext(callback: (index?: number, pendingIndex?: number) => void) | Invoked when a user switches to the next step.
- **index**: index of the current step page.
- **pendingIndex**: index of the next page. |
+| onPrevious(callback: (index?: number, pendingIndex?: number) => void) | Invoked when a user switches to the previous step.
- **index**: index of the current step page.
- **pendingIndex**: index of the previous page. |
## Example
-
```ts
// xxx.ets
@Entry
@@ -128,4 +122,3 @@ struct StepperExample {
-
diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-stepperitem.md b/en/application-dev/reference/arkui-ts/ts-basic-components-stepperitem.md
index 732702bbcab5d5fda2e6bd3f7c2c92ad2a1dddf7..a581859a3d14a5abd57e52a396bac7bd71e7347b 100644
--- a/en/application-dev/reference/arkui-ts/ts-basic-components-stepperitem.md
+++ b/en/application-dev/reference/arkui-ts/ts-basic-components-stepperitem.md
@@ -1,16 +1,11 @@
# StepperItem
+The **\** component provides an element for the **\** component.
-> **NOTE**
-> This component is supported since API version 8. Updates will be marked with a superscript to indicate their earliest API version.
-
-The **<StepperItem>** component provides an element for the **<Stepper>** component.
-
-
-## Required Permissions
-
-None
+> **NOTE**
+>
+> This component is supported since API version 8. Updates will be marked with a superscript to indicate their earliest API version.
## Child Components
@@ -25,22 +20,22 @@ StepperItem()
## Attributes
-| Name | Type | Default Value | Description |
-| -------- | -------- | -------- | -------- |
-| prevLabel | string | - | When the **<Stepper>** contains more than one page, the default value for all pages except the first page is **Back**. |
-| nextLabel | string | - | When the stepper contains more than one page, the default value for the last page is **Start**, and the default value for other pages is **Next**. |
-| status | ItemState | ItemState.Normal | Status of the **<StepperItem>**. |
+| Name| Type| Description|
+| -------- | -------- | -------- |
+| prevLabel | string | When the **\** contains more than one page, the default value for all pages except the first page is **Back**.|
+| nextLabel | string | When the stepper contains more than one page, the default value for the last page is **Start**, and the default value for other pages is **Next**.|
+| status | ItemState | Status of the **\**.
Default value: **ItemState.Normal**|
+
+## ItemState
-- ItemState enums
- | Name | Description |
- | -------- | -------- |
- | Normal | The right button is clickable and can navigate users to the next **<StepperItem>** when it is clicked. |
- | Disabled | The right button is grayed out and unavailable. |
- | Waiting | The right button is not displayed, and a progress bar is displayed instead. |
- | Skip | The current **<StepperItem>** is skipped, and the next **<StepperItem>** is displayed. |
+| Name| Description|
+| -------- | -------- |
+| Normal | The right button is clickable and can navigate users to the next **\** when it is clicked.|
+| Disabled | The right button is grayed out and unavailable.|
+| Waiting | The right button is not displayed, and a progress bar is displayed instead.|
+| Skip | The current **\** is skipped, and the next **\** is displayed.|
## Example
See [Stepper](ts-basic-components-stepper.md).
-
diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-text.md b/en/application-dev/reference/arkui-ts/ts-basic-components-text.md
index 9a55b0b5d92711f6333c7f20df2454618b6e745e..16a2de9bd3026c60ef1ff972133487dc9dd76b3e 100644
--- a/en/application-dev/reference/arkui-ts/ts-basic-components-text.md
+++ b/en/application-dev/reference/arkui-ts/ts-basic-components-text.md
@@ -7,11 +7,6 @@ The **\** component is used to display a piece of textual information.
> This component is supported since API version 7. Updates will be marked with a superscript to indicate their earliest API version.
-## Required Permissions
-
-None
-
-
## Child Components
This component can contain the [\](ts-basic-components-span.md) child component.
@@ -19,31 +14,31 @@ This component can contain the [\](ts-basic-components-span.md) child comp
## APIs
-Text(content?: ResourceStr)
+Text(content?: string | Resource)
-- Parameters
- | Name| Type| Mandatory| Default Value| Description|
- | -------- | -------- | -------- | -------- | -------- |
- | content | [ResourceStr](../../ui/ts-types.md#resourcestr8) | No| '' | Text content. The content and style set for the **\** component do not take effect when it contains the **\** child component.|
+**Parameters**
+| Name| Type| Mandatory| Description|
+| -------- | -------- | -------- | -------- |
+| content | string \| [Resource](ts-types.md#resource) | No| Text content. The content and style set for the **\** component do not take effect when it contains the **\** child component.
Default value: **' '**|
## Attributes
-In addition to the following attributes, the attributes in [Text Style](ts-universal-attributes-text-style.md) are supported.
-
-| Name| Type| Default Value| Description|
-| -------- | -------- | -------- | -------- |
-| textAlign | [TextAlign](ts-appendix-enums.md#textalign) | TextAlign.Start | Text alignment mode of multiple lines of text.|
-| textOverflow | {overflow: [TextOverflow](ts-appendix-enums.md#textoverflow)} | {overflow: TextOverflow.Clip} | Display mode when the text is too long.
**NOTE**
Text is truncated at the transition between words. To truncate text in the middle of a word, add **\u200B** between characters.
This attribute must be used with `maxLines` to take effect. |
-| maxLines | number | Infinity | Maximum number of lines in the text.
**NOTE**
By default, text is automatically folded. If this parameter is specified, the text does not exceed the specified number of lines. If there is extra text, you can use `textOverflow` to specify the truncation mode. |
-| lineHeight | string \| number \| [Resource](../../ui/ts-types.md) | - | Text line height. If the value is less than or equal to **0**, the line height is not limited and the font size is adaptive. If the value of the number type, the unit fp is used.|
-| decoration | {
type: TextDecorationType,
color?: [ResourceColor](../../ui/ts-types.md)
} | {
type: TextDecorationType.None,
color: Color.Black
} | Style and color of the text decorative line. |
-| baselineOffset | number \| string | - | Offset of the text baseline. |
-| letterSpacing | [Length](../../ui/ts-types.md) | - | Letter spacing. |
-| minFontSize | number \| string \| [Resource](../../ui/ts-types.md) | - | Minimum font size. |
-| maxFontSize | number \| string \| [Resource](../../ui/ts-types.md) | - | Maximum font size. |
-| textCase | [TextCase](ts-appendix-enums.md#textcase) | TextCase.Normal | Text case.|
-| copyOption9+ | [CopyOptions](ts-appendix-enums.md#copyoptions9) | CopyOptions.None | Whether copy and paste is allowed.|
+In addition to the [universal attributes](ts-universal-attributes-size.md), the following attributes are supported.
+
+| Name| Type| Description|
+| -------- | -------- | -------- |
+| textAlign | [TextAlign](ts-appendix-enums.md#textalign) | Text alignment mode of multiple lines of text.
Default value: **TextAlign.Start**|
+| textOverflow | {overflow: [TextOverflow](ts-appendix-enums.md#textoverflow)} | Display mode when the text is too long.
Default value: **{overflow: TextOverflow.Clip}**
**NOTE**
Text is truncated at the transition between words. To truncate text in the middle of a word, add **\u200B** between characters.
This attribute must be used with `maxLines` to take effect. |
+| maxLines | number | Maximum number of lines in the text.
Default value: **Infinity**
**NOTE**
By default, text is automatically folded. If this attribute is specified, the text will not exceed the specified number of lines. If there is extra text, you can use `textOverflow` to specify the truncation mode. |
+| lineHeight | string \| number \| [Resource](ts-types.md#resource) | Text line height. If the value is less than or equal to **0**, the line height is not limited and the font size is adaptive. If the value of the number type, the unit fp is used.|
+| decoration | {
type: TextDecorationType,
color?: [ResourceColor](ts-types.md#resourcecolor)
} | Style and color of the text decorative line.
Default value: {
type: TextDecorationType.None,
color: Color.Black
} |
+| baselineOffset | number \| string | Offset of the text baseline. |
+| letterSpacing | number \| string | Letter spacing. |
+| minFontSize | number \| string \| [Resource](ts-types.md#resource) | Minimum font size. |
+| maxFontSize | number \| string \| [Resource](ts-types.md#resource) | Maximum font size. |
+| textCase | [TextCase](ts-appendix-enums.md#textcase) | Text case.
Default value: **TextCase.Normal**|
+| copyOption9+ | [CopyOptions](ts-appendix-enums.md#copyoptions9) | Whether copy and paste is allowed.
Default value: **CopyOptions.None**|
> **NOTE**
>
diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-textarea.md b/en/application-dev/reference/arkui-ts/ts-basic-components-textarea.md
index 37666275de96d6b3e55124c96ae75785ed76009f..79bdc694ea7549916ca20f25b1bc6ad13c2fef9b 100644
--- a/en/application-dev/reference/arkui-ts/ts-basic-components-textarea.md
+++ b/en/application-dev/reference/arkui-ts/ts-basic-components-textarea.md
@@ -4,12 +4,7 @@ The **\