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

Signed-off-by: N@ge-yafang <geyafang@huawei.com>

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)吧。