!3471 快速入门图片/文字间加换行&Sample链接修改：无需翻译

Merge pull request !3471 from 葛亚芳/master

en/application-dev/quick-start/start-with-ets-low-code.md

@@ -22,9 +22,11 @@ You can develop applications or services in the low-code approach using either o
 ## Creating a Project That Supports Low-Code Development
 
 1. Open DevEco Studio, choose **File** > **New** > **Create Project**, select **Empty Ability**, and click **Next**.
+
    ![en-us_image_0000001233528152](figures/en-us_image_0000001233528152.png)
 
 2. Go to the project configuration page, select **Enable Super Visual**, set **UI Syntax** to **eTS**, and retain the default values for other parameters.
+
    ![en-us_image_0000001277728569](figures/en-us_image_0000001277728569.png)
 
 3. Click **Finish**. DevEco Studio will automatically generate the sample code and resources that match your project type. Wait until the project is created.
@@ -68,6 +70,7 @@ Add **Column**, **Text**, and **Button** components to the first page. A column
    ![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. Below is how the first page looks in the Previewer.
+
    ![en-us_image_0000001235892798](figures/en-us_image_0000001235892798.png)
 
 
@@ -101,6 +104,7 @@ Add **Column**, **Text**, and **Button** components to the first page. A column
       }
       ```
    - Drag the **Text** component to the canvas and then to the center area of the **Column** component. In the **Attributes & Styles** area, click ![en-us_image_0000001277488985](figures/en-us_image_0000001277488985.png)**Feature**, set **Content** of the **Text** component to **this.message** (that is, **Hi there**), set **FontSize** to **30fp**, and set **TextAlign** to **center**. Then, select the **Text** component on the canvas and drag its corners to fully display the text. Below is an illustration of the operations.
+
       ![en-us_image_0000001280255513](figures/en-us_image_0000001280255513.gif)
 
 5. Add a **Button** component.
@@ -141,6 +145,7 @@ You can implement page redirection through the page router, which finds the targ
      ```
    
    - In the index.visual file, select the **Button** component on the canvas. In the **Attributes & Styles** area, click ![en-us_image_0000001233209020](figures/en-us_image_0000001233209020.png)**Events** and set **OnClick** to **this.onclick**.
+
      ![en-us_image_0000001235745716](figures/en-us_image_0000001235745716.png)
 
 2. Implement redirection from the second page to the first page.
@@ -170,9 +175,11 @@ You can implement page redirection through the page router, which finds the targ
       }
       ```
    - In the second.visual file, select the **Button** component on the canvas. In the **Attributes & Styles** area, click ![en-us_image_0000001233368900](figures/en-us_image_0000001233368900.png)**Events** and set **OnClick** to **this.back**.
+
       ![en-us_image_0000001280385809](figures/en-us_image_0000001280385809.png)
 
 3. Open the **index.visual** or **index.ets** file and click ![en-us_image_0000001277608849](figures/en-us_image_0000001277608849.png) in the Previewer to refresh the file. The figure below shows the effect.
+
    ![en-us_image_0000001233528192](figures/en-us_image_0000001233528192.png)
 
 
@@ -181,9 +188,11 @@ You can implement page redirection through the page router, which finds the targ
 1. Connect the development board running the OpenHarmony standard system to the computer.
 
 2. Choose **File** > **Project Structure** > **Project** > **Signing Configs**, select **Automatically generate signing**, wait until the automatic signing is complete, and click **OK**, as shown below.
+
    ![en-us_image_0000001277728613](figures/en-us_image_0000001277728613.png)
 
 3. On the toolbar in the upper right corner of the editing window, click ![en-us_image_0000001277809373](figures/en-us_image_0000001277809373.png). The display effect is shown in the figure below.
+
    ![en-us_image_0000001233209024](figures/en-us_image_0000001233209024.png)
 
 Congratulations! You have finished developing your OpenHarmony application in eTS in the low-code approach. To learn more about OpenHarmony, see [OpenHarmony Overview](../application-dev-guide.md).

en/application-dev/quick-start/start-with-ets.md

@@ -9,9 +9,11 @@
 ## Creating an eTS Project
 
 1. Open DevEco Studio, choose **File** > **New** > **Create Project**, select **Empty Ability**, and click **Next**.
+
    ![en-us_image_0000001223556342](figures/en-us_image_0000001223556342.png)
 
 2. On the project configuration page, set **UI Syntax** to **eTS** and retain the default values for other parameters.
+
    ![en-us_image_0000001223716826](figures/en-us_image_0000001223716826.png)
 
 3. Click **Finish**. DevEco Studio will automatically generate the sample code and resources that match your project type. Wait until the project is created.
@@ -234,6 +236,7 @@ You can implement page redirection through the page router, which finds the targ
    ```
 
 3. Open the **index.ets** file and click ![en-us_image_0000001262219043](figures/en-us_image_0000001262219043.png) in the Previewer to refresh the file. The figure below shows the effect.
