update semicolon

Signed-off-by: Nyamila <tianyu55@huawei.com>

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

@@ -64,7 +64,7 @@ struct GaugeExample {
       
       // 参数设置当前值为75，属性设置值为25，属性设置优先级高
       Gauge({ value: 75 })
-        .value(25) //属性和参数都设置时以参数为准
+        .value(25) // 属性和参数都设置时以参数为准
         .width(200).height(200)
         .colors([[0x317AF7, 1], [0x5BA854, 1], [0xE08C3A, 1], [0x9C554B, 1]])
       

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

@@ -353,17 +353,17 @@ struct ImageExample3 {
 ###  渲染沙箱路径图片
 
 ```
-import fileio from '@ohos.fileio';
-import image from '@ohos.multimedia.image';
+import fileio from '@ohos.fileio'
+import image from '@ohos.multimedia.image'
 
-const EMPTY_PATH = 'file://';
+const EMPTY_PATH = 'file://'
 
 @Entry
 @Component
 struct LoadImageExample {
-  @State fileContent: string = '';
-  @State path: string = EMPTY_PATH;
-  @State accountInfoHeadPic: any = '';
+  @State fileContent: string = ''
+  @State path: string = EMPTY_PATH
+  @State accountInfoHeadPic: any = ''
 
   build() {
     Column() {
@@ -371,22 +371,22 @@ struct LoadImageExample {
         .margin({ bottom: 10 })
         .onClick(() => {
           try {
-            this.path = EMPTY_PATH;
-            let context = getContext(this);
-            let path = context.getApplicationContext().filesDir + '/icon.png';
-            console.log(`读取沙箱图片=========>${path}`);
-            let fd = fileio.openSync(path, 0o100, 0o666);
-            console.log(`create file========>${fd}`);
-            let srcPath = context.bundleCodeDir + '/entry/resource/base/media/icon.png';
-            fileio.copyFileSync(srcPath, path);
-            console.log(`error:=============>${e.message}`);
+            this.path = EMPTY_PATH
+            let context = getContext(this)
+            let path = context.getApplicationContext().filesDir + '/icon.png'
+            console.log(`读取沙箱图片=========>${path}`)
+            let fd = fileio.openSync(path, 0o100, 0o666)
+            console.log(`create file========>${fd}`)
+            let srcPath = context.bundleCodeDir + '/entry/resource/base/media/icon.png'
+            fileio.copyFileSync(srcPath, path)
+            console.log(`error:=============>${e.message}`)
           }
         })
       Button('读取资源图片')
         .margin({ bottom: 10 })
         .onClick(() => {
           this.path = EMPTY_PATH;
-          this.path += getContext(this.bundleCodeDir + '/entry/resource/base/media/icon.png');
+          this.path += getContext(this.bundleCodeDir + '/entry/resource/base/media/icon.png')
         })
       Text(`图片路径:${this.path}`)
         .fontSize(20)

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

@@ -66,9 +66,9 @@ reset(): void
 @Entry
 @Component
 struct PatternLockExample {
-  @State passwords: Number[] = [];
-  @State message: string = 'please input password!';
-  private patternLockController: PatternLockController = new PatternLockController();
+  @State passwords: Number[] = []
+  @State message: string = 'please input password!'
+  private patternLockController: PatternLockController = new PatternLockController()
 
   build() {
     Column() {
@@ -85,29 +85,29 @@ struct PatternLockExample {
         .onPatternComplete((input: Array<number>) => {
           // 输入的密码长度小于5时，提示重新输入
           if (input === null || input === undefined || input.length < 5) {
-            this.message = 'The password length needs to be greater than 5, please enter again.';
-            return;
+            this.message = 'The password length needs to be greater than 5, please enter again.'
+            return
           }
           // 判断密码长度是否大于0
           if (this.passwords.length > 0) {
             // 判断两次输入的密码是否相同，相同则提示密码设置成功，否则提示重新输入
             if (this.passwords.toString() === input.toString()) {
-              this.passwords = input;
-              this.message = 'Set password successfully: ' + this.passwords.toString();
+              this.passwords = input
+              this.message = 'Set password successfully: ' + this.passwords.toString()
             } else {
-              this.message = 'Inconsistent passwords, please enter again.';
+              this.message = 'Inconsistent passwords, please enter again.'
             }
           } else {
             // 提示第二次输入密码
-            this.passwords = input;
-            this.message = "Please enter again.";
+            this.passwords = input
+            this.message = "Please enter again."
           }
         })
       Button('Reset PatternLock').margin(30).onClick(() => {
         // 重置密码锁
-        this.patternLockController.reset();
-        this.passwords = [];
-        this.message = 'Please input password';
+        this.patternLockController.reset()
+        this.passwords = []
+        this.message = 'Please input password'
       })
     }.width('100%').height('100%')
   }

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

@@ -75,9 +75,9 @@ caretPosition(value: number): void
 @Entry
 @Component
 struct SearchExample {
-  @State changeValue: string = '';
-  @State submitValue: string = '';
-  controller: SearchController = new SearchController();
+  @State changeValue: string = ''
+  @State submitValue: string = ''
+  controller: SearchController = new SearchController()
 
   build() {
     Column() {
@@ -92,16 +92,16 @@ struct SearchExample {
         .placeholderFont({ size: 14, weight: 400 })
         .textFont({ size: 14, weight: 400 })
         .onSubmit((value: string) => {
-          this.submitValue = value;
+          this.submitValue = value
         })
         .onChange((value: string) => {
-          this.changeValue = value;
+          this.changeValue = value
         })
         .margin(20)
       Button('Set caretPosition 1')
         .onClick(() => {
           // 设置光标位置到输入的第一个字符后
-          this.controller.caretPosition(1);
+          this.controller.caretPosition(1)
         })
     }.width('100%')
   }

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

@@ -75,14 +75,14 @@ Slider(options?: {value?: number, min?: number, max?: number, step?: number, sty
 @Entry
 @Component
 struct SliderExample {
-  @State outSetValueOne: number = 40;
-  @State inSetValueOne: number = 40;
-  @State outSetValueTwo: number = 40;
-  @State inSetValueTwo: number = 40;
-  @State vOutSetValueOne: number = 40;
-  @State vInSetValueOne: number = 40;
-  @State vOutSetValueTwo: number = 40;
-  @State vInSetValueTwo: number = 40;
+  @State outSetValueOne: number = 40
+  @State inSetValueOne: number = 40
+  @State outSetValueTwo: number = 40
+  @State inSetValueTwo: number = 40
+  @State vOutSetValueOne: number = 40
+  @State vInSetValueOne: number = 40
+  @State vOutSetValueTwo: number = 40
+  @State vInSetValueTwo: number = 40
 
   build() {
     Column({ space: 8 }) {
@@ -96,8 +96,8 @@ struct SliderExample {
         })
           .showTips(true)
           .onChange((value: number, mode: SliderChangeMode) => {
-            this.outSetValueOne = value;
-            console.info('value:' + value + 'mode:' + mode.toString());
+            this.outSetValueOne = value
+            console.info('value:' + value + 'mode:' + mode.toString())
           })
         // toFixed(0)将滑动条返回值处理为整数精度
         Text(this.outSetValueOne.toFixed(0)).fontSize(12)
@@ -111,8 +111,8 @@ struct SliderExample {
         })
           .showSteps(true)
           .onChange((value: number, mode: SliderChangeMode) => {
-            this.outSetValueTwo = value;
-            console.info('value:' + value + 'mode:' + mode.toString());
+            this.outSetValueTwo = value
+            console.info('value:' + value + 'mode:' + mode.toString())
           })
         Text(this.outSetValueTwo.toFixed(0)).fontSize(12)
       }
@@ -131,8 +131,8 @@ struct SliderExample {
           .selectedColor('#4169E1')
           .showTips(true)
           .onChange((value: number, mode: SliderChangeMode) => {
-            this.inSetValueOne = value;
-            console.info('value:' + value + 'mode:' + mode.toString());
+            this.inSetValueOne = value
+            console.info('value:' + value + 'mode:' + mode.toString())
           })
         Text(this.inSetValueOne.toFixed(0)).fontSize(12)
       }
@@ -148,8 +148,8 @@ struct SliderExample {
           .selectedColor('#4169E1')
           .showSteps(true)
           .onChange((value: number, mode: SliderChangeMode) => {
-            this.inSetValueTwo = value;
-            console.info('value:' + value + 'mode:' + mode.toString());
+            this.inSetValueTwo = value
+            console.info('value:' + value + 'mode:' + mode.toString())
           })
         Text(this.inSetValueTwo.toFixed(0)).fontSize(12)
       }
@@ -169,8 +169,8 @@ struct SliderExample {
               .selectedColor('#4169E1')
               .showTips(true)
               .onChange((value: number, mode: SliderChangeMode) => {
-                this.vOutSetValueOne = value;
-                console.info('value:' + value + 'mode:' + mode.toString());
+                this.vOutSetValueOne = value
+                console.info('value:' + value + 'mode:' + mode.toString())
               })
             Slider({
               value: this.vOutSetValueTwo,
@@ -183,8 +183,8 @@ struct SliderExample {
               .selectedColor('#4169E1')
               .showSteps(true)
               .onChange((value: number, mode: SliderChangeMode) => {
-                this.vOutSetValueTwo = value;
-                console.info('value:' + value + 'mode:' + mode.toString());
+                this.vOutSetValueTwo = value
+                console.info('value:' + value + 'mode:' + mode.toString())
               })
           }
         }.width('50%').height(300)
@@ -200,8 +200,8 @@ struct SliderExample {
             })
               .showTips(true)
               .onChange((value: number, mode: SliderChangeMode) => {
-                this.vInSetValueOne = value;
-                console.info('value:' + value + 'mode:' + mode.toString());
+                this.vInSetValueOne = value
+                console.info('value:' + value + 'mode:' + mode.toString())
               })
             Slider({
               value: this.vInSetValueTwo,
@@ -212,8 +212,8 @@ struct SliderExample {
             })
               .showSteps(true)
               .onChange((value: number, mode: SliderChangeMode) => {
-                this.vInSetValueTwo = value;
-                console.info('value:' + value + 'mode:' + mode.toString());
+                this.vInSetValueTwo = value
+                console.info('value:' + value + 'mode:' + mode.toString())
               })
           }
         }.width('50%').height(300)

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

@@ -48,10 +48,10 @@ Stepper(value?: { index?: number })
 @Entry
 @Component
 struct StepperExample {
-  @State currentIndex: number = 0;
-  @State firstState: ItemState = ItemState.Normal;
-  @State secondState: ItemState = ItemState.Normal;
-  @State thirdState: ItemState = ItemState.Normal;
+  @State currentIndex: number = 0
+  @State firstState: ItemState = ItemState.Normal
+  @State secondState: ItemState = ItemState.Normal
+  @State thirdState: ItemState = ItemState.Normal
 
   build() {
     Stepper({
@@ -67,7 +67,7 @@ struct StepperExample {
             .margin({ top: 250, bottom: 50 })
           Button('change status:' + this.firstState)
             .onClick(() => {
-              this.firstState = this.firstState === ItemState.Skip ? ItemState.Normal : ItemState.Skip;
+              this.firstState = this.firstState === ItemState.Skip ? ItemState.Normal : ItemState.Skip
             })
         }.width('100%')
       }
@@ -83,7 +83,7 @@ struct StepperExample {
             .margin({ top: 250, bottom: 50 })
           Button('change status:' + this.secondState)
             .onClick(() => {
-              this.secondState = this.secondState === ItemState.Disabled ? ItemState.Normal : ItemState.Disabled;
+              this.secondState = this.secondState === ItemState.Disabled ? ItemState.Normal : ItemState.Disabled
             })
         }.width('100%')
       }
@@ -100,7 +100,7 @@ struct StepperExample {
             .margin({ top: 250, bottom: 50 })
           Button('change status:' + this.thirdState)
             .onClick(() => {
-              this.thirdState = this.thirdState === ItemState.Waiting ? ItemState.Normal : ItemState.Waiting;
+              this.thirdState = this.thirdState === ItemState.Waiting ? ItemState.Normal : ItemState.Waiting
             })
         }.width('100%')
       }
@@ -119,14 +119,14 @@ struct StepperExample {
     }
     .onFinish(() => {
       // 此处可处理点击最后一页的Finish时的逻辑，例如路由跳转等
-      console.info('onFinish');
+      console.info('onFinish')
     })
     .onSkip(() => {
       // 此处可处理点击跳过时的逻辑，例如动态修改Stepper的index值使其跳转到某一步骤页等
-      console.info('onSkip');
+      console.info('onSkip')
     })
     .onChange((prevIndex: number, index: number) => {
-      this.currentIndex = index;
+      this.currentIndex = index
     })
   }
 }

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

@@ -85,7 +85,7 @@ struct TextAreaExample {
 
   build() {
     Column() {
-      TextArea({ placeholder: 'input your word', controller: this.controller })
+      TextArea({ placeholder: 'The text area can hold an unlimited amount of text. input your word', controller: this.controller })
         .placeholderFont({ size: 14, weight: 400 })
         .width(400)
         .height(50)

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

@@ -112,8 +112,8 @@ caretPosition(value: number): void
 @Entry
 @Component
 struct TextInputExample {
-  @State text: string = '';
-  controller: TextInputController = new TextInputController();
+  @State text: string = ''
+  controller: TextInputController = new TextInputController()
 
   build() {
     Column() {
@@ -127,14 +127,14 @@ struct TextInputExample {
         .fontSize(14)
         .fontColor(Color.Black)
         .onChange((value: string) => {
-          this.text = value;
+          this.text = value
         })
       Text(this.text)
       Button('Set caretPosition 1')
         .margin(15)
         .onClick(() => {
           // 将光标移动至第一个字符后
-          this.controller.caretPosition(1);
+          this.controller.caretPosition(1)
         })
       // 密码输入框
       TextInput({ placeholder: 'input your password...' })

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

@@ -107,7 +107,7 @@ getXComponentContext()
 
 ```ts
 // xxx.ets
-import camera from '@ohos.multimedia.camera';
+import camera from '@ohos.multimedia.camera'
 @Entry
 @Component
 struct PreviewArea {
@@ -122,9 +122,9 @@ struct PreviewArea {
       })
         .onLoad(() => {
           this.xcomponentController.setXComponentSurfaceSize({surfaceWidth:1920,surfaceHeight:1080});
-          this.surfaceId = this.xcomponentController.getXComponentSurfaceId();
+          this.surfaceId = this.xcomponentController.getXComponentSurfaceId()
           camera.createPreviewOutput(this.surfaceId).then((previewOutput) => {
-            console.log('Promise returned with the PreviewOutput instance');
+            console.log('Promise returned with the PreviewOutput instance')
           })
         })
         .width('640px')

zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-longpressgesture.md

@@ -36,7 +36,7 @@ LongPressGesture(value?: { fingers?: number, repeat?: boolean, duration?: number
 @Entry
 @Component
 struct LongPressGestureExample {
-  @State count: number = 0;
+  @State count: number = 0
 
   build() {
     Column() {
@@ -47,12 +47,12 @@ struct LongPressGestureExample {
           // 由于repeat设置为true，长按动作存在时会连续触发，触发间隔为duration（默认值500ms）
           .onAction((event: GestureEvent) => {
             if (event.repeat) {
-              this.count++;
+              this.count++
             }
           })
             // 长按动作一结束触发
           .onActionEnd(() => {
-            this.count = 0;
+            this.count = 0
           })
         )
     }

zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-pangesture.md

@@ -75,11 +75,11 @@ PanGestureOptions(value?: { fingers?: number; direction?: PanDirection; distance
 @Entry
 @Component
 struct PanGestureExample {
-  @State offsetX: number = 0;
-  @State offsetY: number = 0;
-  @State positionX: number = 0;
-  @State positionY: number = 0;
-  private panOption: PanGestureOptions = new PanGestureOptions({ direction: PanDirection.Left | PanDirection.Right });
+  @State offsetX: number = 0
+  @State offsetY: number = 0
+  @State positionX: number = 0
+  @State positionY: number = 0
+  private panOption: PanGestureOptions = new PanGestureOptions({ direction: PanDirection.Left | PanDirection.Right })
 
   build() {
     Column() {
@@ -96,24 +96,24 @@ struct PanGestureExample {
       .gesture(
       PanGesture(this.panOption)
         .onActionStart((event: GestureEvent) => {
-          console.info('Pan start');
+          console.info('Pan start')
         })
         .onActionUpdate((event: GestureEvent) => {
-          this.offsetX = this.positionX + event.offsetX;
-          this.offsetY = this.positionY + event.offsetY;
+          this.offsetX = this.positionX + event.offsetX
+          this.offsetY = this.positionY + event.offsetY
         })
         .onActionEnd(() => {
-          this.positionX = this.offsetX;
-          this.positionY = this.offsetY;
-          console.info('Pan end');
+          this.positionX = this.offsetX
+          this.positionY = this.offsetY
+          console.info('Pan end')
         })
       )
 
       Button('修改PanGesture触发条件')
         .onClick(() => {
           // 将PanGesture手势事件触发条件改为双指以任意方向拖动
-          this.panOption.setDirection(PanDirection.All);
-          this.panOption.setFingers(2);
+          this.panOption.setDirection(PanDirection.All)
+          this.panOption.setFingers(2)
         })
     }
   }

zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-pinchgesture.md

@@ -36,10 +36,10 @@ PinchGesture(value?: { fingers?: number, distance?: number })
 @Entry
 @Component
 struct PinchGestureExample {
-  @State scaleValue: number = 1;
-  @State pinchValue: number = 1;
-  @State pinchX: number = 0;
-  @State pinchY: number = 0;
+  @State scaleValue: number = 1
+  @State pinchValue: number = 1
+  @State pinchX: number = 0
+  @State pinchY: number = 0
 
   build() {
     Column() {
@@ -57,16 +57,16 @@ struct PinchGestureExample {
       .gesture(
       PinchGesture({ fingers: 3 })
         .onActionStart((event: GestureEvent) => {
-          console.info('Pinch start');
+          console.info('Pinch start')
         })
         .onActionUpdate((event: GestureEvent) => {
-          this.scaleValue = this.pinchValue * event.scale;
-          this.pinchX = event.pinchCenterX;
-          this.pinchY = event.pinchCenterY;
+          this.scaleValue = this.pinchValue * event.scale
+          this.pinchX = event.pinchCenterX
+          this.pinchY = event.pinchCenterY
         })
         .onActionEnd(() => {
-          this.pinchValue = this.scaleValue;
-          console.info('Pinch end');
+          this.pinchValue = this.scaleValue
+          console.info('Pinch end')
         })
       )
     }.width('100%')

zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-rotationgesture.md

@@ -36,8 +36,8 @@ RotationGesture(value?: { fingers?: number, angle?: number })
 @Entry
 @Component
 struct RotationGestureExample {
-  @State angle: number = 0;
-  @State rotateValue: number = 0;
+  @State angle: number = 0
+  @State rotateValue: number = 0
 
   build() {
     Column() {
@@ -54,14 +54,14 @@ struct RotationGestureExample {
       .gesture(
       RotationGesture()
         .onActionStart((event: GestureEvent) => {
-          console.info('Rotation start');
+          console.info('Rotation start')
         })
         .onActionUpdate((event: GestureEvent) => {
-          this.angle = this.rotateValue + event.angle;
+          this.angle = this.rotateValue + event.angle
         })
         .onActionEnd(() => {
-          this.rotateValue = this.angle;
-          console.info('Rotation end');
+          this.rotateValue = this.angle
+          console.info('Rotation end')
         })
       )
     }.width('100%')

zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-swipegesture.md

@@ -42,8 +42,8 @@ SwipeGesture(value?: { fingers?: number; direction?: SwipeDirection; speed?: num
 @Entry
 @Component
 struct SwipeGestureExample {
-  @State rotateAngle: number = 0;
-  @State speed: number = 1;
+  @State rotateAngle: number = 0
+  @State speed: number = 1
 
   build() {
     Column() {
@@ -60,8 +60,8 @@ struct SwipeGestureExample {
       .gesture(
       SwipeGesture({ direction: SwipeDirection.Vertical })
         .onAction((event: GestureEvent) => {
-          this.speed = event.speed;
-          this.rotateAngle = event.angle;
+          this.speed = event.speed
+          this.rotateAngle = event.angle
         })
       )
     }.width('100%')

zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-tapgesture.md

@@ -33,7 +33,7 @@ TapGesture(value?: { count?: number, fingers?: number })
 @Entry
 @Component
 struct TapGestureExample {
-  @State value: string = '';
+  @State value: string = ''
 
   build() {
     Column() {
@@ -42,7 +42,7 @@ struct TapGestureExample {
         .gesture(
         TapGesture({ count: 2 })
           .onAction((event: GestureEvent) => {
-            this.value = JSON.stringify(event.fingerList[0]);
+            this.value = JSON.stringify(event.fingerList[0])
           })
         )
       Text(this.value)

zh-cn/application-dev/reference/arkui-ts/ts-combined-gestures.md

@@ -39,12 +39,12 @@ GestureGroup(mode: GestureMode, ...gesture: GestureType[])
 @Entry
 @Component
 struct GestureGroupExample {
-  @State count: number = 0;
-  @State offsetX: number = 0;
-  @State offsetY: number = 0;
-  @State positionX: number = 0;
-  @State positionY: number = 0;
-  @State borderStyles: BorderStyle = BorderStyle.Solid;
+  @State count: number = 0
+  @State offsetX: number = 0
+  @State offsetY: number = 0
+  @State positionX: number = 0
+  @State positionY: number = 0
+  @State borderStyles: BorderStyle = BorderStyle.Solid
 
   build() {
     Column() {
@@ -57,37 +57,37 @@ struct GestureGroupExample {
     .margin(20)
     .border({ width: 3, style: this.borderStyles })
     .gesture(
-      //以下组合手势为顺序识别，当长按手势事件未正常触发时则不会触发拖动手势事件
+      // 以下组合手势为顺序识别，当长按手势事件未正常触发时则不会触发拖动手势事件
     GestureGroup(GestureMode.Sequence,
     LongPressGesture({ repeat: true })
       .onAction((event: GestureEvent) => {
         if (event.repeat) {
-          this.count++;
+          this.count++
         }
-        console.info('LongPress onAction');
+        console.info('LongPress onAction')
       })
       .onActionEnd(() => {
-        console.info('LongPress end');
+        console.info('LongPress end')
       }),
     PanGesture()
       .onActionStart(() => {
-        this.borderStyles = BorderStyle.Dashed;
-        console.info('pan start');
+        this.borderStyles = BorderStyle.Dashed
+        console.info('pan start')
       })
       .onActionUpdate((event: GestureEvent) => {
-        this.offsetX = this.positionX + event.offsetX;
-        this.offsetY = this.positionY + event.offsetY;
-        console.info('pan update');
+        this.offsetX = this.positionX + event.offsetX
+        this.offsetY = this.positionY + event.offsetY
+        console.info('pan update')
       })
       .onActionEnd(() => {
-        this.positionX = this.offsetX;
-        this.positionY = this.offsetY;
-        this.borderStyles = BorderStyle.Solid;
-        console.info('pan end');
+        this.positionX = this.offsetX
+        this.positionY = this.offsetY
+        this.borderStyles = BorderStyle.Solid
+        console.info('pan end')
       })
     )
       .onCancel(() => {
-        console.info('sequence gesture canceled');
+        console.info('sequence gesture canceled')
       })
     )
   }

zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-imagebitmap.md

@@ -10,10 +10,10 @@ ImageBitmap对象可以存储canvas渲染的像素数据。
 
 ## 属性
 
-| 属性 | 类型 | 描述 | 
+| 属性 | 类型 | 描述 |
 | -------- | -------- | -------- |
-| width | number | ImageBitmap的像素宽度。 | 
-| height | number | ImageBitmap的像素高度。 | 
+| width | number | ImageBitmap的像素宽度。 |
+| height | number | ImageBitmap的像素高度。 |
 
 **示例：**
 
@@ -22,9 +22,9 @@ ImageBitmap对象可以存储canvas渲染的像素数据。
   @Entry
   @Component
   struct ImageExample {
-    private settings: RenderingContextSettings = new RenderingContextSettings(true);
-    private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
-    private img:ImageBitmap = new ImageBitmap("common/images/example.jpg");
+    private settings: RenderingContextSettings = new RenderingContextSettings(true)
+    private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
+    private img:ImageBitmap = new ImageBitmap("common/images/example.jpg")
 
     build() {
       Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
@@ -33,7 +33,7 @@ ImageBitmap对象可以存储canvas渲染的像素数据。
           .height('100%')
           .backgroundColor('#ffff00')
           .onReady(() =>{
-            this.context.drawImage( this.img,0,0,500,500,0,0,400,200);
+            this.context.drawImage( this.img,0,0,500,500,0,0,400,200)
         })
       }
       .width('100%')

zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-imagedata.md

@@ -10,11 +10,11 @@ ImageData对象可以存储canvas渲染的像素数据。
 
 ## 属性
 
-| 属性 | 类型 | 描述 | 
+| 属性 | 类型 | 描述 |
 | -------- | -------- | -------- |
-| width | number | 矩形区域实际像素宽度。 | 
-| height | number | 矩形区域实际像素高度。 | 
-| data | Uint8ClampedArray | 一维数组，保存了相应的颜色数据，数据值范围为0到255。 | 
+| width | number | 矩形区域实际像素宽度。 |
+| height | number | 矩形区域实际像素高度。 |
+| data | Uint8ClampedArray | 一维数组，保存了相应的颜色数据，数据值范围为0到255。 |
 
 **示例：**
 
@@ -23,8 +23,8 @@ ImageData对象可以存储canvas渲染的像素数据。
 @Entry
 @Component
 struct Translate {
-  private settings: RenderingContextSettings = new RenderingContextSettings(true);
-  private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
+  private settings: RenderingContextSettings = new RenderingContextSettings(true)
+  private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
   private img:ImageBitmap = new ImageBitmap("/common/images/1234.png")
 
   build() {
@@ -34,9 +34,9 @@ struct Translate {
         .height('100%')
         .backgroundColor('#ffff00')
         .onReady(() =>{
-          this.context.drawImage(this.img,0,0,130,130);
-          var imagedata = this.context.getImageData(50,50,130,130);
-          this.context.putImageData(imagedata,150,150);
+          this.context.drawImage(this.img,0,0,130,130)
+          var imagedata = this.context.getImageData(50,50,130,130)
+          this.context.putImageData(imagedata,150,150)
         })
     }
     .width('100%')

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

@@ -65,10 +65,10 @@ struct MyComponent {
               },
           })
           .onConnect(() => {
-              console.log('AbilityComponent connect');
+              console.log('AbilityComponent connect')
           })
           .onDisconnect(() => {
-              console.log('AbilityComponent disconnect');
+              console.log('AbilityComponent disconnect')
           })
       }
   }

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

@@ -6,10 +6,6 @@
 > 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
-
-
-
-
 ## 子组件
 
 可以包含子组件。
@@ -24,10 +20,10 @@ Counter()
 
 不支持通用事件和手势， 仅支持如下事件：
 
-| 名称 | 功能描述 | 
+| 名称 | 功能描述 |
 | -------- | -------- |
-| onInc(event: () => void) | 监听数值增加事件。 | 
-| onDec(event: () => void) | 监听数值减少事件。 | 
+| onInc(event: () => void) | 监听数值增加事件。 |
+| onDec(event: () => void) | 监听数值减少事件。 |
 
 
 ## 示例

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

@@ -168,8 +168,8 @@ scrollBy(dx: Length, dy: Length): void
 @Entry
 @Component
 struct ScrollExample {
-  scroller: Scroller = new Scroller();
-  private arr: number[] = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
+  scroller: Scroller = new Scroller()
+  private arr: number[] = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
 
   build() {
     Stack({ alignContent: Alignment.TopStart }) {
@@ -193,33 +193,33 @@ struct ScrollExample {
       .scrollBarWidth(30) // 滚动条宽度
       .edgeEffect(EdgeEffect.None)
       .onScroll((xOffset: number, yOffset: number) => {
-        console.info(xOffset + ' ' + yOffset);
+        console.info(xOffset + ' ' + yOffset)
       })
       .onScrollEdge((side: Edge) => {
-        console.info('To the edge');
+        console.info('To the edge')
       })
       .onScrollEnd(() => {
-        console.info('Scroll Stop');
+        console.info('Scroll Stop')
       })
 
       Button('scroll 150')
         .onClick(() => { // 点击后下滑指定距离150.0vp
-          this.scroller.scrollBy(0,150);
+          this.scroller.scrollBy(0,150)
         })
         .margin({ top: 10, left: 20 })
       Button('scroll 100')
         .onClick(() => { // 点击后滑动到指定位置，即下滑100.0vp的距离
-          this.scroller.scrollTo({ xOffset: 0, yOffset: this.scroller.currentOffset().yOffset + 100 });
+          this.scroller.scrollTo({ xOffset: 0, yOffset: this.scroller.currentOffset().yOffset + 100 })
         })
         .margin({ top: 60, left: 20 })
       Button('back top')
         .onClick(() => { // 点击后回到顶部
-          this.scroller.scrollEdge(Edge.Top);
+          this.scroller.scrollEdge(Edge.Top)
         })
         .margin({ top: 110, left: 20 })
       Button('next page')
         .onClick(() => { // 点击后滑到下一页
-          this.scroller.scrollPage({ next: true });
+          this.scroller.scrollPage({ next: true })
         })
         .margin({ top: 170, left: 20 })
     }.width('100%').height('100%').backgroundColor(0xDCDCDC)
@@ -235,8 +235,8 @@ struct ScrollExample {
 @Component
 struct NestedScroll {
   @State listPosition: number = 0; // 0代表滚动到List顶部，1代表中间值，2代表滚动到List底部。
-  private arr: number[] = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
-  private scroller: Scroller = new Scroller();
+  private arr: number[] = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
+  private scroller: Scroller = new Scroller()
 
   build() {
     Flex() {
@@ -257,17 +257,17 @@ struct NestedScroll {
           }
           .width("100%").height("50%").edgeEffect(EdgeEffect.None)
           .onReachStart(() => {
-            this.listPosition = 0;
+            this.listPosition = 0
           })
           .onReachEnd(() => {
-            this.listPosition = 2;
+            this.listPosition = 2
           })
           .onScrollBegin((dx: number, dy: number) => {
             if ((this.listPosition == 0 && dy >= 0) || (this.listPosition == 2 && dy <= 0)) {
-              this.scroller.scrollBy(0, -dy);
-              return { dxRemain: dx, dyRemain: 0 };
+              this.scroller.scrollBy(0, -dy)
+              return { dxRemain: dx, dyRemain: 0 }
             }
-            this.listPosition = 1;
+            this.listPosition = 1
             return { dxRemain: dx, dyRemain: dy };
           })
 

zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-shape.md

@@ -152,12 +152,12 @@ struct ShapeExample {
 @Entry
 @Component
 struct ShapeMeshExample {
-  @State columnVal: number = 0;
-  @State rowVal: number = 0;
-  @State count: number = 0;
-  @State verts: Array<number> = [];
-  @State shapeWidth: number = 600;
-  @State shapeHeight: number = 600;
+  @State columnVal: number = 0
+  @State rowVal: number = 0
+  @State count: number = 0
+  @State verts: Array<number> = []
+  @State shapeWidth: number = 600
+  @State shapeHeight: number = 600
 
   build() {
     Column() {
@@ -186,34 +186,34 @@ struct ShapeMeshExample {
       .height(this.shapeHeight + 'px')
       // 手指触摸Shape组件时会显示mesh扭曲效果
       .onTouch((event: TouchEvent) => {
-        var touchX = event.touches[0].x * 2;
-        var touchY = event.touches[0].y * 2;
-        this.columnVal = 20;
-        this.rowVal = 20;
-        this.count = (this.columnVal + 1) * (this.rowVal + 1);
-        var orig = [this.count * 2];
-        var index = 0;
+        var touchX = event.touches[0].x * 2
+        var touchY = event.touches[0].y * 2
+        this.columnVal = 20
+        this.rowVal = 20
+        this.count = (this.columnVal + 1) * (this.rowVal + 1)
+        var orig = [this.count * 2]
+        var index = 0
         for (var i = 0; i <= this.rowVal; i++) {
-          var fy = this.shapeWidth * i / this.rowVal;
+          var fy = this.shapeWidth * i / this.rowVal
           for (var j = 0; j <= this.columnVal; j++) {
-            var fx = this.shapeWidth * j / this.columnVal;
-            orig[index * 2 + 0] = this.verts[index * 2 + 0] = fx;
-            orig[index * 2 + 1] = this.verts[index * 2 + 1] = fy;
+            var fx = this.shapeWidth * j / this.columnVal
+            orig[index * 2 + 0] = this.verts[index * 2 + 0] = fx
+            orig[index * 2 + 1] = this.verts[index * 2 + 1] = fy
             index++;
           }
         }
         for (var k = 0; k < this.count * 2; k += 2) {
-          var dx = touchX - orig[k + 0];
-          var dy = touchY - orig[k + 1];
-          var dd = dx * dx + dy * dy;
-          var d = Math.sqrt(dd);
-          var pull = 80000 / (dd * d);
+          var dx = touchX - orig[k + 0]
+          var dy = touchY - orig[k + 1]
+          var dd = dx * dx + dy * dy
+          var d = Math.sqrt(dd)
+          var pull = 80000 / (dd * d)
           if (pull >= 1) {
-            this.verts[k + 0] = touchX;
-            this.verts[k + 1] = touchY;
+            this.verts[k + 0] = touchX
+            this.verts[k + 1] = touchY
           } else {
-            this.verts[k + 0] = orig[k + 0] + dx * pull;
-            this.verts[k + 1] = orig[k + 1] + dy * pull;
+            this.verts[k + 0] = orig[k + 0] + dx * pull
+            this.verts[k + 1] = orig[k + 1] + dy * pull
           }
         }
       })

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

@@ -85,8 +85,8 @@
 @Entry
 @Component
 struct GestureSettingsExample {
-  @State priorityTestValue: string = '';
-  @State parallelTestValue: string = '';
+  @State priorityTestValue: string = ''
+  @State parallelTestValue: string = ''
 
   build() {
     Column() {
@@ -95,7 +95,7 @@ struct GestureSettingsExample {
           .gesture(
           TapGesture()
             .onAction(() => {
-              this.priorityTestValue += '\nText';
+              this.priorityTestValue += '\nText'
             }))
       }
       .height(200)
@@ -107,7 +107,7 @@ struct GestureSettingsExample {
       .priorityGesture(
       TapGesture()
         .onAction((event: GestureEvent) => {
-          this.priorityTestValue += '\nColumn';
+          this.priorityTestValue += '\nColumn'
         }), GestureMask.IgnoreInternal)
 
       Column() {
@@ -115,7 +115,7 @@ struct GestureSettingsExample {
           .gesture(
           TapGesture()
             .onAction(() => {
-              this.parallelTestValue += '\nText';
+              this.parallelTestValue += '\nText'
             }))
       }
       .height(200)
@@ -127,7 +127,7 @@ struct GestureSettingsExample {
       .parallelGesture(
       TapGesture()
         .onAction((event: GestureEvent) => {
-          this.parallelTestValue += '\nColumn';
+          this.parallelTestValue += '\nColumn'
         }), GestureMask.Normal)
     }
   }

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

@@ -41,13 +41,13 @@ struct TimePickerDialogExample {
             onAccept: (value: TimePickerResult) => {
               // 设置selectTime为按下确定按钮时的时间，这样当弹窗再次弹出时显示选中的为上一次确定的时间
               this.selectTime.setHours(value.hour, value.minute)
-              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))
             }
           })
         })
@@ -59,13 +59,13 @@ struct TimePickerDialogExample {
             useMilitaryTime: true,
             onAccept: (value: TimePickerResult) => {
               this.selectTime.setHours(value.hour, value.minute)
-              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))
             }
           })
         })

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

@@ -67,8 +67,8 @@ struct FillStyleExample {
         .onReady(() =>{
           this.offContext.fillStyle = '#0000ff'
           this.offContext.fillRect(20, 160, 150, 100)
-          var image = this.offContext.transferToImageBitmap();
-          this.context.transferFromImageBitmap(image);
+          var image = this.offContext.transferToImageBitmap()
+          this.context.transferFromImageBitmap(image)
         })
     }
     .width('100%')
@@ -445,8 +445,8 @@ struct LineDashOffset {
         .onReady(() =>{
           this.offContext.arc(100, 75, 50, 0, 6.28)
           this.offContext.setLineDash([10,20])
-          this.offContext.lineDashOffset = 10.0;
-          this.offContext.stroke();
+          this.offContext.lineDashOffset = 10.0
+          this.offContext.stroke()
           var image = this.offContext.transferToImageBitmap()
           this.context.transferFromImageBitmap(image)
       })
@@ -1016,7 +1016,7 @@ stroke(path?: Path2D): void
 | path | [Path2D](ts-components-canvas-path2d.md) | 否    | null | 需要绘制的Path2D。 |
 
  **示例：**
- 
+
   ```ts
   // xxx.ets
   @Entry
@@ -1373,10 +1373,10 @@ quadraticCurveTo(cpx: number, cpy: number, x: number, y: number): void
           .height('100%')
           .backgroundColor('#ffff00')
           .onReady(() =>{
-            this.offContext.beginPath();
-            this.offContext.moveTo(20, 20);
-            this.offContext.quadraticCurveTo(100, 100, 200, 20);
-            this.offContext.stroke();
+            this.offContext.beginPath()
+            this.offContext.moveTo(20, 20)
+            this.offContext.quadraticCurveTo(100, 100, 200, 20)
+            this.offContext.stroke()
             var image = this.offContext.transferToImageBitmap()
             this.context.transferFromImageBitmap(image)
         })
@@ -1475,9 +1475,9 @@ arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void
           .height('100%')
           .backgroundColor('#ffff00')
           .onReady(() =>{
-            this.offContext.moveTo(100, 20);
-            this.offContext.arcTo(150, 20, 150, 70, 50);
-            this.offContext.stroke();
+            this.offContext.moveTo(100, 20)
+            this.offContext.arcTo(150, 20, 150, 70, 50)
+            this.offContext.stroke()
             var image = this.offContext.transferToImageBitmap()
             this.context.transferFromImageBitmap(image)
           })
@@ -1664,17 +1664,17 @@ struct Fill {
         .height('100%')
         .backgroundColor('#ffff00')
         .onReady(() =>{
-          let region = new Path2D();
-          region.moveTo(30, 90);
-          region.lineTo(110, 20);
-          region.lineTo(240, 130);
-          region.lineTo(60, 130);
-          region.lineTo(190, 20);
-          region.lineTo(270, 90);
-          region.closePath();
+          let region = new Path2D()
+          region.moveTo(30, 90)
+          region.lineTo(110, 20)
+          region.lineTo(240, 130)
+          region.lineTo(60, 130)
+          region.lineTo(190, 20)
+          region.lineTo(270, 90)
+          region.closePath()
           // Fill path
-          this.offContext.fillStyle = 'green';
-          this.offContext.fill(region, "evenodd");
+          this.offContext.fillStyle = 'green'
+          this.offContext.fill(region, "evenodd")
           var image = this.offContext.transferToImageBitmap()
           this.context.transferFromImageBitmap(image)
         })
@@ -1766,9 +1766,9 @@ struct Clip {
         .height('100%')
         .backgroundColor('#ffff00')
         .onReady(() =>{
-          let region = new Path2D();
-          region.rect(80,10,20,130);
-          region.rect(40,50,100,50);
+          let region = new Path2D()
+          region.rect(80,10,20,130)
+          region.rect(40,50,100,50)
           this.offContext.clip(region,"evenodd")
           this.offContext.fillStyle = "rgb(255,0,0)"
           this.offContext.fillRect(0, 0, 600, 600)
@@ -2214,8 +2214,8 @@ getImageData(sx: number, sy: number, sw: number, sh: number): ImageData
 @Entry
 @Component
 struct GetImageData {
-  private settings: RenderingContextSettings = new RenderingContextSettings(true);
-  private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
+  private settings: RenderingContextSettings = new RenderingContextSettings(true)
+  private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
   private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings)
   private img:ImageBitmap = new ImageBitmap("/common/images/1234.png")
 
@@ -2226,9 +2226,9 @@ struct GetImageData {
         .height('100%')
         .backgroundColor('#ffff00')
         .onReady(() =>{
-          this.offContext.drawImage(this.img,0,0,130,130);
-          var imagedata = this.offContext.getImageData(50,50,130,130);
-          this.offContext.putImageData(imagedata,150,150);
+          this.offContext.drawImage(this.img,0,0,130,130)
+          var imagedata = this.offContext.getImageData(50,50,130,130)
+          this.offContext.putImageData(imagedata,150,150)
           var image = this.offContext.transferToImageBitmap()
           this.context.transferFromImageBitmap(image)
         })
@@ -2330,7 +2330,7 @@ struct SetLineDash {
         .onReady(() =>{
           this.offContext.arc(100, 75, 50, 0, 6.28)
           this.offContext.setLineDash([10,20])
-          this.offContext.stroke();
+          this.offContext.stroke()
           var image = this.offContext.transferToImageBitmap()
           this.context.transferFromImageBitmap(image)
       })
@@ -2384,7 +2384,7 @@ struct OffscreenCanvasGetLineDash {
           .onReady(() => {
             this.offContext.arc(100, 75, 50, 0, 6.28)
             this.offContext.setLineDash([10,20])
-            this.offContext.stroke();
+            this.offContext.stroke()
             let res = this.offContext.getLineDash()
             var image = this.offContext.transferToImageBitmap()
             this.context.transferFromImageBitmap(image)
@@ -2437,7 +2437,7 @@ struct ToDataURL {
         .height('100%')
         .backgroundColor('#ffff00')
         .onReady(() =>{
-          var dataURL = this.offContext.toDataURL();
+          var dataURL = this.offContext.toDataURL()
         })
     }
     .width('100%')
@@ -2534,11 +2534,11 @@ struct CanvasExample {
         .height('100%')
         .backgroundColor('#ffff00')
         .onReady(() =>{
-          this.offContext.save(); // save the default state
-          this.offContext.fillStyle = "green";
-          this.offContext.fillRect(20, 20, 100, 100);
-          this.offContext.restore(); // restore to the default state
-          this.offContext.fillRect(150, 75, 100, 100);
+          this.offContext.save() // save the default state
+          this.offContext.fillStyle = "green"
+          this.offContext.fillRect(20, 20, 100, 100)
+          this.offContext.restore() // restore to the default state
+          this.offContext.fillRect(150, 75, 100, 100)
           var image = this.offContext.transferToImageBitmap()
           this.context.transferFromImageBitmap(image)
         })
@@ -2575,11 +2575,11 @@ struct CanvasExample {
         .height('100%')
         .backgroundColor('#ffff00')
         .onReady(() =>{
-          this.offContext.save(); // save the default state
-          this.offContext.fillStyle = "green";
-          this.offContext.fillRect(20, 20, 100, 100);
-          this.offContext.restore(); // restore to the default state
-          this.offContext.fillRect(150, 75, 100, 100);
+          this.offContext.save() // save the default state
+          this.offContext.fillStyle = "green"
+          this.offContext.fillRect(20, 20, 100, 100)
+          this.offContext.restore() // restore to the default state
+          this.offContext.fillRect(150, 75, 100, 100)
           var image = this.offContext.transferToImageBitmap()
           this.context.transferFromImageBitmap(image)
         })

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

@@ -41,7 +41,7 @@
 @Entry
 @Component
 struct Index {
-  @State outSetValue: number = 40;
+  @State outSetValue: number = 40
 
   build() {
     Row() {
@@ -63,8 +63,8 @@ struct Index {
         })
           .margin({ top: 30 })
           .onChange((value: number, mode: SliderChangeMode) => {
-            this.outSetValue = value;
-            console.info('value:' + value + 'mode:' + mode.toString());
+            this.outSetValue = value
+            console.info('value:' + value + 'mode:' + mode.toString())
           })
       }
       .width('100%')

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

@@ -63,7 +63,7 @@ struct FocusableExample {
               .width(165)
               .height(40)
               .fontColor(Color.White)
-              .focusOnTouch(true)           //该Button组件点击后可获焦
+              .focusOnTouch(true)           // 该Button组件点击后可获焦
             Row({ space: 5 }) {
               Button()
                 .width(80)
@@ -73,7 +73,7 @@ struct FocusableExample {
                 .width(80)
                 .height(40)
                 .fontColor(Color.White)
-                .focusOnTouch(true)           //该Button组件点击后可获焦
+                .focusOnTouch(true)           // 该Button组件点击后可获焦
             }
             Row({ space: 5 }) {
               Button()
@@ -86,7 +86,7 @@ struct FocusableExample {
                 .fontColor(Color.White)
             }
           }.borderWidth(2).borderColor(Color.Red).borderStyle(BorderStyle.Dashed)
-          .tabIndex(1)                      //该Column组件为按TAB键走焦的第一个获焦的组件
+          .tabIndex(1)                      // 该Column组件为按TAB键走焦的第一个获焦的组件
           Column({ space: 5 }) {
             Button('Group2')
               .width(165)
@@ -101,7 +101,7 @@ struct FocusableExample {
                 .width(80)
                 .height(40)
                 .fontColor(Color.White)
-                .groupDefaultFocus(true)      //该Button组件上级Column组件获焦时获焦
+                .groupDefaultFocus(true)      // 该Button组件上级Column组件获焦时获焦
             }
             Row({ space: 5 }) {
               Button()
@@ -114,14 +114,14 @@ struct FocusableExample {
                 .fontColor(Color.White)
             }
           }.borderWidth(2).borderColor(Color.Green).borderStyle(BorderStyle.Dashed)
-          .tabIndex(2)                      //该Column组件为按TAB键走焦的第二个获焦的组件
+          .tabIndex(2)                      // 该Column组件为按TAB键走焦的第二个获焦的组件
         }
         Column({ space: 5 }) {
           TextInput({placeholder: 'input', text: this.inputValue})
             .onChange((value: string) => {
               this.inputValue = value
             })
-            .defaultFocus(true)             //该TextInput组件为页面的初始默认焦点
+            .defaultFocus(true)             // 该TextInput组件为页面的初始默认焦点
           Button('Group3')
             .width(165)
             .height(40)
@@ -165,7 +165,7 @@ struct FocusableExample {
               .fontColor(Color.White)
           }
         }.borderWidth(2).borderColor(Color.Orange).borderStyle(BorderStyle.Dashed)
-        .tabIndex(3)                      //该Column组件为按TAB键走焦的第三个获焦的组件
+        .tabIndex(3)                      // 该Column组件为按TAB键走焦的第三个获焦的组件
       }.alignItems(VerticalAlign.Top)
     }
   }
@@ -200,7 +200,7 @@ focusControl.requestFocus示例代码：
 使用focusContrl.requestFocus接口使指定组件获取焦点。
 ```ts
 // requestFocus.ets
-import prompt from '@system.prompt';
+import prompt from '@ohos.prompt'
 
 @Entry
 @Component
@@ -250,7 +250,7 @@ struct RequestFocusExample {
         Button("RequestFocus")
           .width(200).height(70).fontColor(Color.White)
           .onClick(() => {
-            var res = focusControl.requestFocus(this.selectId)      //使选中的this.selectId的组件获焦
+            var res = focusControl.requestFocus(this.selectId)      // 使选中的this.selectId的组件获焦
             if (res) {
               prompt.showToast({message: 'Request success'})
             } else {

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

@@ -34,7 +34,7 @@
 struct BlurEffectsExample {
   build() {
     Column({ space: 10 }) {
-      //       对字体进行模糊
+      // 对字体进行模糊
       Text('font blur').fontSize(15).fontColor(0xCCCCCC).width('90%')
       Flex({ alignItems: ItemAlign.Center }) {
         Text('original text').margin(10)

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

@@ -20,8 +20,6 @@
 | -------------------------| ------------------------------------------------| -----| ----------------------------------------- |
 | message                  | string                                          | 是    | 弹窗信息内容。                                     |
 | placementOnTop           | boolean                                         | 否    | 是否在组件上方显示，默认值为false。                  |
-| arrowOffset<sup>9+</sup> | [Length](ts-types.md#length)                    | 否    | popup箭头在弹窗处的偏移。箭头在气泡上下方时，数值为0表示箭头居最左侧，偏移量为箭头至最左侧的距离，默认居中。箭头在气泡左右侧时，偏移量为箭头至最上侧的距离，默认居中。      |
-| showInSubWindow<sup>9+</sup> | boolean                    | 否    | 是否在子窗口显示气泡，默认值为false。 |
 | primaryButton            | {<br/>value:&nbsp;string,<br/>action:&nbsp;()&nbsp;=&gt;&nbsp;void<br/>} | 否    | 第一个按钮。<br/>value:&nbsp;弹窗里主按钮的文本。<br/>action:&nbsp;点击主按钮的回调函数。 |
 | secondaryButton          | {<br/>value:&nbsp;string,<br/>action:&nbsp;()&nbsp;=&gt;&nbsp;void<br/>} | 否    | 第二个按钮。<br/>value:&nbsp;弹窗里辅助按钮的文本。<br/>action:&nbsp;点击辅助按钮的回调函数。 |
 | onStateChange            | (event:&nbsp;{&nbsp;isVisible:&nbsp;boolean&nbsp;})&nbsp;=&gt;&nbsp;void | 否    | 弹窗状态变化事件回调，参数isVisible为弹窗当前的显示状态。      |
@@ -34,8 +32,6 @@
 | -------------------------| ------------------------- | ---- | ---------------------------------------------------- |
 | builder                  | [CustomBuilder](ts-types.md#custombuilder8)  | 是   | 提示气泡内容的构造器。                                          |
 | placement                | [Placement](ts-appendix-enums.md#placement8) | 否   | 气泡组件优先显示的位置，当前位置显示不下时，会自动调整位置。<br/>默认值：Placement.Bottom     |
-| arrowOffset<sup>9+</sup> | [Length](ts-types.md#length)                 | 否   | popup箭头在弹窗处的偏移。箭头在气泡上下方时，数值为0表示箭头居最左侧，偏移量为箭头至最左侧的距离，默认居中。箭头在气泡左右侧时，偏移量为箭头至最上侧的距离，默认居中。          |
-| showInSubWindow<sup>9+</sup> | boolean                    | 否    | 是否在子窗口显示气泡，默认值为false。 |
 | maskColor                | [ResourceColor](ts-types.md#resourcecolor)  | 否   | 提示气泡遮障层的颜色。                                          |
 | popupColor               | [ResourceColor](ts-types.md#resourcecolor)  | 否   | 提示气泡的颜色。                                               |
 | enableArrow              | boolean                                      | 否   | 是否显示箭头。<br/>从API Version 9开始，如果箭头所在方位侧的气泡长度不足以显示下箭头，则会默认不显示箭头。比如：placement设置为Left，但气泡高度小于箭头的宽度（32vp），则实际不会显示箭头。<br/>默认值：true |

zh-cn/application-dev/reference/arkui-ts/ts-universal-events-drag-drop.md

@@ -50,12 +50,12 @@
 @Entry
 @Component
 struct DragExample {
-  @State numbers: string[] = ['one', 'two', 'three', 'four', 'five', 'six'];
-  @State text: string = '';
-  @State bool: boolean = false;
-  @State appleVisible: Visibility = Visibility.Visible;
-  @State orangeVisible: Visibility = Visibility.Visible;
-  @State bananaVisible: Visibility = Visibility.Visible;
+  @State numbers: string[] = ['one', 'two', 'three', 'four', 'five', 'six']
+  @State text: string = ''
+  @State bool: boolean = false
+  @State appleVisible: Visibility = Visibility.Visible
+  @State orangeVisible: Visibility = Visibility.Visible
+  @State bananaVisible: Visibility = Visibility.Visible
 
   // 自定义拖拽过程中显示的内容
   @Builder pixelMapBuilder() {
@@ -87,10 +87,10 @@ struct DragExample {
           .backgroundColor(0xAFEEEE)
           .visibility(this.appleVisible)
           .onDragStart(() => {
-            this.bool = true;
-            this.text = 'apple';
-            this.appleVisible = Visibility.None;
-            return this.pixelMapBuilder;
+            this.bool = true
+            this.text = 'apple'
+            this.appleVisible = Visibility.None
+            return this.pixelMapBuilder
           })
         Text('orange')
           .width('25%')
@@ -100,10 +100,10 @@ struct DragExample {
           .backgroundColor(0xAFEEEE)
           .visibility(this.orangeVisible)
           .onDragStart(() => {
-            this.bool = true;
-            this.text = 'orange';
-            this.orangeVisible = Visibility.None;
-            return this.pixelMapBuilder;
+            this.bool = true
+            this.text = 'orange'
+            this.orangeVisible = Visibility.None
+            return this.pixelMapBuilder
           })
         Text('banana')
           .width('25%')
@@ -113,11 +113,11 @@ struct DragExample {
           .backgroundColor(0xAFEEEE)
           .visibility(this.bananaVisible)
           .onDragStart((event: DragEvent, extraParams: string) => {
-            console.log('Text onDragStart, ' + extraParams + 'X:' + event.getX() + 'Y:' + event.getY());
-            this.bool = true;
-            this.text = 'banana';
-            this.bananaVisible = Visibility.None;
-            return this.pixelMapBuilder;
+            console.log('Text onDragStart, ' + extraParams + 'X:' + event.getX() + 'Y:' + event.getY())
+            this.bool = true
+            this.text = 'banana'
+            this.bananaVisible = Visibility.None
+            return this.pixelMapBuilder
           })
       }.padding({ top: 10, bottom: 10 }).margin(10)
 
@@ -147,20 +147,20 @@ struct DragExample {
       .padding(15)
       .divider({ strokeWidth: 2, color: 0xFFFFFF, startMargin: 20, endMargin: 20 })
       .onDragEnter((event: DragEvent, extraParams: string) => {
-        console.log('List onDragEnter, ' + extraParams + 'X:' + event.getX() + 'Y:' + event.getY());
+        console.log('List onDragEnter, ' + extraParams + 'X:' + event.getX() + 'Y:' + event.getY())
       })
       .onDragMove((event: DragEvent, extraParams: string) => {
-        console.log('List onDragMove, ' + extraParams + 'X:' + event.getX() + 'Y:' + event.getY());
+        console.log('List onDragMove, ' + extraParams + 'X:' + event.getX() + 'Y:' + event.getY())
       })
       .onDragLeave((event: DragEvent, extraParams: string) => {
-        console.log('List onDragLeave, ' + extraParams + 'X:' + event.getX() + 'Y:' + event.getY());
+        console.log('List onDragLeave, ' + extraParams + 'X:' + event.getX() + 'Y:' + event.getY())
       })
       .onDrop((event: DragEvent, extraParams: string) => {
         var jsonString = JSON.parse(extraParams);
         if (this.bool) {
           // 通过splice方法插入元素
-          this.numbers.splice(jsonString.insertIndex, 0, this.text);
-          this.bool = false;
+          this.numbers.splice(jsonString.insertIndex, 0, this.text)
+          this.bool = false
         }
       })
     }.width('100%').height('100%').padding({ top: 20 }).margin({ top: 20 })

zh-cn/application-dev/reference/arkui-ts/ts-universal-events-key.md

@@ -36,20 +36,20 @@
 @Entry
 @Component
 struct KeyEventExample {
-  @State text: string = '';
-  @State eventType: string = '';
+  @State text: string = ''
+  @State eventType: string = ''
 
   build() {
     Column() {
       Button('KeyEvent')
         .onKeyEvent((event: KeyEvent) => {
           if (event.type === KeyType.Down) {
-            this.eventType = 'Down';
+            this.eventType = 'Down'
           }
           if (event.type === KeyType.Up) {
-            this.eventType = 'Up';
+            this.eventType = 'Up'
           }
-          this.text = 'KeyType:' + this.eventType + '\nkeyCode:' + event.keyCode + '\nkeyText:' + event.keyText;
+          this.text = 'KeyType:' + this.eventType + '\nkeyCode:' + event.keyCode + '\nkeyText:' + event.keyText
         })
       Text(this.text).padding(15)
     }.height(300).width('100%').padding(35)

zh-cn/application-dev/reference/arkui-ts/ts-universal-events-show-hide.md

@@ -19,32 +19,32 @@
 
 ```ts
 // xxx.ets
-import prompt from '@ohos.prompt';
+import prompt from '@ohos.prompt'
 
 @Entry
 @Component
 struct AppearExample {
-  @State isShow: boolean = true;
-  @State changeAppear: string = 'Hide Text';
-  private myText: string = 'Text for onAppear';
+  @State isShow: boolean = true
+  @State changeAppear: string = 'Hide Text'
+  private myText: string = 'Text for onAppear'
 
   build() {
     Column() {
       Button(this.changeAppear)
         .onClick(() => {
-          this.isShow = !this.isShow;
+          this.isShow = !this.isShow
         }).margin(15)
       if (this.isShow) {
         Text(this.myText).fontSize(26).fontWeight(FontWeight.Bold)
           .onAppear(() => {
-            this.changeAppear = 'Hide Text';
+            this.changeAppear = 'Hide Text'
             prompt.showToast({
               message: 'The text is shown',
               duration: 2000
             })
           })
           .onDisAppear(() => {
-            this.changeAppear = 'Show Text';
+            this.changeAppear = 'Show Text'
             prompt.showToast({
               message: 'The text is hidden',
               duration: 2000

zh-cn/application-dev/reference/arkui-ts/ts-universal-events-touch.md

@@ -45,42 +45,42 @@
 @Entry
 @Component
 struct TouchExample {
-  @State text: string = '';
-  @State eventType: string = '';
+  @State text: string = ''
+  @State eventType: string = ''
 
   build() {
     Column() {
       Button('Touch').height(40).width(100)
         .onTouch((event: TouchEvent) => {
           if (event.type === TouchType.Down) {
-            this.eventType = 'Down';
+            this.eventType = 'Down'
           }
           if (event.type === TouchType.Up) {
-            this.eventType = 'Up';
+            this.eventType = 'Up'
           }
           if (event.type === TouchType.Move) {
-            this.eventType = 'Move';
+            this.eventType = 'Move'
           }
           this.text = 'TouchType:' + this.eventType + '\nDistance between touch point and touch element:\nx: '
           + event.touches[0].x + '\n' + 'y: ' + event.touches[0].y + '\nComponent globalPos:('
           + event.target.area.globalPosition.x + ',' + event.target.area.globalPosition.y + ')\nwidth:'
-          + event.target.area.width + '\nheight:' + event.target.area.height;
+          + event.target.area.width + '\nheight:' + event.target.area.height
         })
       Button('Touch').height(50).width(200).margin(20)
         .onTouch((event: TouchEvent) => {
           if (event.type === TouchType.Down) {
-            this.eventType = 'Down';
+            this.eventType = 'Down'
           }
           if (event.type === TouchType.Up) {
-            this.eventType = 'Up';
+            this.eventType = 'Up'
           }
           if (event.type === TouchType.Move) {
-            this.eventType = 'Move';
+            this.eventType = 'Move'
           }
           this.text = 'TouchType:' + this.eventType + '\nDistance between touch point and touch element:\nx: '
           + event.touches[0].x + '\n' + 'y: ' + event.touches[0].y + '\nComponent globalPos:('
           + event.target.area.globalPosition.x + ',' + event.target.area.globalPosition.y + ')\nwidth:'
-          + event.target.area.width + '\nheight:' + event.target.area.height;
+          + event.target.area.width + '\nheight:' + event.target.area.height
         })
       Text(this.text)
     }.width('100%').padding(30)