!10255 格式整改挑单到3.2beta3

Merge pull request !10255 from 田雨/OpenHarmony-3.2-Beta3

zh-cn/application-dev/reference/arkui-js/js-components-basic-span.md

@@ -12,7 +12,7 @@
 
 ## 子组件
 
-支持子组件<span>。
+无
 
 
 ## 属性

zh-cn/application-dev/reference/arkui-js/js-components-basic-toggle.md

@@ -81,34 +81,51 @@
 ```js
 // xxx.js
 export default {
-  data: {
-    toggle_list: [
-      { "id":"1001", "name":"Living room", "checked":true },
-      { "id":"1002", "name":"Bedroom", "checked":false },
-      { "id":"1003", "name":"Second bedroom", "checked":false },
-      { "id":"1004", "name":"Kitchen", "checked":false },
-      { "id":"1005", "name":"Study", "checked":false },
-      { "id":"1006", "name":"Garden", "checked":false },
-      { "id":"1007", "name":"Bathroom", "checked":false },
-      { "id":"1008", "name":"Balcony", "checked":false },
-    ],
-    toggles: ["Living room","Bedroom","Kitchen","Study"],
-    idx: ""
-  },
-  allclick(arg) {
-    this.idx = arg
-  },
-  allchange(e) {
-    if (e.checked === true) {
-      for (var i = 0; i < this.toggle_list.length; i++) {
-        if (this.toggle_list[i].id === this.idx) {
-          this.toggle_list[i].checked = true
-        } else {
-          this.toggle_list[i].checked = false
+    data: {
+        toggle_list: [
+            {
+                "id": "1001", "name": "Living room", "checked": true
+            },
+            {
+                "id": "1002", "name": "Bedroom", "checked": false
+            },
+            {
+                "id": "1003", "name": "Second bedroom", "checked": false
+            },
+            {
+                "id": "1004", "name": "Kitchen", "checked": false
+            },
+            {
+                "id": "1005", "name": "Study", "checked": false
+            },
+            {
+                "id": "1006", "name": "Garden", "checked": false
+            },
+            {
+                "id": "1007", "name": "Bathroom", "checked": false
+            },
+            {
+                "id": "1008", "name": "Balcony", "checked": false
+            },
+        ],
+        toggles: ["Living room", "Bedroom", "Kitchen", "Study"],
+        idx: ""
+    },
+    allclick(arg) {
+        this.idx = arg;
+    },
+    allchange(e) {
+        if (e.checked != true) {
+            return;
+        }
+        for (var i = 0; i < this.toggle_list.length; i++) {
+            if (this.toggle_list[i].id === this.idx) {
+                this.toggle_list[i].checked = true;
+            } else {
+                this.toggle_list[i].checked = false;
+            }
         }
-      }
     }
-  }
 }
 ```
 

zh-cn/application-dev/reference/arkui-js/js-components-basic-toolbar-item.md

@@ -3,7 +3,7 @@
 >  **说明：**
 >  从API version 5开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
-工具栏子组件。作为工具栏组件的子组件，用于展示工具栏上的一个操作选项。
+ 工具栏[toolbar](js-components-basic-toolbar.md)子组件。 用于展示工具栏上的一个操作选项。  
 
 
 ## 子组件
@@ -59,13 +59,13 @@
 
 ```html
 <!-- xxx.hml -->
-<toolbar style="position: fixed; bottom: 0px; ">    
-   <toolbar-item icon='common/Icon/location.png' value='Option 1' >   </toolbar-item>
-   <toolbar-item icon='common/Icon/heart.png' value='Option 2'>   </toolbar-item>    
-   <toolbar-item icon='common/Icon/diamond.png' value='Option 3'  >   </toolbar-item>    
-   <toolbar-item icon='common/Icon/heart.png' value='Option 4' >   </toolbar-item>    
-   <toolbar-item icon='common/Icon/heart.png' value='Option 5' >   </toolbar-item>
-   <toolbar-item icon='common/Icon/heart.png' value='Option 6'>   </toolbar-item> 
+<toolbar style="position : fixed; bottom : 0px;">
+    <toolbar-item icon='common/Icon/location.png' value='Option 1'></toolbar-item>
+    <toolbar-item icon='common/Icon/heart.png' value='Option 2'></toolbar-item>
+    <toolbar-item icon='common/Icon/diamond.png' value='Option 3'></toolbar-item>
+    <toolbar-item icon='common/Icon/heart.png' value='Option 4'></toolbar-item>
+    <toolbar-item icon='common/Icon/heart.png' value='Option 5'></toolbar-item>
+    <toolbar-item icon='common/Icon/heart.png' value='Option 6'></toolbar-item>
 </toolbar>
 ```
 