+
    ![en-us_image_0000001260684127](figures/en-us_image_0000001260684127.png)
 
 
@@ -242,9 +245,11 @@ You can implement page redirection through the page router, which finds the targ
 1. Connect the development board running the OpenHarmony standard system to the computer.
 
 2. Choose **File** > **Project Structure** > **Project** > **Signing Configs**, select **Automatically generate signing**, wait until the automatic signing is complete, and click **OK**, as shown below.
+
    ![en-us_image_0000001268077317](figures/en-us_image_0000001268077317.png)
 
 3. On the toolbar in the upper right corner of the editing window, click ![en-us_image_0000001262206247](figures/en-us_image_0000001262206247.png). The display effect is shown in the figure below.
+
    ![en-us_image_0000001217526428](figures/en-us_image_0000001217526428.png)
 
 Congratulations! You have finished developing your OpenHarmony application in eTS in the traditional coding approach. To learn more about OpenHarmony, see [OpenHarmony Overview](../application-dev-guide.md)

en/application-dev/quick-start/start-with-js-low-code.md

@@ -23,10 +23,11 @@ You can develop applications or services in the low-code approach using either o
 > This feature is available in DevEco Studio 3.0 Beta2 and later versions and works with compileSdkVersion 7 or later.
 
 1. Open DevEco Studio, choose **File** > **New** > **Create Project**, select **Empty Ability**, and click **Next**.
+
    ![en-us_image_0000001268198893](figures/en-us_image_0000001268198893.png)
 2. Go to the project configuration page, select **Enable Super Visual**, set **UI Syntax** to **JS**, and retain the default values for other parameters.
 
-  ![en-us_image_0000001223717294](figures/en-us_image_0000001223717294.png)
+    ![en-us_image_0000001223717294](figures/en-us_image_0000001223717294.png)
 
 3. Click **Finish**. DevEco Studio will automatically generate the sample code and resources that match your project type. Wait until the project is created.
 
@@ -70,6 +71,7 @@ Add **Div**, **Text**, and **Button** components to the first page.
    ![en-us_image_0000001260928361](figures/en-us_image_0000001260928361.gif)
 
 5. On the toolbar in the upper right corner of the editing window, click **Previewer** to open the Previewer. Below is how the first page looks on the Previewer.
+
    ![en-us_image_0000001216288558](figures/en-us_image_0000001216288558.png)
 
 
