diff --git a/en/application-dev/quick-start/start-with-ets-low-code.md b/en/application-dev/quick-start/start-with-ets-low-code.md index de3c11c9bcef2c6ef3ecd4e77db051de55844359..1dd03af96c2064b5b6b0baa89e7295decb4cf1fd 100644 --- a/en/application-dev/quick-start/start-with-ets-low-code.md +++ b/en/application-dev/quick-start/start-with-ets-low-code.md @@ -15,7 +15,7 @@ You can develop applications or services in the low-code approach using either o - Create a project that supports low-code development. This method is used as an example in this topic. -- In an existing project, create a .visual file for development. +- In an existing project, create a .visual file for development. For details, see [Creating a .visual File That Supports Low-Code Development](#building-the-second-page). ## Creating a Project That Supports Low-Code Development @@ -52,7 +52,7 @@ Add **Column**, **Text**, and **Button** components to the first page. A column Open the **index.visual** file, right-click the existing template components on the canvas, and choose **Delete** from the shortcut menu to delete them. Below is an illustration of the operations. -![en-us_image_0000001233208980](figures/en-us_image_0000001233208980.gif) + ![en-us_image_0000001233208980](figures/en-us_image_0000001233208980.gif) 2. Add a **Column** component and set its styles and attributes. @@ -70,7 +70,7 @@ Add **Column**, **Text**, and **Button** components to the first page. A column Drag the **Button** component from the **UI Control** area to the canvas and then to a position under the **Text** component. In the **Attributes & Styles** area on the right, click ![en-us_image_0000001277728577](figures/en-us_image_0000001277728577.png)**General** and set **Height** of the **Button** component to **40vp**. Click ![en-us_image_0000001277809337](figures/en-us_image_0000001277809337.png)**Feature** and set **Label** to **Next** and **FontSize** to **25fp**. Below is an illustration of the operations. -![en-us_image_0000001235732402](figures/en-us_image_0000001235732402.gif) + ![en-us_image_0000001235732402](figures/en-us_image_0000001235732402.gif) 5. On the toolbar in the upper right corner of the editing window, click **Previewer** to open the Previewer. @@ -85,7 +85,7 @@ Add **Column**, **Text**, and **Button** components to the first page. A column In the **Project** window, choose **entry** > **src** > **main** > **ets** > **MainAbility**, right-click the **pages** folder, choose **New** > **Visual**, name the page **second**, and click **Finish**. Below, you can see the structure of the **pages** folder. -![en-us_image_0000001233368868](figures/en-us_image_0000001233368868.png) + ![en-us_image_0000001233368868](figures/en-us_image_0000001233368868.png) 2. [Delete the existing template components from the canvas.](#delete_origin_content) diff --git a/en/application-dev/quick-start/start-with-js-low-code.md b/en/application-dev/quick-start/start-with-js-low-code.md index 865f2b69847412f626c47d8228d1a3dc344a3b7a..9d551aea76026a1d089d6853bce1aabdc1533192 100644 --- a/en/application-dev/quick-start/start-with-js-low-code.md +++ b/en/application-dev/quick-start/start-with-js-low-code.md @@ -13,7 +13,7 @@ You can develop applications or services in the low-code approach using either o - Create a project that supports low-code development. This method is used as an example in this topic. -- In an existing project, create a Visual file for development. +- In an existing project, create a Visual file for development. For details, see [Creating a .visual File That Supports Low-Code Development](#building-the-second-page). ## Creating a Project That Supports Low-Code Development @@ -53,15 +53,15 @@ Add **Div**, **Text**, and **Button** components to the first page. 1. Delete the existing template components from the canvas. -Open the index.visual file, right-click the existing template components on the canvas, and choose **Delete** from the shortcut menu to delete them. Below is an illustration of the operations. + Open the index.visual file, right-click the existing template components on the canvas, and choose **Delete** from the shortcut menu to delete them. Below is an illustration of the operations. -![en-us_image_0000001216600980](figures/en-us_image_0000001216600980.gif) + ![en-us_image_0000001216600980](figures/en-us_image_0000001216600980.gif) 2. Add a **Div** component and set its styles and attributes. Drag the **Div** component from the **UI Control** area to the canvas. In the **Attributes & Styles** area on the right, click ![en-us_image_0000001260226691](figures/en-us_image_0000001260226691.png)**General** and set **Height** to **100%** so that the component fills the entire screen. Click ![en-us_image_0000001215226858](figures/en-us_image_0000001215226858.png)**Flex**, set **FlexDirection** to **column** so that the main axis of the component is vertical, and set both **JustifyContent** and **AlignItems** to **center** so that the child components of the **Div** component are centered along the main axis and cross axis. Below is an illustration of the operations. -![en-us_image_0000001216448880](figures/en-us_image_0000001216448880.gif) + ![en-us_image_0000001216448880](figures/en-us_image_0000001216448880.gif) 3. Add a **Text** component. @@ -88,7 +88,7 @@ Open the index.visual file, right-click the existing template components on the In the **Project** window, choose **entry** > **src** > **main** > **js** > **MainAbility**, right-click the **pages** folder, choose **New** > **Visual**, name the page **second**, and click **Finish**. Below, you can see the structure of the **pages** folder. -![en-us_image_0000001223882030](figures/en-us_image_0000001223882030.png) + ![en-us_image_0000001223882030](figures/en-us_image_0000001223882030.png) 2. [Delete the existing template components from the canvas.](#delete_origin_content) diff --git a/en/application-dev/reference/apis/js-apis-system-time.md b/en/application-dev/reference/apis/js-apis-system-time.md index 74beca3c0aacbabd628f99f7987b96caf5988f61..b61e69a07cf8ddf5d1d72a7e49c888ca71e2002d 100644 --- a/en/application-dev/reference/apis/js-apis-system-time.md +++ b/en/application-dev/reference/apis/js-apis-system-time.md @@ -1,7 +1,7 @@ # Setting the System Time -> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**
The initial APIs of this module are supported since API version 7. Newly added APIs will be marked with a superscript to indicate their earliest API version. -> +This module is used to set and obtain the current system date, time, and time zone. +> **NOTE**
The initial APIs of this module are supported since API version 7. Newly added APIs will be marked with a superscript to indicate their earliest API version. ## Modules to Import @@ -189,7 +189,7 @@ Obtains the time elapsed since system start, excluding the deep sleep time. This **Example** ```js - systemTime.getCurrentTime().then((data) => { + systemTime.getRealActiveTime().then((data) => { console.log(`systemTime.getRealActiveTime success data : ` + JSON.stringify(data)); }).catch((error) => { console.error(`failed to systemTime.getRealActiveTime because ` + JSON.stringify(error)); diff --git a/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001193499234.gif b/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001193499234.gif index 52fed39eeae057043dbd00abce9ff29d2c35a56a..15849e6bc210ed2bb7f7a798b145c9794972643c 100644 Binary files a/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001193499234.gif and b/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001193499234.gif differ diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-imageanimator.md b/en/application-dev/reference/arkui-ts/ts-basic-components-imageanimator.md index f4a4b6e72edeeac8f332e8f4027ad5dc7db4eeba..3fc9900817526722508ab43284002e6b41a4e9b7 100644 --- a/en/application-dev/reference/arkui-ts/ts-basic-components-imageanimator.md +++ b/en/application-dev/reference/arkui-ts/ts-basic-components-imageanimator.md @@ -1,11 +1,11 @@ # ImageAnimator -> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE** +> **NOTE**
> This component is supported since API version 7. Updates will be marked with a superscript to indicate their earliest API version. -The **<ImageAnimator>** component enables images to be played frame by frame. The list of images to be played can be configured, and the duration of each image can be configured. +The **\** component enables images to be played frame by frame. The list of images to be played can be configured, and the duration of each image can be configured. ## Required Permissions @@ -15,7 +15,7 @@ None ## Child Components -None +Not supported ## APIs @@ -37,29 +37,29 @@ ImageAnimator() | iterations | number | 1 | No | By default, the animation is played once. The value **-1** indicates that the animation is played for an unlimited number of times. | - AnimationStatus enums - | Name | Description | + | 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. | + | 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 enums - | Name | Description | + | Name | Description | | -------- | -------- | - | None | After the playback is complete, the animation restores to the initial state. | - | Forwards | After the playback is complete, the animation remains in the end state. | + | None | After the playback is complete, the animation restores to the initial state. | + | Forwards | After the playback is complete, the animation remains in the end state. | ## Events - | Name | Description | +| Name | Description | | -------- | -------- | -------- | -| onStart() => void | Triggered when the animation starts to play. | -| onPause() => void | Triggered when the animation playback is paused. | -| onRepeat() => void | Triggered when the animation playback is repeated. | -| onCancel() => void | Triggered when the animation playback is canceled. | -| onFinish() => void | Triggered when the animation playback is complete. | +| onStart() => void | Triggered when the animation starts to play. | +| onPause() => void | Triggered when the animation playback is paused. | +| onRepeat() => void | Triggered when the animation playback is repeated. | +| onCancel() => void | Triggered when the animation playback is canceled. | +| onFinish() => void | Triggered when the animation playback is complete. | ## Example @@ -78,6 +78,7 @@ struct ImageAnimatorExample { ImageAnimator() .images([ { + // The comment folder is at the same level as the pages folder. src: '/comment/bg1.jpg', duration: 500, width: 325, diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-marquee.md b/en/application-dev/reference/arkui-ts/ts-basic-components-marquee.md index 083c2b488d18ee29307065c55c10e4450d0d85c2..c0a513e8a78614652ef01a5d43476e5492a9dba9 100644 --- a/en/application-dev/reference/arkui-ts/ts-basic-components-marquee.md +++ b/en/application-dev/reference/arkui-ts/ts-basic-components-marquee.md @@ -1,7 +1,7 @@ # Marquee -> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE** +> **NOTE**
> This component is supported since API version 8. Updates will be marked with a superscript to indicate their earliest API version. @@ -15,7 +15,7 @@ None ## Child Components -None +Not supported ## APIs @@ -23,22 +23,22 @@ None Marquee(value: { start: boolean, step?: number, loop?: number, fromStart?: boolean, src: string }) - Parameters - | Name| Type| Mandatory| Default Value| Description| + | Name| Type| Mandatory| Default Value| Description| | -------- | -------- | -------- | -------- | -------- | - | start | boolean | Yes| - | Whether to start scrolling.| - | step | number | No| 6 | Scrolling step.| - | loop | number | No| -1 | Number of times the marquee will scroll. If the value is less than or equal to **0**, the marquee will scroll continuously.| - | fromStart | boolean | No| true | Whether the text scrolls from the start.| - | src | string | Yes| - | Text to scroll.| + | start | boolean | Yes| - | Whether to start scrolling.| + | step | number | No| 6 | Scrolling step.| + | loop | number | No| -1 | Number of times the marquee will scroll. If the value is less than or equal to **0**, the marquee will scroll continuously.| + | fromStart | boolean | No| true | Whether the text scrolls from the start.| + | src | string | Yes| - | Text to scroll.| ## Events - | Name| Description| +| Name| Description| | -------- | -------- | -| onStart(callback: () => void) | Triggered when the marquee starts scrolling.| -| onBounce(callback: () => void) | Triggered when the marquee has reached the end.| -| onFinish(callback: () => void) | Triggered when the marquee has finished scrolling.| +| onStart(callback: () => void) | Triggered when the marquee starts scrolling.| +| onBounce(callback: () => void) | Triggered when the marquee has reached the end.| +| onFinish(callback: () => void) | Triggered when the marquee has finished scrolling.| ## Example