!10248 挑单--整改文档

Merge pull request !10248 from wangshuainan1/OpenHarmony-3.2-Beta3

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-richtext.md

@@ -55,27 +55,27 @@ RichText(content:string)
 @Entry
 @Component
 struct RichTextExample {
-  @State data: string = "<h1 style='text-align: center;'>h1标题</h1>" +
-                        "<h1 style='text-align: center;'><i>h1斜体</i></h1>" +
-                        "<h1 style='text-align: center;'><u>h1下划线</u></h1>" +
-                        "<h2 style='text-align: center;'>h2标题</h2>" +
-                        "<h3 style='text-align: center;'>h3标题</h3>" +
-                        "<p style='text-align: center;'>p常规</p><hr/>" +
-                        "<div style='width: 500px;height: 500px;border: 1px solid;margin: 0auto;'>" +
-                        "<p style='font-size: 35px;text-align: center;font-weight: bold; color: rgb(24,78,228)'>字体大小35px,行高45px</p>" +
-                        "<p style='background-color: #e5e5e5;line-height: 45px;font-size: 35px;text-indent: 2em;'>" +
-                        "<p>这是一段文字这是一段文字这是一段文字这是一段文字这是一段文字这是一段文字这是一段文字这是一段文字这是一段文字</p>"
+  @State data: string = '<h1 style="text-align: center;">h1标题</h1>' +
+  '<h1 style="text-align: center;"><i>h1斜体</i></h1>' +
+  '<h1 style="text-align: center;"><u>h1下划线</u></h1>' +
+  '<h2 style="text-align: center;">h2标题</h2>' +
+  '<h3 style="text-align: center;">h3标题</h3>' +
+  '<p style="text-align: center;">p常规</p><hr/>' +
+  '<div style="width: 500px;height: 500px;border: 1px solid;margin: 0auto;">' +
+  '<p style="font-size: 35px;text-align: center;font-weight: bold; color: rgb(24,78,228)">字体大小35px,行高45px</p>' +
+  '<p style="background-color: #e5e5e5;line-height: 45px;font-size: 35px;text-indent: 2em;">' +
+  '<p>这是一段文字这是一段文字这是一段文字这是一段文字这是一段文字这是一段文字这是一段文字这是一段文字这是一段文字</p>';
 
   build() {
-    Flex({direction: FlexDirection.Column,alignItems: ItemAlign.Center,
-    justifyContent: FlexAlign.Center }){
+    Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center,
+      justifyContent: FlexAlign.Center }) {
       RichText(this.data)
-      .onStart(()=>{
-        console.info("RichText onStart")
-      })
-      .onComplete(()=>{
-        console.info("RichText onComplete")
-      })
+        .onStart(() => {
+          console.info('RichText onStart');
+        })
+        .onComplete(() => {
+          console.info('RichText onComplete');
+        })
     }
   }
 }

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