zh-cn/application-dev/reference/arkui-js/js-components-container-swiper.md

@@ -12,7 +12,7 @@
 
 ## 子组件
 
-支持除<list>之外的子组件。
+可以包含子组件。
 
 
 ## 属性

zh-cn/application-dev/reference/arkui-ts/ts-container-listitemgroup.md

@@ -21,11 +21,11 @@ ListItemGroup(options?: {header?: CustomBuilder, footer?: CustomBuilder, space?:
 
 **参数：**
 
-  | 参数名 | 参数类型 | 必填 | 参数描述 |
-  | -------- | -------- | -------- | -------- |
-  | header | [CustomBuilder](ts-types.md#custombuilder8) | 否 |  设置ListItemGroup头部组件。 |
-  | footer | [CustomBuilder](ts-types.md#custombuilder8) | 否 |  设置ListItemGroup尾部组件。 |
-  | space | number \| string | 否 | 列表项间距。只作用于ListItem与ListItem之间，不作用于header与ListItem、footer与ListItem之间。 |
+| 参数名 | 参数类型 | 必填 | 参数描述 |
+| -------- | -------- | -------- | -------- |
+| header | [CustomBuilder](ts-types.md#custombuilder8) | 否 |  设置ListItemGroup头部组件。 |
+| footer | [CustomBuilder](ts-types.md#custombuilder8) | 否 |  设置ListItemGroup尾部组件。 |
+| space | number \| string | 否 | 列表项间距。只作用于ListItem与ListItem之间，不作用于header与ListItem、footer与ListItem之间。 |
 
 ## 属性
 
@@ -96,7 +96,7 @@ struct ListItemGroupExample {
             }, item => item)
           }
           .borderRadius(20)
-          .divider({ strokeWidth: 1, color: Color.Blue) // 每行之间的分界线
+          .divider({ strokeWidth: 1, color: Color.Blue }) // 每行之间的分界线
         })
       }
       .width('90%')

zh-cn/application-dev/reference/arkui-ts/ts-container-row.md

@@ -20,7 +20,7 @@ Row(value?:{space?:  number | string })
 
 | 参数名 | 参数类型 | 必填 | 参数描述 |
 | -------- | -------- | -------- | -------- |
-| space | string&nbsp;\|&nbsp;number | 否 | 横向布局元素间距。<br/>默认值：0 |
+| space | string&nbsp;\|&nbsp;number | 否 | 横向布局元素间距。<br/>默认值：0，单位vp |
 
 
 ## 属性

zh-cn/application-dev/reference/arkui-ts/ts-gesture-settings.md

@@ -40,7 +40,7 @@
 
 ## 响应手势事件
 
-组件通过手势事件绑定不同GestureType的手势对象，各手势对象提供的事件响应手势操作，提供手势相关信息。下面通过TapGesture对象的onAction事件响应点击事件，获取事件相关信息。其余手势对象的事件定义见各个手势对象章节。
+组件通过手势事件绑定不同GestureType的手势对象，各手势对象提供的事件响应手势操作，提供手势相关信息。下面通过TapGesture对象的onAction事件响应点击事件，获取事件相关信息。其余手势对象的事件定义见各个手势对象章节。  若需绑定多种手势请使用 [组合手势](ts-combined-gestures.md)。 
 
 - TapGesture事件说明
   | 名称 | 功能描述 |

zh-cn/application-dev/reference/arkui-ts/ts-offscreencanvasrenderingcontext2d.md

@@ -4,7 +4,7 @@
 >  从 API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
-使用OffscreenCanvasRenderingContext2D在Canvas上进行离屏绘制，绘制对象可以是矩形、文本、图片等。离屏绘制是指将需要绘制的内容先绘制在缓存区，然后将其转换成图片，一次性绘制绘制到canvas上，加快了绘制速度。
+使用OffscreenCanvasRenderingContext2D在Canvas上进行离屏绘制，绘制对象可以是矩形、文本、图片等。离屏绘制是指将需要绘制的内容先绘制在缓存区，然后将其转换成图片，一次性绘制到canvas上，加快了绘制速度。
 
 
 ## 接口
@@ -13,11 +13,11 @@ OffscreenCanvasRenderingContext2D(width: number, height: number, setting: Render
 
 **参数：**
 
-| 参数名     | 参数类型                                     | 必填   | 默认值  | 参数描述                           |
-| ------- | ---------------------------------------- | ---- | ---- | ------------------------------ |
-| width   | number                                   | 是    | -    | 离屏画布的宽度                        |
-| height  | number                                   | 是    | -    | 离屏画布的高度                        |
-| setting | [RenderingContextSettings](ts-canvasrenderingcontext2d.md#renderingcontextsettings) | 是    | -    | 见RenderingContextSettings接口描述。 |
+| 参数名  | 参数类型                                                     | 必填 | 参数描述                             |
+| ------- | ------------------------------------------------------------ | ---- | ------------------------------------ |
+| width   | number                                                       | 是   | 离屏画布的宽度                       |
+| height  | number                                                       | 是   | 离屏画布的高度                       |
+| setting | [RenderingContextSettings](ts-canvasrenderingcontext2d.md#renderingcontextsettings) | 是   | 见RenderingContextSettings接口描述。 |
 
 
 ## 属性

zh-cn/application-dev/reference/arkui-ts/ts-transition-animation-shared-elements.md

@@ -12,7 +12,7 @@
 
 | 名称             | 参数                                                         | 参数描述                                                     |
 | ---------------- | ------------------------------------------------------------ | ------------------------------------------------------------ |
-| sharedTransition | id:&nbsp;string,<br/>{<br/>duration?: number,<br/>curve?: Curve&nbsp;\|&nbsp;string,<br/>delay?: number,<br/>motionPath?: <br/>{<br/>path: string,<br/>form?: number,<br/>to?: number,<br/>rotatable?: boolean<br/>},<br/>zIndex?: number,<br/>type?: [SharedTransitionEffectType](ts-appendix-enums.md#sharedtransitioneffecttype)<br/>} | 两个页面中id值相同且不为空字符串的组件即为共享元素，在页面转场时可显示共享元素转场动效。<br/>-&nbsp; id：设置组件的id。<br/>-&nbsp; duration：单位为毫秒，默认动画时长为1000毫秒。<br/>-&nbsp;curve：默认曲线为Linear，有效值参见[Curve](ts-animatorproperty.md)&nbsp;说明。<br/>-&nbsp;delay：单位为毫秒，默认不延时播放。<br/>-&nbsp;motionPath：运动路径信息。<br/>-&nbsp;path：设置路径。<br/>-&nbsp;from：设置起始值。<br/>-&nbsp;to：设置终止值。<br/>-&nbsp;rotatable：是否旋转。<br/>-&nbsp;zIndex：设置Z轴。<br/>-&nbsp;type：动画类型。 |
+| sharedTransition | id:&nbsp;string,<br/>{<br/>&nbsp;duration?: number,<br/>&nbsp;curve?: Curve&nbsp;\|&nbsp;string,<br/>&nbsp;delay?: number,<br/>&nbsp;motionPath?: <br/>{<br/>&nbsp;path: string,<br/>&nbsp;form?: number,<br/>&nbsp;to?: number,<br/>&nbsp;rotatable?: boolean<br/>},<br/>zIndex?: number,<br/>type?: [SharedTransitionEffectType](ts-appendix-enums.md#sharedtransitioneffecttype)<br/>} | 两个页面中id值相同且不为空字符串的组件即为共享元素，在页面转场时可显示共享元素转场动效。<br/>&nbsp; id：设置组件的id。<br/>-&nbsp; duration：单位为毫秒，默认动画时长为1000毫秒。<br/>-&nbsp;curve：默认曲线为Linear，有效值参见[Curve](ts-animatorproperty.md)&nbsp;说明。<br/>-&nbsp;delay：单位为毫秒，默认不延时播放。<br/>-&nbsp;motionPath：运动路径信息。<br/>-&nbsp;path：设置路径。<br/>-&nbsp;from：设置起始值。<br/>-&nbsp;to：设置终止值。<br/>-&nbsp;rotatable：是否旋转。<br/>-&nbsp;zIndex：设置Z轴。<br/>-&nbsp;type：动画类型。 |
 
 
 ## 示例

zh-cn/application-dev/ui/arkui-overview.md

@@ -14,7 +14,7 @@
 
 ## 主要特征
 
-- UI组件：方舟开发框架不仅提供了多种基础组件，如文本显示、图片显示、按键交互等，也提供了支持视频播放能力的媒体组件。并且针对不同类型设备进行了组件设计，提供了组件在不同平台上的样式适配能力，此种组件称为“多态组件”。
+- UI组件：方舟开发框架不仅提供了多种基础组件， 例如文本、图片、按钮等  ，也提供了支持视频播放能力的媒体组件。并且针对不同类型设备进行了组件设计，提供了组件在不同平台上的样式适配能力，此种组件称为“多态组件”。
 
 - 布局：UI界面设计离不开布局的参与。方舟开发框架提供了多种布局方式，不仅保留了经典的弹性布局能力，也提供了列表、宫格、栅格布局和适应多分辨率场景开发的原子布局能力。
 

zh-cn/application-dev/ui/js-framework-syntax-js.md

@@ -164,8 +164,8 @@ JS文件用来定义HML页面的业务逻辑，支持ECMA规范的JavaScript语
        images: [
          { src: '/common/frame1.png' },
          { src: '/common/frame2.png' },
-         { src: '/common/frame3.png' },
-       ],
+         { src: '/common/frame3.png' }
+       ]
      },
      handleClick() {
        const animator = this.$refs.animator; // 获取ref属性为animator的DOM元素
@@ -196,8 +196,8 @@ JS文件用来定义HML页面的业务逻辑，支持ECMA规范的JavaScript语
        images: [
          { src: '/common/frame1.png' },
          { src: '/common/frame2.png' },
-         { src: '/common/frame3.png' },
-       ],
+         { src: '/common/frame3.png' }
+       ]
      },
      handleClick() {
        const animator = this.$element('animator'); // 获取id属性为animator的DOM元素

zh-cn/application-dev/ui/ts-component-based-customdialog.md

@@ -47,3 +47,5 @@ struct CustomDialogUser {
     }
 }
 ```
+
+ ![custom-dialog-demo](figures/custom-dialog-demo.gif) 
\ No newline at end of file

zh-cn/application-dev/ui/ui-js-components-path2d.md

@@ -68,7 +68,7 @@ export default {
     path.moveTo(600, 535);
     path.arc(520, 450, 85, 0, 6);
     ctx.stroke(path);
-  },
+  }
 }
 ```
 
@@ -131,58 +131,66 @@ text{
 ```js
 // xxx.js
 import prompt from '@system.prompt';
+
 export default {
-  data:{
-    ctx: null,
-    path1: null,
-    path2: null,
-    path3: null,
-    isAdd: "addPath2",
-    isChange: true,
-    textName: 'change'
-  },
-  onShow(){
-    this.ctx = this.$refs.canvas.getContext('2d',{antialias:true});
-    this.path1 = this.ctx.createPath2D();
-    this.path1.moveTo(200, 200);
-    this.path1.lineTo(400, 200);
-    this.path1.lineTo(400, 400);
-    this.path1.lineTo(200, 400);
-    this.path1.closePath();
-    this.path2 = this.ctx.createPath2D();
-    this.path2.arc(300, 300, 75, 0, 6.28)
-    this.ctx.stroke(this.path1);
-  },
-  addPath(){
-    if(this.isAdd == "addPath2"){
-      this.ctx.clearRect(0,0,600,600)
-      this.ctx.beginPath();
-      this.path2.addPath(this.path1)
-      this.ctx.stroke(this.path2);
-      this.isAdd = "clearPath2"
-    }else{
-      this.ctx.clearRect(0,0,600,600)
-      this.ctx.stroke(this.path1);      
-      this.isAdd = "addPath2"
-    }
-  },
-  setTransform(){
-    if(this.isChange){
-      this.ctx.clearRect(0,0,600,600)
-      this.path3 = this.ctx.createPath2D();
-      this.path3.arc(150, 150, 100, 0, 6.28)
-      this.path3.setTransform(2, 0.1, 0.1, 2, 0,0);      
-      this.ctx.stroke(this.path3);      
-      this.isChange =  !this.isChange;      
-      this.textName = "back"
-    }else{
-      this.ctx.clearRect(0,0,600,600)
-      this.path3.setTransform(0.5, -0.1, -0.1, 0.5, 0,0);
-      this.ctx.stroke(this.path3);
-      this.isChange =  !this.isChange;      
-      this.textName = "change"
+    data: {
+        ctx: null,
+        path1: null,
+        path2: null,
+        path3: null,
+        isAdd: "addPath2",
+        isChange: true,
+        textName: 'change'
+    },
+    onShow() {
+        this.ctx = this.$refs.canvas.getContext('2d', {
+            antialias: true
+        });
+        this.path1 = this.ctx.createPath2D();
+        // 正方形
+        this.path1.moveTo(200, 200);
+        this.path1.lineTo(400, 200);
+        this.path1.lineTo(400, 400);
+        this.path1.lineTo(200, 400);
+        this.path1.closePath();
+        this.path2 = this.ctx.createPath2D();
+        // 圆形
+        this.path2.arc(300, 300, 75, 0, 6.28);
+        this.ctx.stroke(this.path1);
+    },
+    addPath() {
+        if (this.isAdd == "addPath2") {
+            // 删除指定指定区域的绘制内容
+            this.ctx.clearRect(0, 0, 600, 600);
+            this.ctx.beginPath();
+            // 将另一个的路径添加到当前路径对象中
+            this.path2.addPath(this.path1);
+            this.ctx.stroke(this.path2);
+            this.isAdd = "clearPath2";
+        } else {
+            this.ctx.clearRect(0, 0, 600, 600);
+            this.ctx.stroke(this.path1);
+            this.isAdd = "addPath2";
+        }
+    },
+    setTransform() {
+        if (this.isChange) {
+            this.ctx.clearRect(0, 0, 600, 600);
+            this.path3 = this.ctx.createPath2D();
+            this.path3.arc(150, 150, 100, 0, 6.28);
+            // 重置现有的变换矩阵并创建新的变换矩阵
+            this.path3.setTransform(2, 0.1, 0.1, 2, 0, 0);
+            this.ctx.stroke(this.path3);
+            this.isChange = !this.isChange;
+            this.textName = "back"
+        } else {
+            this.ctx.clearRect(0, 0, 600, 600);
+            this.path3.setTransform(0.5, -0.1, -0.1, 0.5, 0, 0);
+            this.ctx.stroke(this.path3);
+            this.isChange = !this.isChange;
+            this.textName = "change";
+        }
     }
-  },
 }
 ```
 

zh-cn/application-dev/ui/ui-ts-building-category-grid-layout.md

@@ -320,7 +320,7 @@
    }
    ```
 
-   自定义组件提供了两个生命周期的回调接口aboutToAppear和aboutToDisappear。aboutToAppear的执行时机在创建自定义组件后，执行自定义组件build方法之前。aboutToDisappear在自定义组件的去初始化的时机执行。
+​    自定义组件提供了两个生命周期的回调接口aboutToAppear和aboutToDisappear。aboutToAppear的执行时机在创建自定义组件后，执行自定义组件build方法之前。aboutToDisappear在自定义组件销毁之前的时机执行。 
 
    ![zh-cn_image_0000001215113569](figures/zh-cn_image_0000001215113569.png)
 

zh-cn/application-dev/ui/ui-ts-layout-mediaquery.md

@@ -130,7 +130,7 @@ listener.on('change', onPortrait)
     }
   
     aboutToAppear() {
-      portraitFunc = this.onPortrait.bind(this) //bind current js instance
+      portraitFunc = this.onPortrait.bind(this) // 绑定当前应用实例
       this.listener.on('change', portraitFunc)
     }