@@ -137,9 +139,10 @@ You can implement page redirection through the [page router](../ui/ui-js-buildin
       ```
    - In the second.visual file, select the **Button** component on the canvas. In the **Attributes & Styles** area, click ![en-us_image_0000001215388262](figures/en-us_image_0000001215388262.png)**Events** and set **Click** to **back**.
 
-   ![en-us_image_0000001268082945](figures/en-us_image_0000001268082945.png)
+     ![en-us_image_0000001268082945](figures/en-us_image_0000001268082945.png)
 
 3. Open the **index.visual** or **index.js** file and click ![en-us_image_0000001261979271](figures/en-us_image_0000001261979271.png) in the Previewer to refresh the file. The figure below shows the effect.
+
    ![en-us_image_0000001261142799](figures/en-us_image_0000001261142799.png)
 
 
@@ -148,9 +151,11 @@ You can implement page redirection through the [page router](../ui/ui-js-buildin
 1. Connect the development board running the OpenHarmony standard system to the computer.
 
 2. Choose **File** > **Project Structure** > **Project** > **Signing Configs**, select **Automatically generate signing**, wait until the automatic signing is complete, and click **OK**, as shown below.
+
    ![en-us_image_0000001268283201](figures/en-us_image_0000001268283201.png)
 
 3. On the toolbar in the upper right corner of the editing window, click ![en-us_image_0000001262207811](figures/en-us_image_0000001262207811.png). The display effect is shown in the figure below.
+
    ![en-us_image_0000001262127855](figures/en-us_image_0000001262127855.png)
 
 Congratulations! You have finished developing your OpenHarmony app in JavaScript in the low-code approach. To learn more about OpenHarmony, see [OpenHarmony Overview](../application-dev-guide.md)

en/application-dev/quick-start/start-with-js.md

@@ -7,9 +7,11 @@
 ## Creating a JavaScript Project
 
 1. Open DevEco Studio, choose **File** > **New** > **Create Project**, select **Empty Ability**, and click **Next**.
+
    ![en-us_image_0000001223558814](figures/en-us_image_0000001223558814.png)
 
 2. On the project configuration page, set **UI Syntax** to **JS** and retain the default values for other parameters.
+
    ![en-us_image_0000001223877162](figures/en-us_image_0000001223877162.png)
 
 3. Click **Finish**. DevEco Studio will automatically generate the sample code and resources that match your project type. Wait until the project is created.
@@ -189,6 +191,7 @@ You can implement page redirection through the [page router](../ui/ui-js-buildin
    ```
 
 3. Open any file in the **index** folder and click ![en-us_image_0000001262339067](figures/en-us_image_0000001262339067.png) in the Previewer to refresh the file. The figure below shows the effect.
+
    ![en-us_image_0000001216269940](figures/en-us_image_0000001216269940.png)
 
 
@@ -197,9 +200,11 @@ You can implement page redirection through the [page router](../ui/ui-js-buildin
 1. Connect the development board running the OpenHarmony standard system to the computer.
 
 2. Choose **File** > **Project Structure** > **Project** > **Signing Configs**, select **Automatically generate signing**, wait until the automatic signing is complete, and click **OK**, as shown below.
+
    ![en-us_image_0000001223557290](figures/en-us_image_0000001223557290.png)
 
 3. On the toolbar in the upper right corner of the editing window, click ![en-us_image_0000001217047316](figures/en-us_image_0000001217047316.png). The display effect is shown in the figure below.
+
    ![en-us_image_0000001217527892](figures/en-us_image_0000001217527892.png)
 
 Congratulations! You have finished developing your OpenHarmony application in JavaScript in the traditional coding approach. To learn more about OpenHarmony, see [OpenHarmony Overview](../application-dev-guide.md)

zh-cn/application-dev/notification/common-event.md

@@ -174,6 +174,6 @@ if (this.subscriber != null) {
 
 针对公共事件开发，有以下相关实例可供参考：
 
-- [`CommonEvent`：订阅公共事件（eTS）（API7）](https://gitee.com/openharmony/app_samples/tree/master/ability/CommonEvent)
+- [`CommonEvent`：订阅公共事件（eTS）（API7）](https://gitee.com/openharmony/app_samples/tree/master/Notification/CommonEvent)
 
 

zh-cn/application-dev/quick-start/start-with-ets-low-code.md

@@ -23,9 +23,11 @@ OpenHarmony低代码开发方式具有丰富的UI界面编辑功能，通过可
 ## 创建新工程支持低代码开发
 
 1. 打开**DevEco Studio**，点击**File** > **New** > **Create Project**，选择模板“**Empty Ability**”，点击**Next**进行下一步配置。
+
    ![zh-cn_image_0000001233528152](figures/zh-cn_image_0000001233528152.png)
 
 2. 进入配置工程界面，打开“**Enable Super Visual**”开关，**UI Syntax**选择“**eTS**”，其他参数保持默认设置即可。
+
    ![zh-cn_image_0000001277728569](figures/zh-cn_image_0000001277728569.png)
 
 3. 点击**Finish**，工具会自动生成示例代码和相关资源，等待工程创建完成。
@@ -69,6 +71,7 @@ OpenHarmony低代码开发方式具有丰富的UI界面编辑功能，通过可
    ![zh-cn_image_0000001235732402](figures/zh-cn_image_0000001233208988.gif)
 
 5. **在编辑窗口右上角的侧边工具栏，点击Previewer，打开预览器。** 第一个页面效果如下图所示：
+
    ![zh-cn_image_0000001235892798](figures/zh-cn_image_0000001233049004.png)
 
 
@@ -103,7 +106,8 @@ OpenHarmony低代码开发方式具有丰富的UI界面编辑功能，通过可
       }
       ```
    - 选中Text组件，将其拖至画布，再拖至Column组件的中央区域。点击右侧属性样式栏中的图标![zh-cn_image_0000001277488985](figures/zh-cn_image_0000001277488985.png)（Feature），设置Text组件的Content属性为“this.message”（即“Hi there”）；设置Text组件的FontSize样式为30fp；设置组件的TextAlign样式为center。再选中画布上的Text组件，拖动放大。操作如下所示：
-   ![zh-cn_image_0000001280255513](figures/zh-cn_image_0000001277608817.gif)
+
+        ![zh-cn_image_0000001280255513](figures/zh-cn_image_0000001277608817.gif)
    
 5. **添加按钮。**
    选中UI Control中的Button组件，将其拖至画布，再拖至Text组件下面。点击右侧属性样式栏中的图标![zh-cn_image_0000001233528160](figures/zh-cn_image_0000001233528160.png)（General），设置Button组件的Height为40vp；点击右侧属性样式栏中的图标![zh-cn_image_0000001277728597](figures/zh-cn_image_0000001277728597.png)（Feature），设置Button组件的Value属性为“Back”；设置组件的FontSize样式为25fp，使得其文字放大。操作如下所示：
@@ -143,6 +147,7 @@ OpenHarmony低代码开发方式具有丰富的UI界面编辑功能，通过可
      ```
    
    - “**index.visual**”： 打开index.visual，选中画布上的Button组件。点击右侧属性样式栏中的事件图标![zh-cn_image_0000001233209020](figures/zh-cn_image_0000001233209020.png)（Events），鼠标点击OnClick事件的输入框，选择this.onclick，如下所示：
+
      ![zh-cn_image_0000001235745716](figures/zh-cn_image_0000001233049040.png)
 
 2. **第二个页面返回到第一个页面。**
@@ -172,9 +177,11 @@ OpenHarmony低代码开发方式具有丰富的UI界面编辑功能，通过可
       }
       ```
    - “**second.visual**”： 打开second.visual，选中画布上的Button组件。点击右侧属性样式栏中的事件图标![zh-cn_image_0000001233368900](figures/zh-cn_image_0000001233368900.png)（Events），鼠标点击OnClick事件的输入框，选择this.back，如下所示：
+
       ![zh-cn_image_0000001280385809](figures/zh-cn_image_0000001277489017.png)
 
 3. **打开index.visual或index.ets文件，点击预览器中的** ![zh-cn_image_0000001277608849](figures/zh-cn_image_0000001277608849.png) **按钮进行刷新。** 效果如下图所示：
+
    ![zh-cn_image_0000001233528192](figures/zh-cn_image_0000001233528192.png)
 
 
@@ -183,9 +190,11 @@ OpenHarmony低代码开发方式具有丰富的UI界面编辑功能，通过可
 1. 将搭载OpenHarmony标准系统的开发板与电脑连接。
 
 2. 点击**File** > **Project Structure** > **Project** > **Signing Configs**界面勾选“**Automatically generate signing**”，等待自动签名完成即可，点击“**OK**”。如下图所示：
+
    ![zh-cn_image_0000001277728613](figures/zh-cn_image_0000001277728613.png)
 
 3. 在编辑窗口右上角的工具栏，点击![zh-cn_image_0000001277809373](figures/zh-cn_image_0000001277809373.png)按钮运行。效果如下图所示：
+
    ![zh-cn_image_0000001233209024](figures/zh-cn_image_0000001233209024.png)
 
 恭喜您已经使用eTS语言开发（低代码方式）完成了第一个OpenHarmony应用，快来[探索更多的OpenHarmony功能](../application-dev-guide.md)吧。

zh-cn/application-dev/quick-start/start-with-ets.md

@@ -9,9 +9,11 @@
 ## 创建eTS工程
 
 1. 打开**DevEco Studio**，点击**File** > **New** > **Create Project**，选择模板“**Empty Ability**”，点击**Next**进行下一步配置。
+
    ![zh-cn_image_0000001223556342](figures/zh-cn_image_0000001223556342.png)
 
 2. 进入配置工程界面，**UI Syntax**选择“**eTS**”，其他参数保持默认设置即可。
+
    ![zh-cn_image_0000001223716826](figures/zh-cn_image_0000001223716826.png)
 
 3. 点击**Finish**，工具会自动生成示例代码和相关资源，等待工程创建完成。
@@ -245,6 +247,7 @@
 1. 将搭载OpenHarmony标准系统的开发板与电脑连接。
 
 2. 点击**File** > **Project Structure** > **Project** > **SigningConfigs**界面勾选“**Automatically generate signing**”，等待自动签名完成即可，点击“**OK**”。如下图所示：
+
    ![zh-cn_image_0000001268077317](figures/zh-cn_image_0000001268077317.png)
 
 3. 在编辑窗口右上角的工具栏，点击![zh-cn_image_0000001262206247](figures/zh-cn_image_0000001262206247.png)按钮运行。效果如下图所示：

zh-cn/application-dev/quick-start/start-with-js-low-code.md

@@ -24,9 +24,11 @@ OpenHarmony低代码开发方式具有丰富的UI界面编辑功能，通过可
 > 该功能在DevEco Studio 3.0 Beta2及更高版本中支持，且compileSdkVersion必须为7或以上。
 
 1. 打开**DevEco Studio**，点击**File** > **New** > **Create Project**，选择模板“**Empty Ability**”，点击**Next**进行下一步配置。
+
    ![zh-cn_image_0000001268198893](figures/zh-cn_image_0000001268198893.png)
 
 2. 进入配置工程界面，打开“**Enable Super Visual**”开关，**UI Syntax**选择“**JS**”，其他参数保持默认设置即可。
+
    ![zh-cn_image_0000001223717294](figures/zh-cn_image_0000001223717294.png)
 
 3. 点击**Finish**，工具会自动生成示例代码和相关资源，等待工程创建完成。
@@ -73,6 +75,7 @@ OpenHarmony低代码开发方式具有丰富的UI界面编辑功能，通过可
    ![zh-cn_image_0000001260928361](figures/zh-cn_image_0000001260928361.gif)
 
 5. **在编辑窗口右上角的侧边工具栏，点击Previewer，打开预览器。** 第一个页面效果如下图所示：
+
    ![zh-cn_image_0000001216288558](figures/zh-cn_image_0000001216288558.png)
 
 
@@ -140,7 +143,7 @@ OpenHarmony低代码开发方式具有丰富的UI界面编辑功能，通过可
       ```
    - “**second.visual**”： 打开second.visual，选中画布上的Button组件。点击右侧属性样式栏中的事件图标![zh-cn_image_0000001215388262](figures/zh-cn_image_0000001215388262.png)（Events），鼠标点击Click事件的输入框，选择back，如下所示：
 
-   ![zh-cn_image_0000001268082945](figures/zh-cn_image_0000001268082945.png)
+     ![zh-cn_image_0000001268082945](figures/zh-cn_image_0000001268082945.png)
 
 3. **打开index.visual或index.js文件，点击预览器中的** ![zh-cn_image_0000001261979271](figures/zh-cn_image_0000001261979271.png) **按钮进行刷新。** 效果如下图所示：
 
@@ -152,6 +155,7 @@ OpenHarmony低代码开发方式具有丰富的UI界面编辑功能，通过可
 1. 将搭载OpenHarmony标准系统的开发板与电脑连接。
 
 2. 点击**File** > **Project Structure** > **Project** > **Signing Configs**界面勾选“**Automatically generate signing**”，等待自动签名完成即可，点击“**OK**”。如下图所示：
+
    ![zh-cn_image_0000001268283201](figures/zh-cn_image_0000001268283201.png)
 
 3. 在编辑窗口右上角的工具栏，点击![zh-cn_image_0000001262207811](figures/zh-cn_image_0000001262207811.png)按钮运行。效果如下图所示：

zh-cn/application-dev/quick-start/start-with-js.md

@@ -8,9 +8,11 @@
 ## 创建JS工程
 
 1. 打开**DevEco Studio**，点击**File** > **New** > **Create Project**，选择模板“**Empty Ability**”，点击**Next**进行下一步配置。
+
    ![zh-cn_image_0000001223558814](figures/zh-cn_image_0000001223558814.png)
 
 2. 进入配置工程界面，**UI Syntax**选择“**JS**”，其他参数保持默认设置即可。
+
    ![zh-cn_image_0000001223877162](figures/zh-cn_image_0000001223877162.png)
 
 3. 点击**Finish**，工具会自动生成示例代码和相关资源，等待工程创建完成。
@@ -203,6 +205,7 @@
 1. 将搭载OpenHarmony标准系统的开发板与电脑连接。
 
 2. 点击**File** > **Project Structure** > **Project** > **Signing Configs**界面勾选“**Automatically generate signing**”，等待自动签名完成即可，点击“**OK**”。如下图所示：
+
    ![zh-cn_image_0000001223557290](figures/zh-cn_image_0000001223557290.png)
 
 3. 在编辑窗口右上角的工具栏，点击![zh-cn_image_0000001217047316](figures/zh-cn_image_0000001217047316.png)按钮运行。效果如下图所示：