@@ -93,6 +93,8 @@ scrollEdge(value: Edge): void
 | value | [Edge](ts-appendix-enums.md#edge) | 是    | 滚动到的边缘位置。 |
 
 
+
+
 ### scrollPage
 
 scrollPage(value: { next: boolean, direction?: Axis }): void

zh-cn/application-dev/reference/arkui-ts/ts-methods-timepicker-dialog.md

@@ -5,11 +5,6 @@
 >  **说明：**
 > 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
-
-## 权限列表
-
-无
-
 ## TimePickerDialog.show
 
 show(options?: TimePickerDialogOptions)
@@ -33,7 +28,7 @@ show(options?: TimePickerDialogOptions)
 @Entry
 @Component
 struct TimePickerDialogExample01 {
-  @State isUseMilitaryTime: boolean = true
+  @State isUseMilitaryTime: boolean = true;
 
   build() {
     Flex({direction: FlexDirection.Column, alignItems: ItemAlign.Center,
@@ -42,13 +37,13 @@ struct TimePickerDialogExample01 {
         TimePickerDialog.show({
           useMilitaryTime: this.isUseMilitaryTime,
           onAccept: (value: TimePickerResult) => {
-            console.info("TimePickerDialog:onAccept()" + JSON.stringify(value))
+            console.info("TimePickerDialog:onAccept()" + JSON.stringify(value));
           },
           onCancel: () => {
-            console.info("TimePickerDialog:onCancel()")
+            console.info("TimePickerDialog:onCancel()");
           },
           onChange: (value: TimePickerResult) => {
-            console.info("TimePickerDialog:onChange()" + JSON.stringify(value))
+            console.info("TimePickerDialog:onChange()" + JSON.stringify(value));
           }
         })
       })
@@ -56,13 +51,16 @@ struct TimePickerDialogExample01 {
   }
 }
 ```
+  ![zh-cn_image_0000001118642010](figures/zh-cn_image_0000001118642010.gif)  
+
 ### 时间滑动选择器（12小时制）示例
+
 ```ts
 // xxx.ets
 @Entry
 @Component
 struct TimePickerDialogExample02 {
-  @State isUseMilitaryTime: boolean = false
+  @State isUseMilitaryTime: boolean = false;
 
   build() {
     Flex({direction: FlexDirection.Column, alignItems: ItemAlign.Center,
@@ -71,13 +69,13 @@ struct TimePickerDialogExample02 {
         TimePickerDialog.show({
           useMilitaryTime: this.isUseMilitaryTime,
           onAccept: (value: TimePickerResult) => {
-            console.info("TimePickerDialog:onAccept()" + JSON.stringify(value))
+            console.info("TimePickerDialog:onAccept()" + JSON.stringify(value));
           },
           onCancel: () => {
-            console.info("TimePickerDialog:onCancel()")
+            console.info("TimePickerDialog:onCancel()");
           },
           onChange: (value: TimePickerResult) => {
-            console.info("TimePickerDialog:onChange()" + JSON.stringify(value))
+            console.info("TimePickerDialog:onChange()" + JSON.stringify(value));
           }
         })
       })
@@ -85,3 +83,5 @@ struct TimePickerDialogExample02 {
   }
 }
 ```
+
+ ![zh-cn_image_0000001118642020](figures/zh-cn_image_0000001118642020.gif)  
\ No newline at end of file

zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-flex-layout.md

@@ -23,7 +23,6 @@
 @Entry
 @Component
 struct FlexExample {
-
   build() {
     Column({ space: 5 }) {
       Text('flexBasis').fontSize(9).fontColor(0xCCCCCC).width('90%')
@@ -31,11 +30,18 @@ struct FlexExample {
       // flexBasis()值可以是'auto',表示基准尺寸是元素本来的大小 ,也可以是长度设置，相当于.width()/.height()
       Flex() {
         Text('flexBasis(100)')
-          .flexBasis('100').height(100).lineHeight(70)
-          .backgroundColor(0xF5DEB3).textAlign(TextAlign.Center)
+          .flexBasis('100')
+          .height(100)
+          .lineHeight(70)
+          .backgroundColor(0xF5DEB3)
+          .textAlign(TextAlign.Center)
         Text('flexBasis("auto")')
-          .flexBasis('auto').width('60%').height(100).lineHeight(70)
-          .backgroundColor(0xD2B48C).textAlign(TextAlign.Center)
+          .flexBasis('auto')
+          .width('60%')
+          .height(100)
+          .lineHeight(70)
+          .backgroundColor(0xD2B48C)
+          .textAlign(TextAlign.Center)
       }.width('90%').height(120).padding(10).backgroundColor(0xAFEEEE)
 
       Text('flexGrow').fontSize(9).fontColor(0xCCCCCC).width('90%')
@@ -43,11 +49,17 @@ struct FlexExample {
       // flexGrow()剩余空间分配给该元素的比例
       Flex() {
         Text('flexGrow(2)')
-          .flexGrow(2).height(100).lineHeight(70)
-          .backgroundColor(0xF5DEB3).textAlign(TextAlign.Center)
+          .flexGrow(2)
+          .height(100)
+          .lineHeight(70)
+          .backgroundColor(0xF5DEB3)
+          .textAlign(TextAlign.Center)
         Text('flexGrow(1)')
-          .flexGrow(1).height(100).lineHeight(70)
-          .backgroundColor(0xD2B48C).textAlign(TextAlign.Center)
+          .flexGrow(1)
+          .height(100)
+          .lineHeight(70)
+          .backgroundColor(0xD2B48C)
+          .textAlign(TextAlign.Center)
       }.width('90%').height(120).padding(10).backgroundColor(0xAFEEEE)
 
       Text('flexShrink').fontSize(9).fontColor(0xCCCCCC).width('90%')
@@ -55,13 +67,25 @@ struct FlexExample {
       // text1比例是0,其他都是默认值1,放不下时直接等比例缩放后两个,第一个不缩放
       Flex({ direction: FlexDirection.Row }) {
         Text('flexShrink(0)')
-          .flexShrink(0).width('50%').height(100).lineHeight(70)
-          .backgroundColor(0xF5DEB3).textAlign(TextAlign.Center)
+          .flexShrink(0)
+          .width('50%')
+          .height(100)
+          .lineHeight(70)
+          .backgroundColor(0xF5DEB3)
+          .textAlign(TextAlign.Center)
         Text('no flexShrink')
-          .width('40%').height(100).lineHeight(70).backgroundColor(0xD2B48C).textAlign(TextAlign.Center)
+          .width('40%')
+          .height(100)
+          .lineHeight(70)
+          .backgroundColor(0xD2B48C)
+          .textAlign(TextAlign.Center)
         Text('flexShrink(2)')
-          .flexShrink(2).width('40%').height(100) .lineHeight(70)
-          .backgroundColor(0xF5DEB3).textAlign(TextAlign.Center)
+          .flexShrink(2)
+          .width('40%')
+          .height(100)
+          .lineHeight(70)
+          .backgroundColor(0xF5DEB3)
+          .textAlign(TextAlign.Center)
       }.width('90%').height(120).padding(10).backgroundColor(0xAFEEEE)
 
       Text('alignSelf').fontSize(9).fontColor(0xCCCCCC).width('90%')
@@ -70,8 +94,12 @@ struct FlexExample {
         Text('no alignSelf,height:80').width('33%').height(80)
           .backgroundColor(0xF5DEB3).textAlign(TextAlign.Center)
         Text('alignSelf stretch')
-          .alignSelf(ItemAlign.Stretch).width('33%').height(80).lineHeight(70)
-          .backgroundColor(0xD2B48C).textAlign(TextAlign.Center)
+          .alignSelf(ItemAlign.Stretch)
+          .width('33%')
+          .height(80)
+          .lineHeight(70)
+          .backgroundColor(0xD2B48C)
+          .textAlign(TextAlign.Center)
         Text('no alignSelf,height:100').width('34%').height(100)
           .backgroundColor(0xF5DEB3).textAlign(TextAlign.Center)
       }.width('90%').height(120).padding(10).backgroundColor(0xAFEEEE)

zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-opacity.md

@@ -10,9 +10,9 @@
 ## 属性
 
 
-| 名称      | 参数类型                                     | 描述                                       |
-| ------- | ---------------------------------------- | ---------------------------------------- |
-| opacity | number&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | 元素的不透明度，取值范围为0到1，1表示为不透明，0表示为完全透明。<br>默认值：1 |
+| 名称 | 参数类型 | 默认值 | 描述 |
+| -------- | -------- | -------- | -------- |
+| opacity | number&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource类型) | 1 | 元素的不透明度，取值范围为0到1，1表示为不透明，0表示为完全透明。<br/>**说明：**<br/>子组件可以继承父组件的此属性。。 |
 
 
 ## 示例

zh-cn/application-dev/ui/ui-js-building-ui-layout-text.md

@@ -19,8 +19,10 @@
   flex-direction: column;
   margin-top: 20px;
   margin-left: 30px;
+  font-weight: 700;
 }
 .title-text {
+  width: 95%;
   color: #1a1a1a;
   font-size: 50px;
   margin-top: 40px;
@@ -38,9 +40,11 @@
 // xxx.js
 export default {
   data: {
-    headTitle: 'Capture the Beauty in This Moment',
+    headTitle: 'Capture the Beauty in Moment',
     paragraphFirst: 'Capture the beauty of light during the transition and fusion of ice and water. At the instant of movement and stillness, softness and rigidity, force and beauty, condensing moving moments.',
     paragraphSecond: 'Reflecting the purity of nature, the innovative design upgrades your visual entertainment and ergonomic comfort. Effortlessly capture what you see and let it speak for what you feel.',
   },
 }
 ```
+
+  ![zh-cn_image_0000001118642600](figures/zh-cn_image_0000001118642600.PNG)  
\ No newline at end of file

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

@@ -108,9 +108,9 @@ export default {
 ![zh-cn_image_0000001227135613](figures/zh-cn_image_0000001227135613.gif)
 
 
-## 添加grild-col
+## 添加grid-col
 
-创建grid-container组件并添加grid-row，在grid-row组件内添加grild-col组件形成布局。
+创建grid-container组件并添加grid-row，在grid-row组件内添加grid-col组件形成布局。
 
 
 ```html

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

 # OffscreenCanvasRenderingContext2D对象
 
-使用OffscreenCanvas在离屏Canvas画布组件上进行绘制，绘制对象可以是矩形、文本、图片等。具体请参考[OffscreenCanvasRenderingContext2D对象](../reference/arkui-js/js-offscreencanvasrenderingcontext2d.md)。
+使用OffscreenCanvas在离屏Canvas画布组件上进行绘制，绘制对象可以是矩形、文本、图片等。 离屏，即GPU在当前缓冲区以外新开辟的一个缓冲区。 具体请参考[OffscreenCanvasRenderingContext2D对象](../reference/arkui-js/js-offscreencanvasrenderingcontext2d.md)。
 
 以下示例创建了一个OffscreenCanvas画布，再在画布上创建一个getContext2d对象，并设置filter属性改变图片样式。