未验证 提交 d35878b6 编写于 作者: O openharmony_ci 提交者: Gitee

!6021 翻译完成 5877、5047、5917、5853

Merge pull request !6021 from ester.zhou/C-0628
...@@ -15,7 +15,7 @@ You can develop applications or services in the low-code approach using either o ...@@ -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. - 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 ## Creating a Project That Supports Low-Code Development
...@@ -52,7 +52,7 @@ Add **Column**, **Text**, and **Button** components to the first page. A column ...@@ -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. 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.<a name="add_container"></a> 2. Add a **Column** component and set its styles and attributes.<a name="add_container"></a>
...@@ -70,7 +70,7 @@ Add **Column**, **Text**, and **Button** components to the first page. A column ...@@ -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 &amp; 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. Drag the **Button** component from the **UI Control** area to the canvas and then to a position under the **Text** component. In the **Attributes &amp; 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. 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 ...@@ -85,7 +85,7 @@ Add **Column**, **Text**, and **Button** components to the first page. A column
In the **Project** window, choose **entry** &gt; **src** &gt; **main** &gt; **ets** &gt; **MainAbility**, right-click the **pages** folder, choose **New** &gt; **Visual**, name the page **second**, and click **Finish**. Below, you can see the structure of the **pages** folder. In the **Project** window, choose **entry** &gt; **src** &gt; **main** &gt; **ets** &gt; **MainAbility**, right-click the **pages** folder, choose **New** &gt; **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) 2. [Delete the existing template components from the canvas.](#delete_origin_content)
......
...@@ -13,7 +13,7 @@ You can develop applications or services in the low-code approach using either o ...@@ -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. - 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 ## Creating a Project That Supports Low-Code Development
...@@ -53,15 +53,15 @@ Add **Div**, **Text**, and **Button** components to the first page. ...@@ -53,15 +53,15 @@ Add **Div**, **Text**, and **Button** components to the first page.
1. Delete the existing template components from the canvas.<a name= delete_origin_content></a> 1. Delete the existing template components from the canvas.<a name= delete_origin_content></a>
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.<a name = add_container></a> 2. Add a **Div** component and set its styles and attributes.<a name = add_container></a>
Drag the **Div** component from the **UI Control** area to the canvas. In the **Attributes &amp; 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. Drag the **Div** component from the **UI Control** area to the canvas. In the **Attributes &amp; 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. 3. Add a **Text** component.
...@@ -88,7 +88,7 @@ Open the index.visual file, right-click the existing template components on the ...@@ -88,7 +88,7 @@ Open the index.visual file, right-click the existing template components on the
In the **Project** window, choose **entry** &gt; **src** &gt; **main** &gt; **js** &gt; **MainAbility**, right-click the **pages** folder, choose **New** &gt; **Visual**, name the page **second**, and click **Finish**. Below, you can see the structure of the **pages** folder. In the **Project** window, choose **entry** &gt; **src** &gt; **main** &gt; **js** &gt; **MainAbility**, right-click the **pages** folder, choose **New** &gt; **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) 2. [Delete the existing template components from the canvas.](#delete_origin_content)
......
# Setting the System Time # Setting the System Time
> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**<br>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**<br>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 ## Modules to Import
...@@ -189,7 +189,7 @@ Obtains the time elapsed since system start, excluding the deep sleep time. This ...@@ -189,7 +189,7 @@ Obtains the time elapsed since system start, excluding the deep sleep time. This
**Example** **Example**
```js ```js
systemTime.getCurrentTime().then((data) => { systemTime.getRealActiveTime().then((data) => {
console.log(`systemTime.getRealActiveTime success data : ` + JSON.stringify(data)); console.log(`systemTime.getRealActiveTime success data : ` + JSON.stringify(data));
}).catch((error) => { }).catch((error) => {
console.error(`failed to systemTime.getRealActiveTime because ` + JSON.stringify(error)); console.error(`failed to systemTime.getRealActiveTime because ` + JSON.stringify(error));
......
# ImageAnimator # ImageAnimator
> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE** > **NOTE**<br>
> This component is supported since API version 7. Updates will be marked with a superscript to indicate their earliest API version. > This component is supported since API version 7. Updates will be marked with a superscript to indicate their earliest API version.
The **&lt;ImageAnimator&gt;** 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 **\<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.
## Required Permissions ## Required Permissions
...@@ -15,7 +15,7 @@ None ...@@ -15,7 +15,7 @@ None
## Child Components ## Child Components
None Not supported
## APIs ## APIs
...@@ -53,7 +53,7 @@ ImageAnimator() ...@@ -53,7 +53,7 @@ ImageAnimator()
## Events ## Events
| Name | Description | | Name | Description |
| -------- | -------- | -------- | | -------- | -------- | -------- |
| onStart() =&gt; void | Triggered when the animation starts to play. | | onStart() =&gt; void | Triggered when the animation starts to play. |
| onPause() =&gt; void | Triggered when the animation playback is paused. | | onPause() =&gt; void | Triggered when the animation playback is paused. |
...@@ -78,6 +78,7 @@ struct ImageAnimatorExample { ...@@ -78,6 +78,7 @@ struct ImageAnimatorExample {
ImageAnimator() ImageAnimator()
.images([ .images([
{ {
// The comment folder is at the same level as the pages folder.
src: '/comment/bg1.jpg', src: '/comment/bg1.jpg',
duration: 500, duration: 500,
width: 325, width: 325,
......
# Marquee # Marquee
> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE** > **NOTE**<br>
> This component is supported since API version 8. Updates will be marked with a superscript to indicate their earliest API version. > 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 ...@@ -15,7 +15,7 @@ None
## Child Components ## Child Components
None Not supported
## APIs ## APIs
...@@ -34,7 +34,7 @@ Marquee(value: { start: boolean, step?: number, loop?: number, fromStart?: boole ...@@ -34,7 +34,7 @@ Marquee(value: { start: boolean, step?: number, loop?: number, fromStart?: boole
## Events ## Events
| Name| Description| | Name| Description|
| -------- | -------- | | -------- | -------- |
| onStart(callback:&nbsp;()&nbsp;=&gt;&nbsp;void) | Triggered when the marquee starts scrolling.| | onStart(callback:&nbsp;()&nbsp;=&gt;&nbsp;void) | Triggered when the marquee starts scrolling.|
| onBounce(callback:&nbsp;()&nbsp;=&gt;&nbsp;void) | Triggered when the marquee has reached the end.| | onBounce(callback:&nbsp;()&nbsp;=&gt;&nbsp;void) | Triggered when the marquee has reached the end.|
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册