update semicolon

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

update semicolon
Signed-off-by: N yamila <tianyu55@huawei.com>
deb78999 · yamila · c853f403 · deb78999 · deb78999 · deb78999
35 changed file
--- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-gauge.md
+++ b/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]])
      

--- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-image.md
+++ b/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)

--- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-patternlock.md
+++ b/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%')
  }

--- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-search.md
+++ b/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%')
  }

--- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-slider.md
+++ b/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)

--- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-stepper.md
+++ b/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
    })
  }
 }

--- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-textarea.md
+++ b/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)

--- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-textinput.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-textinput.md
@@ -112,8 +112,8 @@ caretPosition(value:&nbsp;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...' })

--- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-web.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-web.md
--- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-xcomponent.md
+++ b/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')

--- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-longpressgesture.md
+++ b/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
          })
        )
    }

--- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-pangesture.md
+++ b/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)
        })
    }
  }

--- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-pinchgesture.md
+++ b/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%')

--- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-rotationgesture.md
+++ b/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%')

--- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-swipegesture.md
+++ b/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%')

--- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-tapgesture.md
+++ b/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)

--- a/zh-cn/application-dev/reference/arkui-ts/ts-canvasrenderingcontext2d.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-canvasrenderingcontext2d.md
--- a/zh-cn/application-dev/reference/arkui-ts/ts-combined-gestures.md
+++ b/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')
      })
    )
  }

--- a/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-imagebitmap.md
+++ b/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%')

--- a/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-imagedata.md
+++ b/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%')

--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-ability-component.md
+++ b/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')
          })
      }
  }

--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-counter.md
+++ b/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:&nbsp;()&nbsp;=&gt;&nbsp;void) | 监听数值增加事件。 | 
-| onDec(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 监听数值减少事件。 | 
+| onInc(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 监听数值增加事件。 |
+| onDec(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 监听数值减少事件。 |


 ## 示例

--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-scroll.md
+++ b/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 };
          })


--- a/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-shape.md
+++ b/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
          }
        }
      })

--- a/zh-cn/application-dev/reference/arkui-ts/ts-gesture-settings.md
+++ b/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)
    }
  }

--- a/zh-cn/application-dev/reference/arkui-ts/ts-methods-timepicker-dialog.md
+++ b/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))
            }
          })
        })

--- a/zh-cn/application-dev/reference/arkui-ts/ts-offscreencanvasrenderingcontext2d.md
+++ b/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)
        })

--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-border-image.md
+++ b/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%')

--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-focus.md
+++ b/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 {

--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-image-effect.md
+++ b/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)

--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-popup.md
+++ b/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 |

--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-events-drag-drop.md
+++ b/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 })

--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-events-key.md
+++ b/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)

--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-events-show-hide.md
+++ b/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

--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-events-touch.md
+++ b/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)