diff --git a/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001251292933.gif b/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001251292933.gif new file mode 100644 index 0000000000000000000000000000000000000000..587325d41b6320ff8e25afd9d2b19e3d1b5a11d5 Binary files /dev/null and b/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001251292933.gif differ diff --git a/en/application-dev/reference/arkui-ts/figures/en_image_0000001174582862.gif b/en/application-dev/reference/arkui-ts/figures/en_image_0000001174582862.gif new file mode 100644 index 0000000000000000000000000000000000000000..f30a8d85e898213691abd5369c9c1008d399274b Binary files /dev/null and b/en/application-dev/reference/arkui-ts/figures/en_image_0000001174582862.gif differ diff --git a/en/application-dev/reference/arkui-ts/figures/en_image_0000001186807708.gif b/en/application-dev/reference/arkui-ts/figures/en_image_0000001186807708.gif new file mode 100644 index 0000000000000000000000000000000000000000..8eceb3bf5313485a1fedda5768e70cdb5febc464 Binary files /dev/null and b/en/application-dev/reference/arkui-ts/figures/en_image_0000001186807708.gif differ 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 88927b3b6cbca8ebbb8eb13bc86c38d0380499b1..8716d4769e9c42dcc04bf777569fcc74c135b401 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 @@ -23,50 +23,50 @@ None Slider(value:{value?: number, min?: number, max?: number, step?: number, style?: SliderStyle, direction?: Axis}) - 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](../reference/arkui-ts/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. | + | 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. | - SliderStyle enums - | Name | Description | - | -------- | -------- | - | OutSet | The slider is on the slider rail. | - | InSet | The slider is in the slider rail. | + | 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 | 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. | ## Events Among all the universal events, only **OnAppear** and **OnDisAppear** are supported. -| Name | Description | -| -------- | -------- | +| Name | Description | +| ---------------------------------------- | ---------------------------------------- | | onChange(callback: (value: number, mode: SliderChangeMode) => void) | Callback invoked when the slider slides.
**value**: current progress.
**mode**: dragging state. | - SliderChangeMode enums - | Name | Description | - | -------- | -------- | - | Begin | The user starts to drag the slider. | - | Moving | The user is dragging the slider. | - | End | The user stops dragging the slider. | + | Name | Description | + | ------ | ----------------------------------- | + | Begin | The user starts to drag the slider. | + | Moving | The user is dragging the slider. | + | End | The user stops dragging the slider. | ## Example 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 3273679f400106ae628bf5a68f675f59953157cb..f686f9a01011f7afb704d3f10d5fadc7bd521ee3 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 @@ -23,37 +23,37 @@ None TextArea(value?:{placeholder?: string controller?: TextAreaController}) - Parameters - | Name | Type | Mandatory | Default Value | Description | - | -------- | -------- | -------- | -------- | -------- | - | placeholder | string | No | - | Text displayed when there is no input. | - | controller8+ | [TextAreaController](#textareacontroller8) | No | - | Text area controller. | + | Name | Type | Mandatory | Default Value | Description | + | ----------------------- | ---------------------------------------- | --------- | ------------- | -------------------------------------- | + | placeholder | string | No | - | Text displayed when there is no input. | + | controller8+ | [TextAreaController](#textareacontroller8) | No | - | Text area controller. | ## Attributes In addition to universal attributes, the following attributes are supported. -| Name | Type | Default Value | Description | -| -------- | -------- | -------- | -------- | -| placeholderColor | Color | - | Placeholder text color. | -| placeholderFont | {
size?: number,
weight?:number \| [FontWeight](ts-universal-attributes-text-style.md),
family?: string,
style?: [FontStyle](ts-universal-attributes-text-style.md)
} | - | Placeholder text style.
- **size**: font size. If the value is of the number type, the unit fp is used.
- **weight**: font weight. For the number type, the value ranges from 100 to 900, at an interval of 100. The default value is **400**. A larger value indicates a larger font weight.
- **family**: font family. Use commas (,) to separate multiple fonts, for example, **'Arial, sans-serif'**. The priority of the fonts is the sequence in which they are placed.
- **style**: font style. | -| textAlign | TextAlign | Start | Sets the text horizontal alignment mode. | -| caretColor | Color | - | Sets the color of the cursor in the text box. | -| inputFilter8+ | {
value: [ResourceStr](../../ui/ts-types.md),
error?: (value: string)
} | - | Regular expression for input filtering. Only inputs that comply with the regular expression can be displayed. Other inputs are ignored. The specified regular expression can match single characters, but not strings. Example: ^(? =.\*\d)(? =.\*[a-z])(? =.\*[A-Z]).{8,10}$. Strong passwords containing 8 to 10 characters cannot be filtered.
- **value**: indicates the regular expression to set.
- **error**: returns the ignored content when regular expression matching fails. | +| Name | Type | Default Value | Description | +| ------------------------ | ---------------------------------------- | ------------- | ---------------------------------------- | +| placeholderColor | Color | - | Placeholder text color. | +| placeholderFont | {
size?: number,
weight?:number \| [FontWeight](ts-universal-attributes-text-style.md),
family?: string,
style?: [FontStyle](ts-universal-attributes-text-style.md)
} | - | Placeholder text style.
- **size**: font size. If the value is of the number type, the unit fp is used.
- **weight**: font weight. For the number type, the value ranges from 100 to 900, at an interval of 100. The default value is **400**. A larger value indicates a larger font weight.
- **family**: font family. Use commas (,) to separate multiple fonts, for example, **'Arial, sans-serif'**. The priority of the fonts is the sequence in which they are placed.
- **style**: font style. | +| textAlign | TextAlign | Start | Sets the text horizontal alignment mode. | +| caretColor | Color | - | Sets the color of the cursor in the text box. | +| inputFilter8+ | {
value: [ResourceStr](../../ui/ts-types.md),
error?: (value: string)
} | - | Regular expression for input filtering. Only inputs that comply with the regular expression can be displayed. Other inputs are ignored. The specified regular expression can match single characters, but not strings. Example: ^(? =.\*\d)(? =.\*[a-z])(? =.\*[A-Z]).{8,10}$. Strong passwords containing 8 to 10 characters cannot be filtered.
- **value**: indicates the regular expression to set.
- **error**: returns the ignored content when regular expression matching fails. | - TextAlign enums - | Name | Description | - | -------- | -------- | - | Start | Aligns the header horizontally. | - | Center | Horizontal center alignment. | - | End | Align the tail horizontally. | + | Name | Description | + | ------ | ------------------------------- | + | Start | Aligns the header horizontally. | + | Center | Horizontal center alignment. | + | End | Align the tail horizontally. | ## Events -| Name | Description | -| -------- | -------- | -| onChange(callback: (value: string) => void) | Triggered when the input changes. | +| Name | Description | +| ---------------------------------------- | ---------------------------------------- | +| onChange(callback: (value: string) => void) | Triggered when the input changes. | | onCopy8+(callback:(value: string) => void) | Triggered when the copy button on the pasteboard, which displays when the text box is long pressed, is clicked.
**value**: text to be copied. | | onCut8+(callback:(value: string) => void) | Triggered when the cut button on the pasteboard, which displays when the text box is long pressed, is clicked.
**value**: text to be cut. | | onPaste8+(callback:(value: string) => void) | Triggered when the paste button on the pasteboard, which displays when the text box is long pressed, is clicked.
**value**: text to be pasted. | @@ -76,9 +76,9 @@ 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 string to the position where the input cursor is located. | + | Name | Type | Mandatory | Default Value | Description | + | ----- | ------ | --------- | ------------- | ---------------------------------------- | + | value | number | Yes | - | Length from the start of the string to the position where the input cursor is located. | ## Example diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-timepicker.md b/en/application-dev/reference/arkui-ts/ts-basic-components-timepicker.md index 24b1ac6d59eb51962ee98a000ea19fb0b22658c7..43f8b6eeb6ac8a18d219829390627c4fe20e4780 100644 --- a/en/application-dev/reference/arkui-ts/ts-basic-components-timepicker.md +++ b/en/application-dev/reference/arkui-ts/ts-basic-components-timepicker.md @@ -24,29 +24,29 @@ TimePicker(options?: TimePickerOptions) Creates a time picker whose default time range is from 00:00 to 23:59. - options parameters - | Name| Type| Mandatory| Default Value| Description| - | -------- | -------- | -------- | -------- | -------- | - | selected | Date | No| Current system time| Time of the selected item.| + | Name | Type | Mandatory | Default Value | Description | + | -------- | ---- | --------- | ------------------- | -------------------------- | + | selected | Date | No | Current system time | Time of the selected item. | ## Attributes -| Name| Type| Default Value| Description| -| -------- | -------- | -------- | -------- | -| useMilitaryTime | boolean | false | Whether to display time in 24-hour format. The value cannot be modified dynamically.| +| Name | Type | Default Value | Description | +| --------------- | ------- | ------------- | ---------------------------------------- | +| useMilitaryTime | boolean | false | Whether to display time in 24-hour format. The value cannot be modified dynamically. | ## Events -| Name| Description| -| -------- | -------- | -| onChange(callback: (value: TimePickerResult ) => void) | Triggered when a time is selected.| +| Name | Description | +| ---------------------------------------- | ---------------------------------- | +| onChange(callback: (value: TimePickerResult ) => void) | Triggered when a time is selected. | ### TimePickerResult -| Name| Type| Description| -| -------- | -------- | -------- | -| hour | number | Hour portion of the selected time.| -| minute | number | Minute portion of the selected time.| +| Name | Type | Description | +| ------ | ------ | ------------------------------------ | +| hour | number | Hour portion of the selected time. | +| minute | number | Minute portion of the selected time. | ## Example diff --git a/en/application-dev/reference/arkui-ts/ts-components-canvas-canvas.md b/en/application-dev/reference/arkui-ts/ts-components-canvas-canvas.md index 0a22feb1c2fd4d490a54501ed701830759e93cef..60e9edaf38398f66715489b6e232058ce679bc76 100644 --- a/en/application-dev/reference/arkui-ts/ts-components-canvas-canvas.md +++ b/en/application-dev/reference/arkui-ts/ts-components-canvas-canvas.md @@ -23,9 +23,9 @@ None Canvas(context: CanvasRenderingContext2D) - Parameters - | Name | Type | Mandatory | Default Value | Description | - | -------- | -------- | -------- | -------- | -------- | - | context | [CanvasRenderingContext2D](ts-canvasrenderingcontext2d.md) | Yes | - | For details, see CanvasRenderingContext2D. | + | Name | Type | Mandatory | Default Value | Description | + | ------- | ---------------------------------------- | --------- | ------------- | ---------------------------------------- | + | context | [CanvasRenderingContext2D](ts-canvasrenderingcontext2d.md) | Yes | - | For details, see CanvasRenderingContext2D. | ## Attributes @@ -37,9 +37,9 @@ Universal attributes are supported. In addition to universal events, the following events are supported. -| Name | Parameter | Description | -| -------- | -------- | -------- | -| onReady(callback: () => void) | None | Triggered when . | +| Name | Parameter | Description | +| -------------------------------- | --------- | ---------------- | +| onReady(callback: () => void) | None | Triggered when . | ## Example diff --git a/en/application-dev/reference/arkui-ts/ts-universal-attributes-menu.md b/en/application-dev/reference/arkui-ts/ts-universal-attributes-menu.md index aac3bbfa1f1253a491d134b607c13094ca664582..d37d1d1f1421a570c749484e59fd3f9ef9883952 100644 --- a/en/application-dev/reference/arkui-ts/ts-universal-attributes-menu.md +++ b/en/application-dev/reference/arkui-ts/ts-universal-attributes-menu.md @@ -12,23 +12,23 @@ None ## Attributes -| Name| Type| Default Value | Description| -| -------- | -------- | -------- | -------- | -| bindMenu | Array8+ | - | Menu bound to the component, which is displayed when you click the component. Textual and custom menu items are supported.| -| bindContextMenu8+ | content: [CustomBuilder](../../ui/ts-types.md)
responseType: ResponseType | - | Context menu bound to the component, which is displayed when you long-press or right-click the component. Only custom menu items are supported.| +| Name | Type | Default Value | Description | +| ---------------------------- | ---------------------------------------- | ------------- | ---------------------------------------- | +| bindMenu | Array8+ | - | Menu bound to the component, which is displayed when you click the component. Textual and custom menu items are supported. | +| bindContextMenu8+ | content: [CustomBuilder](../../ui/ts-types.md)
responseType: ResponseType | - | Context menu bound to the component, which is displayed when you long-press or right-click the component. Only custom menu items are supported. | - MenuItem - | Name| Type| Description| - | -------- | -------- | -------- | - | value | string | Menu item text.| - | action | () => void | Action triggered when a menu item is clicked.| + | Name | Type | Description | + | ------ | ------------- | ---------------------------------------- | + | value | string | Menu item text. | + | action | () => void | Action triggered when a menu item is clicked. | - ResponseType8+ - | Value| Description| - | -------- | -------- | - | LongPress | The menu is displayed when the component is long-pressed. | - | RightClick | The menu is displayed when the component is right-clicked.| + | Value | Description | + | ---------- | ---------------------------------------- | + | LongPress | The menu is displayed when the component is long-pressed. | + | RightClick | The menu is displayed when the component is right-clicked. | ## Example diff --git a/en/application-dev/ui/ui-js-animate-dynamic-effects.md b/en/application-dev/ui/ui-js-animate-dynamic-effects.md index bbd5aae520e9c5e767b132b929f11cb006670f5b..59ab2d23f1fd69b2115217a9191b1154c1092218 100644 --- a/en/application-dev/ui/ui-js-animate-dynamic-effects.md +++ b/en/application-dev/ui/ui-js-animate-dynamic-effects.md @@ -1,7 +1,7 @@ # Animation Effect -You can set the interpolator to implement the animation effect. For details, see [Animation](../reference/apis/js-apis-basic-features-animator.md). +You can set the interpolator to implement the animation effect. > ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**: @@ -82,15 +82,15 @@ export default { > ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**: > - When you use createAnimator to create an animation object, you must pass the options parameter. -> +> > - begin indicates the start point of the animation interpolation. If it is not set, the default value 0 is used. -> +> > - end indicates the end point of the animation interpolation. If it is not set, the default value 1 is used. ## Adding Animation Events and Calling Methods -The animator supports events and methods, which you can use to customize the animation effect. Events include frame, cancel, repeat, and finish. Methods include update, play, pause, cancel, reverse, and finish. For details about the supported events and methods, see [animator supported events and animator supported APIs](../reference/apis/js-apis-basic-features-animator.md). +The animator supports events and methods, which you can use to customize the animation effect. Events include frame, cancel, repeat, and finish. Methods include update, play, pause, cancel, reverse, and finish. For details about the supported events and methods, see [animator supported events and animator supported APIs](../reference/apis/js-apis-animator.md). ``` diff --git a/zh-cn/application-dev/ui/ui-js-animate-dynamic-effects.md b/zh-cn/application-dev/ui/ui-js-animate-dynamic-effects.md index b5b8a275fc48d3b404b54a1acffdb4edd4751bf2..1d56e5a4f7c5e59d14771f7570b1bb91f354efbf 100644 --- a/zh-cn/application-dev/ui/ui-js-animate-dynamic-effects.md +++ b/zh-cn/application-dev/ui/ui-js-animate-dynamic-effects.md @@ -80,15 +80,15 @@ export default { > ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：** > - 使用createAnimator创建动画对象时必须传入options参数。 -> +> > - begin插值起点，不设置时默认为0。 -> +> > - end插值终点，不设置时默认为1。 ## 添加动画事件和调用接口 -animator支持事件和接口，可以通过添加frame、cancel、repeat、finish事件和调用update、play、pause、cancel、reverse、finish接口自定义动画效果。animator支持的事件和接口具体见动画中的createAnimator。 +animator支持事件和接口，可以通过添加frame、cancel、repeat、finish事件和调用update、play、pause、cancel、reverse、finish接口自定义动画效果。animator支持的事件和接口具体见动画中的[createAnimator](../reference/apis/js-apis-animator.md)。 ```