,
controller: WebController
} | - | 注入JavaScript对象到window对象中，并在window对象中调用该对象的方法。所有参数不支持更新。
- object: 参与注册的对象。只能声明方法，不能声明属性 。其中方法的参数和返回类型只能为string，number，boolean。
- name: 注册对象的名称，与window中调用的对象名一致。注册后window对象可以通过此名字访问应用侧JavaScript对象。
- methodList: 参与注册的应用侧JavaScript对象的方法。
- controller: 控制器。 |
+| javaScriptAccess | boolean | true | 设置是否允许执行JavaScript脚本，默认允许执行。 |
+| mixedMode | [MixedMode](#mixedmode枚举说明) | MixedMode.None | 设置是否允许加载超文本传输协议（HTTP）和超文本传输安全协议（HTTPS）混合内容，默认不允许加载HTTP和HTTPS混合内容。 |
+| onlineImageAccess | boolean | true | 设置是否允许从网络加载图片资源（通过HTTP和HTTPS访问的资源），默认允许访问。 |
+| zoomAccess | boolean | true | 设置是否支持手势进行缩放，默认允许执行缩放。 |
+| overviewModeAccess | boolean | true | 设置是否使用概览模式加载网页，默认使用该方式。 |
+| databaseAccess | boolean | false | 设置是否开启数据库存储API权限，默认不开启。 |
+| cacheMode | [CacheMode](#cachemode枚举说明) | CacheMode.Default | 设置缓存模式。 |
+| textZoomAtio | number | 100 | 设置页面的文本缩放百分比，默认为100%。 |
+| userAgent | string | - | 设置用户代理。 |
+
+> **说明：**
>
-> 通用属性仅支持[width](ts-universal-attributes-size.md#属性)、[height](ts-universal-attributes-size.md#属性)、[padding](ts-universal-attributes-size.md#属性)、[margin](ts-universal-attributes-size.md#属性)、[border](ts-universal-attributes-border.md#属性)。
+> 通用属性仅支持[width](ts-universal-attributes-size.md#属性)、[height](ts-universal-attributes-size.md#属性)、[padding](ts-universal-attributes-size.md#属性)、[margin](ts-universal-attributes-size.md#属性)、[border](ts-universal-attributes-border.md#属性)。
## 事件
不支持通用事件。
-| 名称 | 功能描述 |
-| ------------------------------------------------------------ | ------------------------------------------------------------ |
+| 名称 | 功能描述 |
+| ---------------------------------------- | ---------------------------------------- |
| onAlert(callback: (event?: { url: string; message: string; result: [JsResult](#jsresult对象说明) }) => boolean) | 网页触发alert()告警弹窗时触发回调。
当回调返回false时，触发默认弹窗。当回调返回true时，系统应用可以调用系统弹窗能力（只有确认场景），并且根据用户的确认操作调用JsResult通知Web组件。
- url：当前显示弹窗所在网页的URL。
- message：弹窗中显示的信息。
- result：通知Web组件用户操作行为。
|
| onBeforeUnload(callback: (event?: { url: string; message: string; result: [JsResult](#jsresult对象说明) }) => boolean) | 刷新或关闭场景下，在即将离开当前页面时触发此回调。
当回调返回false时，触发默认弹窗。当回调返回true时，系统应用可以调用系统弹窗能力（包括确认和取消），并且需要根据用户的确认或取消操作调用JsResult通知Web组件最终是否离开当前页面。
- url：当前显示弹窗所在网页的URL。
- message：弹窗中显示的信息。
- result：通知Web组件用户操作行为。
|
| onConfirm(callback: (event?: { url: string; message: string; result: [JsResult](#jsresult对象说明) }) => boolean) | 网页调用confirm()告警时触发此回调。
当回调返回false时，触发默认弹窗。当回调返回true时，系统应用可以调用系统弹窗能力（包括确认和取消），并且需要根据用户的确认或取消操作调用JsResult通知Web组件。
- url：当前显示弹窗所在网页的URL。
- message：弹窗中显示的信息。
- result：通知Web组件用户操作行为。
|
@@ -65,8 +66,8 @@
| onDownloadStart(callback: (event?: { url: string, userAgent: string, contentDisposition: string, mimetype: string, contentLength: number }) => void) | 网页的下载任务开始时触发该回调。
- url：文件下载的URL。
- userAgent：下载的用户代理（UA）名称。
- contentDisposition：服务器返回的 Content-Disposition响应头，可能为空。
- mimetype：服务器返回内容媒体类型（MIME）信息。
- contentLength：服务器返回文件的长度。
|
| onErrorReceive(callback: (event?: { request: [WebResourceRequest](#webresourceerror对象说明), error: [WebResourceError](#webresourceerror对象说明) }) => void) | 网页加载遇到错误时触发该回调。
出于性能考虑，建议此回调中尽量执行简单逻辑。
- request：网页请求的封装信息。
- error：网页加载资源错误的封装信息 。
|
| onHttpErrorReceive(callback: (event?: { request: [WebResourceRequest](#webresourceerror对象说明), response: [WebResourceResponse](#webresourceresponse对象说明) }) => void) | 网页加载资源遇到的HTTP错误（响应码>=400)时触发该回调。
- request：网页请求的封装信息。
- response：网页响应的封装信息
|
-| onPageBegin(callback: (event?: { url: string }) => void) | 网页开始加载时触发该回调，且只在主frame触发，iframe或者frameset的内容加载时不会触发此回调。
- url：页面的URL地址。
|
-| onPageEnd(callback: (event?: { url: string }) => void) | 网页加载完成时触发该回调，且只在主frame触发。
- url：页面的URL地址。
|
+| onPageBegin(callback: (event?: { url: string }) => void) | 网页开始加载时触发该回调，且只在主frame触发，iframe或者frameset的内容加载时不会触发此回调。
- url：页面的URL地址。
|
+| onPageEnd(callback: (event?: { url: string }) => void) | 网页加载完成时触发该回调，且只在主frame触发。
- url：页面的URL地址。
|
| onProgressChange(callback: (event?: { newProgress: number }) => void) | 网页加载进度变化时触发该回调。
- newProgress：新的加载进度，取值范围为0到100的整数。
|
| onTitleReceive(callback: (event?: { title: string }) => void) | 网页document标题更改时触发该回调。
- title：document标题内容。
|
| onRefreshAccessedHistory(callback: (event?: { url: string, isRefreshed: boolean }) => void) | 加载网页页面完成时触发该回调，用于应用更新其访问的历史链接。
- url：访问的url。
- isRefreshed：true表示该页面是被重新加载的，false表示该页面是新加载的。
|
@@ -76,12 +77,12 @@
## ConsoleMessage对象说明
-| 接口名称 | 功能描述 |
-| ------------------------------- | ---------------------- |
-| getLineNumber(): number | 获取ConsoleMessage的行数。 |
-| getMessage(): string | 获取ConsoleMessage的日志信息。 |
+| 接口名称 | 功能描述 |
+| ---------------------------------------- | ---------------------- |
+| getLineNumber(): number | 获取ConsoleMessage的行数。 |
+| getMessage(): string | 获取ConsoleMessage的日志信息。 |
| getMessageLevel(): [MessageLevel](#messagelevel枚举说明) | 获取ConsoleMessage的信息级别。 |
-| getSourceId(): string | 获取网页源文件路径和名字。 |
+| getSourceId(): string | 获取网页源文件路径和名字。 |
## MessageLevel枚举说明
@@ -144,13 +145,13 @@ Web组件返回的请求/响应头对象。
onRenderExited接口返回的渲染进程退出的具体原因。
-| 名称 | 描述 |
-| ---------------------------- | ------------------------------ |
-| PROCESS_ABNORMAL_TERMINATION | 渲染进程异常退出。 |
-| PROCESS_WAS_KILLED | 收到SIGKILL，或被手动终止。 |
-| PROCESS_CRASHED | 渲染进程崩溃退出，如段错误。 |
-| PROCESS_OOM | 程序内存不足。 |
-| PROCESS_EXIT_UNKNOWN | 其他原因。 |
+| 名称 | 描述 |
+| ---------------------------- | ----------------- |
+| PROCESS_ABNORMAL_TERMINATION | 渲染进程异常退出。 |
+| PROCESS_WAS_KILLED | 收到SIGKILL，或被手动终止。 |
+| PROCESS_CRASHED | 渲染进程崩溃退出，如段错误。 |
+| PROCESS_OOM | 程序内存不足。 |
+| PROCESS_EXIT_UNKNOWN | 其他原因。 |
## MixedMode枚举说明
@@ -161,35 +162,35 @@ onRenderExited接口返回的渲染进程退出的具体原因。
| None | 不允许加载HTTP和HTTPS混合内容。 |
## CacheMode枚举说明
-| 名称 | 描述 |
-| ---------- | ---------------------------------- |
-| Default | 使用未过期的cache加载资源，如果cache中无该资源则从网络中获取。 |
-| None | 加载资源使用cache，如果cache中无该资源则从网络中获取。 |
-| Online | 加载资源不使用cache，全部从网络中获取。 |
-| Only | 只从cache中加载资源。 |
+| 名称 | 描述 |
+| ------- | ------------------------------------ |
+| Default | 使用未过期的cache加载资源，如果cache中无该资源则从网络中获取。 |
+| None | 加载资源使用cache，如果cache中无该资源则从网络中获取。 |
+| Online | 加载资源不使用cache，全部从网络中获取。 |
+| Only | 只从cache中加载资源。 |
## FileSelectorResult对象说明
通知Web组件的文件选择结果。
-| 接口名称 | 功能描述 |
-| ---------------------------------------------- | ------------------------------------------------------------ |
+| 接口名称 | 功能描述 |
+| ---------------------------------------- | -------------------------------------- |
| handleFileList(fileList: Array\): void | 通知Web组件进行文件选择操作。fileList: 需要进行操作的文件列表。 |
## FileSelectorParam对象说明
-| 接口名称 | 功能描述 |
-| ---------------------------------------- | ------------------ |
-| title(): string | 获取文件选择器标题。 |
-| mode(): FileSelectorMode | 获取文件选择器的模式。 |
-| accpetType(): Array\ | 获取文件过滤类型。 |
-| isCapture(): boolean | 获取是否调用多媒体能力。 |
+| 接口名称 | 功能描述 |
+| ----------------------------- | ------------ |
+| title(): string | 获取文件选择器标题。 |
+| mode(): FileSelectorMode | 获取文件选择器的模式。 |
+| accpetType(): Array\ | 获取文件过滤类型。 |
+| isCapture(): boolean | 获取是否调用多媒体能力。 |
## FileSelectorMode枚举说明
-| 名称 | 描述 |
-| ---------------------------- | ------------------------------ |
-| FILE_OPEN_MODE | 打开上传单个文件。 |
-| FILE_OPEN_MULTIPLE_MODE | 打开上传多个文件。 |
-| FILE_OPEN_FOLDER_MODE | 打开上传文件夹模式。 |
-| FILE_SAVE_MODE | 文件保存模式。 |
+| 名称 | 描述 |
+| ----------------------- | ---------- |
+| FILE_OPEN_MODE | 打开上传单个文件。 |
+| FILE_OPEN_MULTIPLE_MODE | 打开上传多个文件。 |
+| FILE_OPEN_FOLDER_MODE | 打开上传文件夹模式。 |
+| FILE_SAVE_MODE | 文件保存模式。 |
## WebController
@@ -373,8 +374,8 @@ getCookieManager(): WebCookie
获取web组件cookie管理对象。
- 返回值
- | 参数类型 | 说明 |
- | ------- | --------- |
+ | 参数类型 | 说明 |
+ | --------- | ---------------------------------------- |
| WebCookie | web组件cookie管理对象，参考[WebCookie](#webcookie)定义。 |
## WebCookie
通过WebCookie可以控制Web组件中的cookie的各种行为，其中每个应用中的所有web组件共享一个WebCookie。通过controller方法中的getCookieManager方法可以获取WebCookie对象，进行后续的cookie管理操作。
@@ -385,13 +386,13 @@ setCookie(url: string, value: string): boolean
- 参数说明
- | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
- | -------- | ------------------------ | ---- | ---- | ---------------------------------------- |
- | url | string | 是 | - | 要设置的cookie所属的url。 |
- | value | string | 是 | - | cookie的值。 |
+ | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
+ | ----- | ------ | ---- | ---- | ----------------- |
+ | url | string | 是 | - | 要设置的cookie所属的url。 |
+ | value | string | 是 | - | cookie的值。 |
- 返回值
- | 参数类型 | 说明 |
- | ------- | --------- |
+ | 参数类型 | 说明 |
+ | ------- | ------------- |
| boolean | 设置cookie是否成功。 |
### saveCookieSync
@@ -399,8 +400,8 @@ saveCookieSync(): boolean
将当前存在内存中的cookie同步到磁盘中，该方法为同步方法。
- 返回值
- | 参数类型 | 说明 |
- | ------- | --------- |
+ | 参数类型 | 说明 |
+ | ------- | -------------------- |
| boolean | 同步内存cookie到磁盘操作是否成功。 |
## 示例
diff --git 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
index adb4d20481d19aa1a59c82b5e88792242a780e04..dbd5d7fc0de9e232e4b05fac3b0a80d7c9e1bf41 100644
--- 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
@@ -1,9 +1,10 @@
# XComponent
- >  **说明：**
- > 该组件从API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+ 可用于EGL/OpenGLES和媒体数据写入，并显示在XComponent组件。
- 可用于EGL/OpenGLES和媒体数据写入，并显示在XComponent组件。
+ > **说明：**
+ >
+ > 该组件从API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
## 权限列表
@@ -15,24 +16,23 @@
## 接口
- XComponent\(value: {id: string, type: string, libraryname?: string, controller?: XComponentController}\)
+ XComponent\(value: {id: string, type: string, libraryname?: string, controller?: XComponentController}\)
- - 参数
-
- | 名称 | 参数类型 | 必填 | 描述 |
- | ----------- | --------------------------------------------- | ---- | ------------------------------------------------------------ |
- | id | string | 是 | 组件的唯一标识，支持最大的字符串长度128。 |
- | type | string | 是 | 用于指定XComponent组件类型，可选值为：
-surface：组件内容单独送显，直接合成到屏幕。
-component：组件内容与其他组件合成后统一送显。|
- | libraryname | string | 否 | 应用Native层编译输出动态库名称。 |
- | controller | [XComponentController](#XComponentController) | 否 | 给组件绑定一个控制器，通过控制器调用组件方法。 |
+**参数：**
+| 名称 | 参数类型 | 必填 | 描述 |
+| ----------- | ---------------------------------------- | ---- | ---------------------------------------- |
+| id | string | 是 | 组件的唯一标识，支持最大的字符串长度128。 |
+| type | string | 是 | 用于指定XComponent组件类型，可选值为：
-surface：组件内容单独送显，直接合成到屏幕。
-component：组件内容与其他组件合成后统一送显。 |
+| libraryname | string | 否 | 应用Native层编译输出动态库名称。 |
+| controller | [XComponentController](#XComponentController) | 否 | 给组件绑定一个控制器，通过控制器调用组件方法。 |
## 事件
-| 名称 | 功能描述 |
-| ------------------------------- | ------------------------ |
+| 名称 | 功能描述 |
+| -------------------------------- | ------------ |
| onLoad(context?: object) => void | 插件加载完成时回调事件。 |
-| onDestroy() => void | 插件卸载完成时回调事件。 |
+| onDestroy() => void | 插件卸载完成时回调事件。 |
## XComponentController
@@ -50,11 +50,11 @@ getXComponentSurfaceId(): string
获取XComponent对应Surface的ID，供@ohos接口使用，比如camera相关接口。
- - 返回值
+**返回值：**
- | 类型 | 描述 |
- | ------ | --------------------------- |
- | string | XComponent持有Surface的ID。 |
+| 类型 | 描述 |
+| ------ | ----------------------- |
+| string | XComponent持有Surface的ID。 |
### setXComponentSurfaceSize
@@ -62,12 +62,12 @@ setXComponentSurfaceSize(value: {surfaceWidth: number, surfaceHeight: number}):
设置XComponent持有Surface的宽度和高度。
-- 参数
+**参数：**
- | 参数名 | 参数类型 | 必填 | 默认值 | 描述 |
- | ------------- | -------- | ---- | ------ | ----------------------------- |
- | surfaceWidth | number | 是 | - | XComponent持有Surface的宽度。 |
- | surfaceHeight | number | 是 | - | XComponent持有Surface的高度。 |
+| 参数名 | 参数类型 | 必填 | 默认值 | 描述 |
+| ------------- | ------ | ---- | ---- | ----------------------- |
+| surfaceWidth | number | 是 | - | XComponent持有Surface的宽度。 |
+| surfaceHeight | number | 是 | - | XComponent持有Surface的高度。 |
### getXComponentContext
@@ -75,18 +75,18 @@ getXComponentContext(): Object
获取XComponent实例对象的context。
-- 返回值
+**返回值：**
- | 类型 | 描述 |
- | ------ | ------------------------------------------------------------ |
- | Object | 获取XComponent实例对象的context，context包含的具体接口方法由开发者自定义。 |
+| 类型 | 描述 |
+| ------ | ---------------------------------------- |
+| Object | 获取XComponent实例对象的context，context包含的具体接口方法由开发者自定义。 |
## 示例
提供surface类型XComponent，支持相机预览等能力。
示例效果请以真机运行为准，当前IDE预览器不支持。
-```
+```ts
import camera from '@ohos.multimedia.camera';
@Entry
@Component
diff --git 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
index c75ef770d2f9a587bae43d51dab1ef8368ad4ab9..9c0ee70cedd0cf0c0aa98db7f2af2dfe832431ef 100644
--- 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
@@ -1,7 +1,8 @@
# LongPressGesture
->  **说明：**
-> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+> **说明：**
+>
+> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
## 权限列表
@@ -13,31 +14,32 @@
LongPressGesture(options?: { fingers?: number, repeat?: boolean, duration?: number })
-- 参数
- | 参数名称 | 参数类型 | 必填 | 默认值 | 参数描述 |
- | -------- | -------- | -------- | -------- | -------- |
- | fingers | number | 否 | 1 | 触发长按的最少手指数，最小为1指， 最大取值为10指。 |
- | repeat | boolean | 否 | false | 是否连续触发事件回调。 |
- | duration | number | 否 | 500 | 最小触发长按的时间，单位为毫秒（ms）。 |
+**参数：**
+| 参数名称 | 参数类型 | 必填 | 默认值 | 参数描述 |
+| -------- | ------- | ---- | ----- | -------------------------------- |
+| fingers | number | 否 | 1 | 触发长按的最少手指数，最小为1指， 最大取值为10指。 |
+| repeat | boolean | 否 | false | 是否连续触发事件回调。 |
+| duration | number | 否 | 500 | 最小触发长按的时间，单位为毫秒（ms）。 |
## 事件
-| 名称 | 功能描述 |
-| -------- | -------- |
-| onAction((event?: GestureEvent) => void) | LongPress手势识别成功回调。 |
-| onActionEnd((event?: GestureEvent) => void) | LongPress手势识别成功，手指抬起后触发回调。 |
-| onActionCancel(event: () => void) | LongPress手势识别成功，接收到触摸取消事件触发回调。 |
+| 名称 | 功能描述 |
+| ---------------------------------------- | ------------------------------ |
+| onAction((event?: GestureEvent) => void) | LongPress手势识别成功回调。 |
+| onActionEnd((event?: GestureEvent) => void) | LongPress手势识别成功，手指抬起后触发回调。 |
+| onActionCancel(event: () => void) | LongPress手势识别成功，接收到触摸取消事件触发回调。 |
-- GestureEvent对象中与LongPress手势相关的属性
- | 属性名称 | 属性类型 | 描述 |
- | -------- | -------- | -------- |
- | repeat | boolean | 事件是否为重复触发事件。 |
+## GestureEvent对象中与LongPress手势相关的属性
+| 属性名称 | 属性类型 | 描述 |
+| ------ | ------- | ------------ |
+| repeat | boolean | 事件是否为重复触发事件。 |
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct LongPressGestureExample {
diff --git 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
index 5475d871b670eae16b32c58ad9aa0a33f287f9e6..66f629bdd03115b8dd28a0d8a7a9f8b8636700cc 100644
--- 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
@@ -1,7 +1,8 @@
# PanGesture
->  **说明：**
-> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+> **说明：**
+>
+> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
## 权限列表
@@ -13,62 +14,65 @@
PanGesture(options?: { fingers?: number, direction?: PanDirection, distance?: number } | [PanGestureOptions](#pangestureoptions))
-- 参数
- | 参数名称 | 参数类型 | 必填 | 默认值 | 参数描述 |
- | -------- | -------- | -------- | -------- | -------- |
- | fingers | number | 否 | 1 | 触发滑动的最少手指数，最小为1指， 最大取值为10指。 |
- | direction | PanDirection | 否 | All | 设置滑动方向，此枚举值支持逻辑与(&)和逻辑或（\|）运算。 |
- | distance | number | 否 | 5.0 | 最小滑动识别距离，单位为vp。 |
+**参数：**
-- PanDirection枚举说明
- | 名称 | 描述 |
- | -------- | -------- |
- | All | 所有方向可滑动。 |
- | Horizontal | 水平方向可滑动。 |
- | Vertical | 竖直方向可滑动。 |
- | Left | 向左滑动。 |
- | Right | 向右滑动。 |
- | Up | 向上滑动。 |
- | Down | 向下滑动。 |
- | None | 任何方向都不可滑动。 |
+| 参数名称 | 参数类型 | 必填 | 默认值 | 参数描述 |
+| --------- | ------------ | ---- | ---- | ---------------------------------- |
+| fingers | number | 否 | 1 | 触发滑动的最少手指数，最小为1指， 最大取值为10指。 |
+| direction | PanDirection | 否 | All | 设置滑动方向，此枚举值支持逻辑与(&)和逻辑或（\|）运算。 |
+| distance | number | 否 | 5.0 | 最小滑动识别距离，单位为vp。 |
+## PanDirection枚举说明
-### PanGestureOptions
+| 名称 | 描述 |
+| ---------- | ---------- |
+| All | 所有方向可滑动。 |
+| Horizontal | 水平方向可滑动。 |
+| Vertical | 竖直方向可滑动。 |
+| Left | 向左滑动。 |
+| Right | 向右滑动。 |
+| Up | 向上滑动。 |
+| Down | 向下滑动。 |
+| None | 任何方向都不可滑动。 |
+
+## PanGestureOptions
通过PanGestureOptions对象接口可以动态修改滑动手势识别器的属性，从而避免通过状态变量修改属性（状态变量修改会导致UI刷新）。
PanGestureOptions(options?: { fingers?: number, direction?: PanDirection, distance?: number })
-- 参数
- 同PanGesture参数说明。
+**参数：**
+
+同PanGesture参数说明。
-- 接口
- | 名称 | 功能描述 |
- | -------- | -------- |
- | setDirection(value: PanDirection) | 设置direction属性。 |
- | setDistance(value: number) | 设置distance属性。 |
- | setFingers(value: number) | 设置fingers属性。 |
+**接口：**
+| 名称 | 功能描述 |
+| -------------------------------------- | -------------- |
+| setDirection(value: PanDirection) | 设置direction属性。 |
+| setDistance(value: number) | 设置distance属性。 |
+| setFingers(value: number) | 设置fingers属性。 |
## 事件
-| 名称 | 功能描述 |
-| -------- | -------- |
-| onActionStart(callback: (event?: GestureEvent) => void) | Pan手势识别成功回调。 |
-| onActionUpdate(callback: (event?: GestureEvent) => void) | Pan手势移动过程中回调。 |
-| onActionEnd(callback: (event?: GestureEvent) => void) | Pan手势识别成功，手指抬起后触发回调。 |
-| onActionCancel(callback: () => void) | Pan手势识别成功，接收到触摸取消事件触发回调。 |
+| 名称 | 功能描述 |
+| ---------------------------------------- | ------------------------ |
+| onActionStart(callback: (event?: GestureEvent) => void) | Pan手势识别成功回调。 |
+| onActionUpdate(callback: (event?: GestureEvent) => void) | Pan手势移动过程中回调。 |
+| onActionEnd(callback: (event?: GestureEvent) => void) | Pan手势识别成功，手指抬起后触发回调。 |
+| onActionCancel(callback: () => void) | Pan手势识别成功，接收到触摸取消事件触发回调。 |
-- GestureEvent对象中与Pan手势相关的属性
- | 属性名称 | 属性类型 | 描述 |
- | -------- | -------- | -------- |
- | offsetX | number | 手势事件偏移量，单位为vp。 |
- | offsetY | number | 手势事件偏移量，单位为vp。 |
+## GestureEvent对象中与Pan手势相关的属性
+| 属性名称 | 属性类型 | 描述 |
+| ------- | ------ | -------------- |
+| offsetX | number | 手势事件偏移量，单位为vp。 |
+| offsetY | number | 手势事件偏移量，单位为vp。 |
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct PanGestureExample {
diff --git 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
index 267062aa0c72aa7619d07f3eee617a09b4919b0f..9a0c0617016eeaba265be78b3ebda0a10704d4aa 100644
--- 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
@@ -1,7 +1,8 @@
# PinchGesture
->  **说明：**
-> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+> **说明：**
+>
+> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
## 权限列表
@@ -13,33 +14,34 @@
PinchGesture(options?: { fingers?: number, distance?: number })
-- 参数
- | 参数名称 | 参数类型 | 必填 | 默认值 | 参数描述 |
- | -------- | -------- | -------- | -------- | -------- |
- | fingers | number | 否 | 2 | 触发捏合的最少手指数, 最小为2指，最大为5指。 |
- | distance | number | 否 | 3.0 | 最小识别距离，单位为vp。 |
+**参数：**
+| 参数名称 | 参数类型 | 必填 | 默认值 | 参数描述 |
+| -------- | ------ | ---- | ---- | ----------------------------- |
+| fingers | number | 否 | 2 | 触发捏合的最少手指数, 最小为2指，最大为5指。 |
+| distance | number | 否 | 3.0 | 最小识别距离，单位为vp。 |
## 事件
-| 名称 | 功能描述 |
-| -------- | -------- |
-| onActionStart((event?: GestureEvent) => void) | Pinch手势识别成功回调。 |
-| onActionUpdate((event?: GestureEvent) => void) | Pinch手势移动过程中回调。 |
-| onActionEnd((event?: GestureEvent) => void) | Pinch手势识别成功，手指抬起后触发回调。 |
+| 名称 | 功能描述 |
+| ---------------------------------------- | -------------------------- |
+| onActionStart((event?: GestureEvent) => void) | Pinch手势识别成功回调。 |
+| onActionUpdate((event?: GestureEvent) => void) | Pinch手势移动过程中回调。 |
+| onActionEnd((event?: GestureEvent) => void) | Pinch手势识别成功，手指抬起后触发回调。 |
| onActionCancel(event: () => void) | Pinch手势识别成功，接收到触摸取消事件触发回调。 |
-- GestureEvent对象中与Pinch手势相关的属性
- | 属性名称 | 属性类型 | 描述 |
- | -------- | -------- | -------- |
- | scale | number | 缩放比例，用于PinchGesture手势触发场景。 |
- | pinchCenterX | number | 捏合手势中心点X轴坐标，单位为px。 |
- | pinchCenterY | number | 捏合手势中心点Y轴坐标，单位为px。 |
+## GestureEvent对象中与Pinch手势相关的属性
+| 属性名称 | 属性类型 | 描述 |
+| ------------ | ------ | -------------------------- |
+| scale | number | 缩放比例，用于PinchGesture手势触发场景。 |
+| pinchCenterX | number | 捏合手势中心点X轴坐标，单位为px。 |
+| pinchCenterY | number | 捏合手势中心点Y轴坐标，单位为px。 |
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct PinchGestureExample {
diff --git 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
index 32db06fd1db4de26038f8a53d6380fd4a3d62d8a..b7d7b34289a953ae15aa191215dec83e362093bd 100644
--- 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
@@ -1,7 +1,8 @@
# RotationGesture
->  **说明：**
-> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+> **说明：**
+>
+> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
## 权限列表
@@ -13,31 +14,32 @@
RotationGesture(options?: { fingers?: number, angle?: number })
-- 参数
- | 参数名称 | 参数类型 | 必填 | 默认值 | 参数描述 |
- | -------- | -------- | -------- | -------- | -------- |
- | fingers | number | 否 | 2 | 触发旋转的最少手指数, 最小为2指，最大为5指。 |
- | angle | number | 否 | 1.0 | 触发旋转手势的最小改变度数，单位为度数。 |
+**参数：**
+| 参数名称 | 参数类型 | 必填 | 默认值 | 参数描述 |
+| ------- | ------ | ---- | ---- | ----------------------------- |
+| fingers | number | 否 | 2 | 触发旋转的最少手指数, 最小为2指，最大为5指。 |
+| angle | number | 否 | 1.0 | 触发旋转手势的最小改变度数，单位为度数。 |
## 事件
-| 名称 | 功能描述 |
-| -------- | -------- |
-| onActionStart((event?: GestureEvent) => void) | Rotation手势识别成功回调。 |
-| onActionUpdate((event?: GestureEvent) => void) | Rotation手势移动过程中回调。 |
-| onActionEnd((event?: GestureEvent) => void) | Rotation手势识别成功，手指抬起后触发回调。 |
-| onActionCancel(event: () => void) | Rotation手势识别成功，接收到触摸取消事件触发回调。 |
+| 名称 | 功能描述 |
+| ---------------------------------------- | ----------------------------- |
+| onActionStart((event?: GestureEvent) => void) | Rotation手势识别成功回调。 |
+| onActionUpdate((event?: GestureEvent) => void) | Rotation手势移动过程中回调。 |
+| onActionEnd((event?: GestureEvent) => void) | Rotation手势识别成功，手指抬起后触发回调。 |
+| onActionCancel(event: () => void) | Rotation手势识别成功，接收到触摸取消事件触发回调。 |
-- GestureEvent对象中与Rotation手势相关的属性
- | 属性名称 | 属性类型 | 描述 |
- | -------- | -------- | -------- |
- | angle | number | 旋转角度。 |
+## GestureEvent对象中与Rotation手势相关的属性
+| 属性名称 | 属性类型 | 描述 |
+| ----- | ------ | ----- |
+| angle | number | 旋转角度。 |
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct RotationGestureExample {
diff --git 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
index 0ebf5535e22e0369dcdf47e63bce381a25128229..7ed289a2dbb41da40eafbfad3b991a956ddb61b3 100644
--- 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
@@ -1,7 +1,8 @@
# SwipeGesture
->  **说明：**
-> 从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+> **说明：**
+>
+> 从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
## 权限列表
@@ -13,38 +14,40 @@
SwipeGesture(value?: { fingers?: number; direction?: SwipeDirection; speed?: number })
-- 参数
- | 参数名称 | 参数类型 | 必填 | 默认值 | 参数描述 |
- | -------- | -------- | -------- | -------- | -------- |
- | fingers | number | 否 | 1 | 触发滑动的最少手指数，默认为1，最小为1指，最大为10指。 |
- | direction | SwipeDirection | 否 | SwipeDirection.All | 滑动方向。 |
- | speed | number | 否 | 100 | 识别滑动的最小速度（100VP/秒）。 |
+**参数：**
-- SwipeDirection枚举说明
- | 名称 | 描述 |
- | -------- | -------- |
- | All | 所有方向。 |
- | Horizontal | 水平方向。 |
- | Vertical | 竖直方向。 |
+| 参数名称 | 参数类型 | 必填 | 默认值 | 参数描述 |
+| --------- | -------------- | ---- | ------------------ | ----------------------------- |
+| fingers | number | 否 | 1 | 触发滑动的最少手指数，默认为1，最小为1指，最大为10指。 |
+| direction | SwipeDirection | 否 | SwipeDirection.All | 滑动方向。 |
+| speed | number | 否 | 100 | 识别滑动的最小速度（100VP/秒）。 |
+## SwipeDirection枚举说明
+
+| 名称 | 描述 |
+| ---------- | ----- |
+| All | 所有方向。 |
+| Horizontal | 水平方向。 |
+| Vertical | 竖直方向。 |
## 事件
-| 名称 | 功能描述 |
-| -------- | -------- |
-| onAction(callback:(event?: GestureEvent) => void) | 滑动手势识别成功回调。 |
+| 名称 | 功能描述 |
+| ---------------------------------------- | ----------- |
+| onAction(callback:(event?: GestureEvent) => void) | 滑动手势识别成功回调。 |
+## GestureEvent对象中与Swipe手势相关的属性
-- GestureEvent对象中与Swipe手势相关的属性
- | 参数名 | 类型 | 说明 |
- | -------- | -------- | -------- |
- | angle | number | 滑动手势的角度，即两根手指间的线段与水平方向的夹角变化的度数。
>  **说明：**
> 角度计算方式：滑动手势被识别到后，连接两根手指之间的线被识别为起始线条，随着手指的滑动，手指之间的线条会发生旋转，根据起始线条两端点和当前线条两端点的坐标，使用反正切函数分别计算其相对于水平方向的夹角，最后arctan2(cy2-cy1,cx2-cx1)-arctan2(y2-y1,x2-x1)为旋转的角度。以起始线条为坐标系，顺时针旋转为0到180度，逆时针旋转为-180到0度。 |
- | speed | number | 滑动手势的速度，是所有手指滑动的平均速度，单位为VP/秒。 |
+| 参数名 | 类型 | 说明 |
+| ----- | ------ | ---------------------------------------- |
+| angle | number | 滑动手势的角度，即两根手指间的线段与水平方向的夹角变化的度数。
> **说明：**
> 角度计算方式：滑动手势被识别到后，连接两根手指之间的线被识别为起始线条，随着手指的滑动，手指之间的线条会发生旋转，根据起始线条两端点和当前线条两端点的坐标，使用反正切函数分别计算其相对于水平方向的夹角，最后arctan2(cy2-cy1,cx2-cx1)-arctan2(y2-y1,x2-x1)为旋转的角度。以起始线条为坐标系，顺时针旋转为0到180度，逆时针旋转为-180到0度。 |
+| speed | number | 滑动手势的速度，是所有手指滑动的平均速度，单位为VP/秒。 |
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct SwipeGestureExample {
diff --git 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
index eed7d440cf94d98e301a8511c8338498fb024304..4c332ec0f342a372c72e8a3074c88675d8c2b956 100644
--- 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
@@ -1,7 +1,8 @@
# TapGesture
->  **说明：**
-> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+> **说明：**
+>
+> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
## 权限列表
@@ -13,23 +14,24 @@
TapGesture(options?: { count?: number, fingers?: number })
-- 参数
- | 参数名称 | 参数类型 | 必填 | 默认值 | 参数描述 |
- | -------- | -------- | -------- | -------- | -------- |
- | count | number | 否 | 1 | 识别的连续点击次数。如果设置小于1，会被转化为默认值。
>  **说明：**
> 如配置多击，上一次抬起和下一次按下的超时时间为300毫秒（ms）。 |
- | fingers | number | 否 | 1 | 触发点击的最少手指数，最小为1指， 最大为10指。
>  **说明：**
> 1. 当配置多指时，第一根手指按下后300毫秒（ms）内未有足够的手指数按下，手势识别失败。
>
> 2. 实际点击手指数超过配置值，手势识别失败。 |
+**参数：**
+| 参数名称 | 参数类型 | 必填 | 默认值 | 参数描述 |
+| ------- | ------ | ---- | ---- | ---------------------------------------- |
+| count | number | 否 | 1 | 识别的连续点击次数。如果设置小于1，会被转化为默认值。
> **说明：**
> 如配置多击，上一次抬起和下一次按下的超时时间为300毫秒（ms）。 |
+| fingers | number | 否 | 1 | 触发点击的最少手指数，最小为1指， 最大为10指。
> **说明：**
> 1. 当配置多指时，第一根手指按下后300毫秒（ms）内未有足够的手指数按下，手势识别失败。
>
> 2. 实际点击手指数超过配置值，手势识别失败。 |
## 事件
-| 名称 | 功能描述 |
-| -------- | -------- |
-| onAction((event?: [GestureEvent](ts-gesture-settings.md)) => void) | Tap手势识别成功回调。 |
+| 名称 | 功能描述 |
+| ---------------------------------------- | ------------ |
+| onAction((event?: [GestureEvent](ts-gesture-settings.md)) => void) | Tap手势识别成功回调。 |
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct TapGestureExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-canvasrenderingcontext2d.md b/zh-cn/application-dev/reference/arkui-ts/ts-canvasrenderingcontext2d.md
index 198ae125187f3c4ace88a6618f3320affc64499d..08db299f856f4fdae23a238e0bc16c6c6bfcdee4 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-canvasrenderingcontext2d.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-canvasrenderingcontext2d.md
@@ -1,7 +1,8 @@
# CanvasRenderingContext2D对象
->  **说明：**
-> 从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+> **说明：**
+>
+> 从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
使用RenderingContext在Canvas组件上进行绘制，绘制对象可以是矩形、文本、图片等。
@@ -11,10 +12,11 @@
CanvasRenderingContext2D(setting: RenderingContextSetting)
-- 参数
- | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
- | ------- | ---------------------------------------- | ---- | ---- | ---------------------------------------- |
- | setting | [RenderingContextSettings](#renderingcontextsettings) | 是 | - | 见[RenderingContextSettings](#renderingcontextsettings)。 |
+**参数：**
+
+| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
+| ------- | ---------------------------------------- | ---- | ---- | ---------------------------------------- |
+| setting | [RenderingContextSettings](#renderingcontextsettings) | 是 | - | 见[RenderingContextSettings](#renderingcontextsettings)。 |
### RenderingContextSettings
@@ -23,10 +25,10 @@ RenderingContextSettings(antialias?: bool)
用来配置CanvasRenderingContext2D对象的参数，包括是否开启抗锯齿。
-- 参数
- | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
- | --------- | ---- | ---- | ----- | ---------------- |
- | antialias | bool | 否 | false | 表明canvas是否开启抗锯齿。 |
+**参数：**
+| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
+| --------- | ---- | ---- | ----- | ---------------- |
+| antialias | bool | 否 | false | 表明canvas是否开启抗锯齿。 |
## 属性
@@ -40,7 +42,7 @@ RenderingContextSettings(antialias?: bool)
| [lineJoin](#linejoin) | string | 'miter' | 指定线段间相交的交点样式，可选值为：
- 'round'：在线段相连处绘制一个扇形，扇形的圆角半径是线段的宽度。
- 'bevel'：在线段相连处使用三角形为底填充， 每个部分矩形拐角独立。
- 'miter'：在相连部分的外边缘处进行延伸，使其相交于一点，形成一个菱形区域，该属性可以通过设置miterLimit属性展现效果。 |
| [miterLimit](#miterlimit) | number | 10 | 设置斜接面限制值，该值指定了线条相交处内角和外角的距离。 |
| [font](#font) | string | 'normal normal 14px sans-serif' | 设置文本绘制中的字体样式。
语法：ctx.font='font-size font-family'
- font-size(可选)，指定字号和行高，单位只支持px。
- font-family(可选)，指定字体系列。
语法：ctx.font='font-style font-weight font-size font-family'
- font-style(可选)，用于指定字体样式，支持如下几种样式：'normal',talic。
- font-weight(可选)，用于指定字体的粗细，支持如下几种类型：'normal', 'bold', 'bolder', 'lighter', 100, 200, 300, 400, 500, 600, 700, 800, 900。
- font-size(可选)，指定字号和行高，单位只支持px。
- font-family(可选)，指定字体系列，支持如下几种类型：'sans-serif', 'serif', 'monospace'。 |
-| [textAlign](#textalign) | string | 'left' | 设置文本绘制中的文本对齐方式，可选值为：
- 'left'：文本左对齐。
- 'right'：文本右对齐。
- 'center'：文本居中对齐。
- 'start'：文本对齐界线开始的地方。
- 'end'：文本对齐界线结束的地方。
>  **说明：**
> ltr布局模式下'start'和'left'一致，rtl布局模式下'start'和'right'一致·。 |
+| [textAlign](#textalign) | string | 'left' | 设置文本绘制中的文本对齐方式，可选值为：
- 'left'：文本左对齐。
- 'right'：文本右对齐。
- 'center'：文本居中对齐。
- 'start'：文本对齐界线开始的地方。
- 'end'：文本对齐界线结束的地方。
> **说明：**
> ltr布局模式下'start'和'left'一致，rtl布局模式下'start'和'right'一致·。 |
| [textBaseline](#textbaseline) | string | 'alphabetic' | 设置文本绘制中的水平对齐方式，可选值为：
- 'alphabetic'：文本基线是标准的字母基线。
- 'top'：文本基线在文本块的顶部。
- 'hanging'：文本基线是悬挂基线。
- 'middle'：文本基线在文本块的中间。
- 'ideographic'：文字基线是表意字基线；如果字符本身超出了alphabetic基线，那么ideograhpic基线位置在字符本身的底部。
- 'bottom'：文本基线在文本块的底部。 与ideographic基线的区别在于ideographic基线不需要考虑下行字母。 |
| [globalAlpha](#globalalpha) | number | - | 设置透明度，0.0为完全透明，1.0为完全不透明。 |
| [lineDashOffset](#linedashoffset) | number | 0.0 | 设置画布的虚线偏移量，精度为float。 |
@@ -52,13 +54,15 @@ RenderingContextSettings(antialias?: bool)
| [imageSmoothingEnabled](#imagesmoothingenabled) | boolean | true | 用于设置绘制图片时是否进行图像平滑度调整，true为启用，false为不启用。 |
| imageSmoothingQuality | string | 'low' | 用于设置图像平滑度，支持如下三种类型：'low', 'medium', 'high'。 |
->  **说明：**
-> <color>类型格式为 'rgb(255, 255, 255)'，'rgba(255, 255, 255, 1.0)'，'\#FFFFFF'。
+> **说明：**
+>
+> <color>类型格式为 'rgb(255, 255, 255)'，'rgba(255, 255, 255, 1.0)'，'\#FFFFFF'。
### fillStyle
-```
+```ts
+// xxx.ets
@Entry
@Component
struct FillStyleExample {
@@ -87,7 +91,8 @@ struct FillStyleExample {
### lineWidth
-```
+```ts
+// xxx.ets
@Entry
@Component
struct LineWidthExample {
@@ -116,7 +121,8 @@ struct LineWidthExample {
### strokeStyle
-```
+```ts
+// xxx.ets
@Entry
@Component
struct StrokeStyleExample {
@@ -147,7 +153,8 @@ struct StrokeStyleExample {
### lineCap
-```
+```ts
+// xxx.ets
@Entry
@Component
struct LineCapExample {
@@ -180,7 +187,8 @@ struct LineCapExample {
### lineJoin
-```
+```ts
+// xxx.ets
@Entry
@Component
struct LineJoinExample {
@@ -214,7 +222,8 @@ struct LineJoinExample {
### miterLimit
-```
+```ts
+// xxx.ets
@Entry
@Component
struct MiterLimit {
@@ -248,7 +257,8 @@ struct MiterLimit {
### font
-```
+```ts
+// xxx.ets
@Entry
@Component
struct Fonts {
@@ -277,7 +287,8 @@ struct Fonts {
### textAlign
-```
+```ts
+// xxx.ets
@Entry
@Component
struct CanvasExample {
@@ -321,7 +332,8 @@ struct CanvasExample {
### textBaseline
-```
+```ts
+// xxx.ets
@Entry
@Component
struct TextBaseline {
@@ -365,7 +377,8 @@ struct TextBaseline {
### globalAlpha
-```
+```ts
+// xxx.ets
@Entry
@Component
struct GlobalAlpha {
@@ -397,7 +410,8 @@ struct GlobalAlpha {
### lineDashOffset
-```
+```ts
+// xxx.ets
@Entry
@Component
struct LineDashOffset {
@@ -441,7 +455,8 @@ struct LineDashOffset {
| copy | 显示新绘制内容而忽略现有绘制内容。 |
| xor | 使用异或操作对新绘制内容与现有绘制内容进行融合。 |
-```
+```ts
+// xxx.ets
@Entry
@Component
struct GlobalCompositeOperation {
@@ -478,7 +493,8 @@ struct GlobalCompositeOperation {
### shadowBlur
-```
+```ts
+// xxx.ets
@Entry
@Component
struct ShadowBlur {
@@ -509,7 +525,8 @@ struct ShadowBlur {
### shadowColor
-```
+```ts
+// xxx.ets
@Entry
@Component
struct ShadowColor {
@@ -540,7 +557,8 @@ struct ShadowColor {
### shadowOffsetX
-```
+```ts
+// xxx.ets
@Entry
@Component
struct ShadowOffsetX {
@@ -572,7 +590,8 @@ struct ShadowOffsetX {
### shadowOffsetY
-```
+```ts
+// xxx.ets
@Entry
@Component
struct ShadowOffsetY {
@@ -603,7 +622,8 @@ struct ShadowOffsetY {
### imageSmoothingEnabled
-```
+```ts
+// xxx.ets
@Entry
@Component
struct ImageSmoothingEnabled {
@@ -640,15 +660,15 @@ fillRect(x: number, y: number, w: number, h: number): void
填充一个矩形。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 说明 |
- | ------ | ------ | ---- | ---- | ------------- |
- | x | number | 是 | 0 | 指定矩形左上角点的x坐标。 |
- | y | number | 是 | 0 | 指定矩形左上角点的y坐标。 |
- | width | number | 是 | 0 | 指定矩形的宽度。 |
- | height | number | 是 | 0 | 指定矩形的高度。 |
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 说明 |
+| ------ | ------ | ---- | ---- | ------------- |
+| x | number | 是 | 0 | 指定矩形左上角点的x坐标。 |
+| y | number | 是 | 0 | 指定矩形左上角点的y坐标。 |
+| width | number | 是 | 0 | 指定矩形的宽度。 |
+| height | number | 是 | 0 | 指定矩形的高度。 |
-- 示例
+**示例：**
```
@Entry
@Component
@@ -681,15 +701,15 @@ strokeRect(x: number, y: number, w: number, h: number): void
绘制具有边框的矩形，矩形内部不填充。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 说明 |
- | ------ | ------ | ---- | ---- | ------------ |
- | x | number | 是 | 0 | 指定矩形的左上角x坐标。 |
- | y | number | 是 | 0 | 指定矩形的左上角y坐标。 |
- | width | number | 是 | 0 | 指定矩形的宽度。 |
- | height | number | 是 | 0 | 指定矩形的高度。 |
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 说明 |
+| ------ | ------ | ---- | ---- | ------------ |
+| x | number | 是 | 0 | 指定矩形的左上角x坐标。 |
+| y | number | 是 | 0 | 指定矩形的左上角y坐标。 |
+| width | number | 是 | 0 | 指定矩形的宽度。 |
+| height | number | 是 | 0 | 指定矩形的高度。 |
-- 示例
+**示例：**
```
@Entry
@Component
@@ -721,15 +741,15 @@ clearRect(x: number, y: number, w: number, h: number): void
删除指定区域内的绘制内容。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | ------ | ------ | ---- | ---- | ------------- |
- | x | number | 是 | 0 | 指定矩形上的左上角x坐标。 |
- | y | number | 是 | 0 | 指定矩形上的左上角y坐标。 |
- | width | number | 是 | 0 | 指定矩形的宽度。 |
- | height | number | 是 | 0 | 指定矩形的高度。 |
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 描述 |
+| ------ | ------ | ---- | ---- | ------------- |
+| x | number | 是 | 0 | 指定矩形上的左上角x坐标。 |
+| y | number | 是 | 0 | 指定矩形上的左上角y坐标。 |
+| width | number | 是 | 0 | 指定矩形的宽度。 |
+| height | number | 是 | 0 | 指定矩形的高度。 |
-- 示例
+**示例：**
```
@Entry
@Component
@@ -763,14 +783,14 @@ fillText(text: string, x: number, y: number): void
绘制填充类文本。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 说明 |
- | ---- | ------ | ---- | ---- | --------------- |
- | text | string | 是 | “” | 需要绘制的文本内容。 |
- | x | number | 是 | 0 | 需要绘制的文本的左下角x坐标。 |
- | y | number | 是 | 0 | 需要绘制的文本的左下角y坐标。 |
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 说明 |
+| ---- | ------ | ---- | ---- | --------------- |
+| text | string | 是 | “” | 需要绘制的文本内容。 |
+| x | number | 是 | 0 | 需要绘制的文本的左下角x坐标。 |
+| y | number | 是 | 0 | 需要绘制的文本的左下角y坐标。 |
-- 示例
+**示例：**
```
@Entry
@Component
@@ -803,14 +823,14 @@ strokeText(text: string, x: number, y: number): void
绘制描边类文本。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | ---- | ------ | ---- | ---- | --------------- |
- | text | string | 是 | “” | 需要绘制的文本内容。 |
- | x | number | 是 | 0 | 需要绘制的文本的左下角x坐标。 |
- | y | number | 是 | 0 | 需要绘制的文本的左下角y坐标。 |
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 描述 |
+| ---- | ------ | ---- | ---- | --------------- |
+| text | string | 是 | “” | 需要绘制的文本内容。 |
+| x | number | 是 | 0 | 需要绘制的文本的左下角x坐标。 |
+| y | number | 是 | 0 | 需要绘制的文本的左下角y坐标。 |
-- 示例
+**示例：**
```
@Entry
@Component
@@ -843,10 +863,10 @@ measureText(text: string): TextMetrics
该方法返回一个文本测算的对象，通过该对象可以获取指定文本的宽度值。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 说明 |
- | ---- | ------ | ---- | ---- | ---------- |
- | text | string | 是 | "" | 需要进行测量的文本。 |
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 说明 |
+| ---- | ------ | ---- | ---- | ---------- |
+| text | string | 是 | "" | 需要进行测量的文本。 |
- 返回值
| 类型 | 说明 |
@@ -858,7 +878,7 @@ measureText(text: string): TextMetrics
| ----- | ------ | ------- |
| width | number | 字符串的宽度。 |
-- 示例
+**示例：**
```
@Entry
@Component
@@ -892,12 +912,12 @@ stroke(path?: Path2D): void
进行边框绘制操作。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | ---- | ---------------------------------------- | ---- | ---- | ------------ |
- | path | [Path2D](ts-components-canvas-path2d.md) | 否 | null | 需要绘制的Path2D。 |
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 描述 |
+| ---- | ---------------------------------------- | ---- | ---- | ------------ |
+| path | [Path2D](ts-components-canvas-path2d.md) | 否 | null | 需要绘制的Path2D。 |
-- 示例
+**示例：**
```
@Entry
@Component
@@ -933,7 +953,7 @@ beginPath(): void
创建一个新的绘制路径。
-- 示例
+**示例：**
```
@Entry
@Component
@@ -971,13 +991,13 @@ moveTo(x: number, y: number): void
路径从当前点移动到指定点。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 说明 |
- | ---- | ------ | ---- | ---- | --------- |
- | x | number | 是 | 0 | 指定位置的x坐标。 |
- | y | number | 是 | 0 | 指定位置的y坐标。 |
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 说明 |
+| ---- | ------ | ---- | ---- | --------- |
+| x | number | 是 | 0 | 指定位置的x坐标。 |
+| y | number | 是 | 0 | 指定位置的y坐标。 |
-- 示例
+**示例：**
```
@Entry
@Component
@@ -1013,13 +1033,13 @@ lineTo(x: number, y: number): void
从当前点到指定点进行路径连接。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | ---- | ------ | ---- | ---- | --------- |
- | x | number | 是 | 0 | 指定位置的x坐标。 |
- | y | number | 是 | 0 | 指定位置的y坐标。 |
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 描述 |
+| ---- | ------ | ---- | ---- | --------- |
+| x | number | 是 | 0 | 指定位置的x坐标。 |
+| y | number | 是 | 0 | 指定位置的y坐标。 |
-- 示例
+**示例：**
```
@Entry
@Component
@@ -1055,7 +1075,7 @@ closePath(): void
结束当前路径形成一个封闭路径。
-- 示例
+**示例：**
```
@Entry
@Component
@@ -1093,13 +1113,13 @@ createPattern(image: ImageBitmap, repetition: string): void
通过指定图像和重复方式创建图片填充的模板。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | ---------- | ---------------------------------------- | ---- | ---- | ---------------------------------------- |
- | image | [ImageBitmap](ts-components-canvas-imagebitmap.md) | 是 | null | 图源对象，具体参考ImageBitmap对象。 |
- | repetition | string | 是 | “” | 设置图像重复的方式，取值为：'repeat'、'repeat-x'、 'repeat-y'、'no-repeat'。 |
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 描述 |
+| ---------- | ---------------------------------------- | ---- | ---- | ---------------------------------------- |
+| image | [ImageBitmap](ts-components-canvas-imagebitmap.md) | 是 | null | 图源对象，具体参考ImageBitmap对象。 |
+| repetition | string | 是 | “” | 设置图像重复的方式，取值为：'repeat'、'repeat-x'、 'repeat-y'、'no-repeat'。 |
-- 示例
+**示例：**
```
@Entry
@Component
@@ -1135,17 +1155,17 @@ bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number,
创建三次贝赛尔曲线的路径。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | ---- | ------ | ---- | ---- | -------------- |
- | cp1x | number | 是 | 0 | 第一个贝塞尔参数的x坐标值。 |
- | cp1y | number | 是 | 0 | 第一个贝塞尔参数的y坐标值。 |
- | cp2x | number | 是 | 0 | 第二个贝塞尔参数的x坐标值。 |
- | cp2y | number | 是 | 0 | 第二个贝塞尔参数的y坐标值。 |
- | x | number | 是 | 0 | 路径结束时的x坐标值。 |
- | y | number | 是 | 0 | 路径结束时的y坐标值。 |
-
-- 示例
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 描述 |
+| ---- | ------ | ---- | ---- | -------------- |
+| cp1x | number | 是 | 0 | 第一个贝塞尔参数的x坐标值。 |
+| cp1y | number | 是 | 0 | 第一个贝塞尔参数的y坐标值。 |
+| cp2x | number | 是 | 0 | 第二个贝塞尔参数的x坐标值。 |
+| cp2y | number | 是 | 0 | 第二个贝塞尔参数的y坐标值。 |
+| x | number | 是 | 0 | 路径结束时的x坐标值。 |
+| y | number | 是 | 0 | 路径结束时的y坐标值。 |
+
+**示例：**
```
@Entry
@Component
@@ -1181,15 +1201,15 @@ quadraticCurveTo(cpx: number, cpy: number, x: number, y: number): void
创建二次贝赛尔曲线的路径。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | ---- | ------ | ---- | ---- | ----------- |
- | cpx | number | 是 | 0 | 贝塞尔参数的x坐标值。 |
- | cpy | number | 是 | 0 | 贝塞尔参数的y坐标值。 |
- | x | number | 是 | 0 | 路径结束时的x坐标值。 |
- | y | number | 是 | 0 | 路径结束时的y坐标值。 |
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 描述 |
+| ---- | ------ | ---- | ---- | ----------- |
+| cpx | number | 是 | 0 | 贝塞尔参数的x坐标值。 |
+| cpy | number | 是 | 0 | 贝塞尔参数的y坐标值。 |
+| x | number | 是 | 0 | 路径结束时的x坐标值。 |
+| y | number | 是 | 0 | 路径结束时的y坐标值。 |
-- 示例
+**示例：**
```
@Entry
@Component
@@ -1224,17 +1244,17 @@ arc(x: number, y: number, radius: number, startAngle: number, endAngle: number,
绘制弧线路径。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | ------------- | ------- | ---- | ----- | ---------- |
- | x | number | 是 | 0 | 弧线圆心的x坐标值。 |
- | y | number | 是 | 0 | 弧线圆心的y坐标值。 |
- | radius | number | 是 | 0 | 弧线的圆半径。 |
- | startAngle | number | 是 | 0 | 弧线的起始弧度。 |
- | endAngle | number | 是 | 0 | 弧线的终止弧度。 |
- | anticlockwise | boolean | 否 | false | 是否逆时针绘制圆弧。 |
-
-- 示例
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 描述 |
+| ------------- | ------- | ---- | ----- | ---------- |
+| x | number | 是 | 0 | 弧线圆心的x坐标值。 |
+| y | number | 是 | 0 | 弧线圆心的y坐标值。 |
+| radius | number | 是 | 0 | 弧线的圆半径。 |
+| startAngle | number | 是 | 0 | 弧线的起始弧度。 |
+| endAngle | number | 是 | 0 | 弧线的终止弧度。 |
+| anticlockwise | boolean | 否 | false | 是否逆时针绘制圆弧。 |
+
+**示例：**
```
@Entry
@Component
@@ -1269,16 +1289,16 @@ arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void
依据圆弧经过的点和圆弧半径创建圆弧路径。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | ------ | ------ | ---- | ---- | --------------- |
- | x1 | number | 是 | 0 | 圆弧经过的第一个点的x坐标值。 |
- | y1 | number | 是 | 0 | 圆弧经过的第一个点的y坐标值。 |
- | x2 | number | 是 | 0 | 圆弧经过的第二个点的x坐标值。 |
- | y2 | number | 是 | 0 | 圆弧经过的第二个点的y坐标值。 |
- | radius | number | 是 | 0 | 圆弧的圆半径值。 |
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 描述 |
+| ------ | ------ | ---- | ---- | --------------- |
+| x1 | number | 是 | 0 | 圆弧经过的第一个点的x坐标值。 |
+| y1 | number | 是 | 0 | 圆弧经过的第一个点的y坐标值。 |
+| x2 | number | 是 | 0 | 圆弧经过的第二个点的x坐标值。 |
+| y2 | number | 是 | 0 | 圆弧经过的第二个点的y坐标值。 |
+| radius | number | 是 | 0 | 圆弧的圆半径值。 |
-- 示例
+**示例：**
```
@Entry
@Component
@@ -1313,19 +1333,19 @@ ellipse(x: number, y: number, radiusX: number, radiusY: number, rotation: number
在规定的矩形区域绘制一个椭圆。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 说明 |
- | ------------- | ------- | ---- | ----- | ----------------- |
- | x | number | 是 | 0 | 椭圆圆心的x轴坐标。 |
- | y | number | 是 | 0 | 椭圆圆心的y轴坐标。 |
- | radiusX | number | 是 | 0 | 椭圆x轴的半径长度。 |
- | radiusY | number | 是 | 0 | 椭圆y轴的半径长度。 |
- | rotation | number | 是 | 0 | 椭圆的旋转角度，单位为弧度。 |
- | startAngle | number | 是 | 0 | 椭圆绘制的起始点角度，以弧度表示。 |
- | endAngle | number | 是 | 0 | 椭圆绘制的结束点角度，以弧度表示。 |
- | anticlockwise | boolean | 否 | false | 是否以逆时针方向绘制椭圆。 |
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 说明 |
+| ------------- | ------- | ---- | ----- | ----------------- |
+| x | number | 是 | 0 | 椭圆圆心的x轴坐标。 |
+| y | number | 是 | 0 | 椭圆圆心的y轴坐标。 |
+| radiusX | number | 是 | 0 | 椭圆x轴的半径长度。 |
+| radiusY | number | 是 | 0 | 椭圆y轴的半径长度。 |
+| rotation | number | 是 | 0 | 椭圆的旋转角度，单位为弧度。 |
+| startAngle | number | 是 | 0 | 椭圆绘制的起始点角度，以弧度表示。 |
+| endAngle | number | 是 | 0 | 椭圆绘制的结束点角度，以弧度表示。 |
+| anticlockwise | boolean | 否 | false | 是否以逆时针方向绘制椭圆。 |
-- 示例
+**示例：**
```
@Entry
@@ -1361,15 +1381,15 @@ rect(x: number, y: number, width: number, height: number): void
创建矩形路径。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | ------ | ------ | ---- | ---- | ------------- |
- | x | number | 是 | 0 | 指定矩形的左上角x坐标值。 |
- | y | number | 是 | 0 | 指定矩形的左上角y坐标值。 |
- | width | number | 是 | 0 | 指定矩形的宽度。 |
- | height | number | 是 | 0 | 指定矩形的高度。 |
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 描述 |
+| ------ | ------ | ---- | ---- | ------------- |
+| x | number | 是 | 0 | 指定矩形的左上角x坐标值。 |
+| y | number | 是 | 0 | 指定矩形的左上角y坐标值。 |
+| width | number | 是 | 0 | 指定矩形的宽度。 |
+| height | number | 是 | 0 | 指定矩形的高度。 |
-- 示例
+**示例：**
```
@Entry
@Component
@@ -1403,7 +1423,7 @@ fill(): void
对封闭路径进行填充。
-- 示例
+**示例：**
```
@Entry
@Component
@@ -1437,7 +1457,7 @@ clip(): void
设置当前路径为剪切路径。
-- 示例
+**示例：**
```
@Entry
@Component
@@ -1474,12 +1494,12 @@ rotate(rotate: number): void
针对当前坐标轴进行顺时针旋转。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | ------ | ------ | ---- | ---- | ---------------------------------------- |
- | rotate | number | 是 | 0 | 设置顺时针旋转的弧度值，可以通过Math.PI / 180将角度转换为弧度值。 |
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 描述 |
+| ------ | ------ | ---- | ---- | ---------------------------------------- |
+| rotate | number | 是 | 0 | 设置顺时针旋转的弧度值，可以通过Math.PI / 180将角度转换为弧度值。 |
-- 示例
+**示例：**
```
@Entry
@Component
@@ -1513,13 +1533,13 @@ scale(x: number, y: number): void
设置canvas画布的缩放变换属性，后续的绘制操作将按照缩放比例进行缩放。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | ---- | ------ | ---- | ---- | ----------- |
- | x | number | 是 | 0 | 设置水平方向的缩放值。 |
- | y | number | 是 | 0 | 设置垂直方向的缩放值。 |
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 描述 |
+| ---- | ------ | ---- | ---- | ----------- |
+| x | number | 是 | 0 | 设置水平方向的缩放值。 |
+| y | number | 是 | 0 | 设置垂直方向的缩放值。 |
-- 示例
+**示例：**
```
@Entry
@Component
@@ -1554,24 +1574,24 @@ transform(scaleX: number, skewX: number, skewY: number, scaleY: number, translat
transform方法对应一个变换矩阵，想对一个图形进行变化的时候，只要设置此变换矩阵相应的参数，对图形的各个定点的坐标分别乘以这个矩阵，就能得到新的定点的坐标。矩阵变换效果可叠加。
->  **说明：**
-> 变换后的坐标计算方式（x和y为变换前坐标，x'和y'为变换后坐标）：
+> **说明：**
+> 变换后的坐标计算方式（x和y为变换前坐标，x'和y'为变换后坐标）：
>
-> - x' = scaleX \* x + skewY \* y + translateX
+> - x' = scaleX \* x + skewY \* y + translateX
>
-> - y' = skewX \* x + scaleY \* y + translateY
-
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | ---------- | ------ | ---- | ---- | -------- |
- | scaleX | number | 是 | 0 | 指定水平缩放值。 |
- | skewX | number | 是 | 0 | 指定水平倾斜值。 |
- | skewY | number | 是 | 0 | 指定垂直倾斜值。 |
- | scaleY | number | 是 | 0 | 指定垂直缩放值。 |
- | translateX | number | 是 | 0 | 指定水平移动值。 |
- | translateY | number | 是 | 0 | 指定垂直移动值。 |
-
-- 示例
+> - y' = skewX \* x + scaleY \* y + translateY
+
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 描述 |
+| ---------- | ------ | ---- | ---- | -------- |
+| scaleX | number | 是 | 0 | 指定水平缩放值。 |
+| skewX | number | 是 | 0 | 指定水平倾斜值。 |
+| skewY | number | 是 | 0 | 指定垂直倾斜值。 |
+| scaleY | number | 是 | 0 | 指定垂直缩放值。 |
+| translateX | number | 是 | 0 | 指定水平移动值。 |
+| translateY | number | 是 | 0 | 指定垂直移动值。 |
+
+**示例：**
```
@Entry
@Component
@@ -1611,17 +1631,17 @@ setTransform(scaleX: number, skewX: number, skewY: number, scale: number, transl
setTransfrom方法使用的参数和transform()方法相同，但setTransform()方法会重置现有的变换矩阵并创建新的变换矩阵。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | ---------- | ------ | ---- | ---- | -------- |
- | scaleX | number | 是 | 0 | 指定水平缩放值。 |
- | skewX | number | 是 | 0 | 指定水平倾斜值。 |
- | skewY | number | 是 | 0 | 指定垂直倾斜值。 |
- | scaleY | number | 是 | 0 | 指定垂直缩放值。 |
- | translateX | number | 是 | 0 | 指定水平移动值。 |
- | translateY | number | 是 | 0 | 指定垂直移动值。 |
-
-- 示例
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 描述 |
+| ---------- | ------ | ---- | ---- | -------- |
+| scaleX | number | 是 | 0 | 指定水平缩放值。 |
+| skewX | number | 是 | 0 | 指定水平倾斜值。 |
+| skewY | number | 是 | 0 | 指定垂直倾斜值。 |
+| scaleY | number | 是 | 0 | 指定垂直缩放值。 |
+| translateX | number | 是 | 0 | 指定水平移动值。 |
+| translateY | number | 是 | 0 | 指定垂直移动值。 |
+
+**示例：**
```
@Entry
@Component
@@ -1658,13 +1678,13 @@ translate(x: number, y: number): void
移动当前坐标系的原点。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | ---- | ------ | ---- | ---- | -------- |
- | x | number | 是 | 0 | 设置水平平移量。 |
- | y | number | 是 | 0 | 设置竖直平移量。 |
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 描述 |
+| ---- | ------ | ---- | ---- | -------- |
+| x | number | 是 | 0 | 设置水平平移量。 |
+| y | number | 是 | 0 | 设置竖直平移量。 |
-- 示例
+**示例：**
```
@Entry
@Component
@@ -1703,21 +1723,21 @@ drawImage(image: ImageBitmap | PixelMap, sx: number, sy: number, sWidth: number,
进行图像绘制。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | ------- | ---------------------------------------- | ---- | ---- | ---------------------------------------- |
- | image | [ImageBitmap](ts-components-canvas-imagebitmap.md)或[PixelMap](../apis/js-apis-image.md#pixelmap7) | 是 | null | 图片资源，请参考ImageBitmap或PixelMap。 |
- | sx | number | 否 | 0 | 裁切源图像时距离源图像左上角的x坐标值。 |
- | sy | number | 否 | 0 | 裁切源图像时距离源图像左上角的y坐标值。 |
- | sWidth | number | 否 | 0 | 裁切源图像时需要裁切的宽度。 |
- | sHeight | number | 否 | 0 | 裁切源图像时需要裁切的高度。 |
- | dx | number | 是 | 0 | 绘制区域左上角在x轴的位置。 |
- | dy | number | 是 | 0 | 绘制区域左上角在y 轴的位置。 |
- | dWidth | number | 否 | 0 | 绘制区域的宽度。 当绘制区域的宽度和裁剪图像的宽度不一致时，将图像宽度拉伸或压缩为绘制区域的宽度。 |
- | dHeight | number | 否 | 0 | 绘制区域的高度。 当绘制区域的高度和裁剪图像的高度不一致时，将图像高度拉伸或压缩为绘制区域的高度。 |
-
-
-- 示例
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 描述 |
+| ------- | ---------------------------------------- | ---- | ---- | ---------------------------------------- |
+| image | [ImageBitmap](ts-components-canvas-imagebitmap.md)或[PixelMap](../apis/js-apis-image.md#pixelmap7) | 是 | null | 图片资源，请参考ImageBitmap或PixelMap。 |
+| sx | number | 否 | 0 | 裁切源图像时距离源图像左上角的x坐标值。 |
+| sy | number | 否 | 0 | 裁切源图像时距离源图像左上角的y坐标值。 |
+| sWidth | number | 否 | 0 | 裁切源图像时需要裁切的宽度。 |
+| sHeight | number | 否 | 0 | 裁切源图像时需要裁切的高度。 |
+| dx | number | 是 | 0 | 绘制区域左上角在x轴的位置。 |
+| dy | number | 是 | 0 | 绘制区域左上角在y 轴的位置。 |
+| dWidth | number | 否 | 0 | 绘制区域的宽度。 当绘制区域的宽度和裁剪图像的宽度不一致时，将图像宽度拉伸或压缩为绘制区域的宽度。 |
+| dHeight | number | 否 | 0 | 绘制区域的高度。 当绘制区域的高度和裁剪图像的高度不一致时，将图像高度拉伸或压缩为绘制区域的高度。 |
+
+
+**示例：**
```
@Entry
@Component
@@ -1750,11 +1770,11 @@ createImageData(width: number, height: number): Object
创建新的ImageData 对象，请参考[ImageData](ts-components-canvas-imagebitmap.md)。
-- 参数
- | 参数 | 类型 | 必填 | 默认 | 描述 |
- | ------ | ------ | ---- | ---- | ------------- |
- | width | number | 是 | 0 | ImageData的宽度。 |
- | height | number | 是 | 0 | ImageData的高度。 |
+**参数：**
+| 参数 | 类型 | 必填 | 默认 | 描述 |
+| ------ | ------ | ---- | ---- | ------------- |
+| width | number | 是 | 0 | ImageData的宽度。 |
+| height | number | 是 | 0 | ImageData的高度。 |
### createImageData
@@ -1763,36 +1783,36 @@ createImageData(imageData: Object): Object
创建新的ImageData 对象，请参考[ImageData](ts-components-canvas-imagebitmap.md)。
-- 参数
- | 参数 | 类型 | 必填 | 默认 | 描述 |
- | --------- | ------ | ---- | ---- | ----------------- |
- | imagedata | Object | 是 | null | 复制现有的ImageData对象。 |
+**参数：**
+| 参数 | 类型 | 必填 | 默认 | 描述 |
+| --------- | ------ | ---- | ---- | ----------------- |
+| imagedata | Object | 是 | null | 复制现有的ImageData对象。 |
### getPixelMap
getPixelMap(sx: number, sy: number, sw: number, sh: number): PixelMap
以当前canvas指定区域内的像素创建[PixelMap](../apis/js-apis-image.md#pixelmap7)对象。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | ---- | ------ | ---- | ---- | --------------- |
- | sx | number | 是 | 0 | 需要输出的区域的左上角x坐标。 |
- | sy | number | 是 | 0 | 需要输出的区域的左上角y坐标。 |
- | sw | number | 是 | 0 | 需要输出的区域的宽度。 |
- | sh | number | 是 | 0 | 需要输出的区域的高度。 |
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 描述 |
+| ---- | ------ | ---- | ---- | --------------- |
+| sx | number | 是 | 0 | 需要输出的区域的左上角x坐标。 |
+| sy | number | 是 | 0 | 需要输出的区域的左上角y坐标。 |
+| sw | number | 是 | 0 | 需要输出的区域的宽度。 |
+| sh | number | 是 | 0 | 需要输出的区域的高度。 |
### getImageData
getImageData(sx: number, sy: number, sw: number, sh: number): Object
以当前canvas指定区域内的像素创建[ImageData](ts-components-canvas-imagebitmap.md)对象。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | ---- | ------ | ---- | ---- | --------------- |
- | sx | number | 是 | 0 | 需要输出的区域的左上角x坐标。 |
- | sy | number | 是 | 0 | 需要输出的区域的左上角y坐标。 |
- | sw | number | 是 | 0 | 需要输出的区域的宽度。 |
- | sh | number | 是 | 0 | 需要输出的区域的高度。 |
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 描述 |
+| ---- | ------ | ---- | ---- | --------------- |
+| sx | number | 是 | 0 | 需要输出的区域的左上角x坐标。 |
+| sy | number | 是 | 0 | 需要输出的区域的左上角y坐标。 |
+| sw | number | 是 | 0 | 需要输出的区域的宽度。 |
+| sh | number | 是 | 0 | 需要输出的区域的高度。 |
### putImageData
@@ -1801,18 +1821,18 @@ putImageData(imageData: Object, dx: number, dy: number, dirtyX?: number, dirtyY?
使用[ImageData](ts-components-canvas-imagebitmap.md)数据填充新的矩形区域。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | ----------- | ------ | ---- | ------------ | ----------------------------- |
- | imagedata | Object | 是 | null | 包含像素值的ImageData对象。 |
- | dx | number | 是 | 0 | 填充区域在x轴方向的偏移量。 |
- | dy | number | 是 | 0 | 填充区域在y轴方向的偏移量。 |
- | dirtyX | number | 否 | 0 | 源图像数据矩形裁切范围左上角距离源图像左上角的x轴偏移量。 |
- | dirtyY | number | 否 | 0 | 源图像数据矩形裁切范围左上角距离源图像左上角的y轴偏移量。 |
- | dirtyWidth | number | 否 | imagedata的宽度 | 源图像数据矩形裁切范围的宽度。 |
- | dirtyHeight | number | 否 | imagedata的高度 | 源图像数据矩形裁切范围的高度。 |
-
-- 示例
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 描述 |
+| ----------- | ------ | ---- | ------------ | ----------------------------- |
+| imagedata | Object | 是 | null | 包含像素值的ImageData对象。 |
+| dx | number | 是 | 0 | 填充区域在x轴方向的偏移量。 |
+| dy | number | 是 | 0 | 填充区域在y轴方向的偏移量。 |
+| dirtyX | number | 否 | 0 | 源图像数据矩形裁切范围左上角距离源图像左上角的x轴偏移量。 |
+| dirtyY | number | 否 | 0 | 源图像数据矩形裁切范围左上角距离源图像左上角的y轴偏移量。 |
+| dirtyWidth | number | 否 | imagedata的宽度 | 源图像数据矩形裁切范围的宽度。 |
+| dirtyHeight | number | 否 | imagedata的高度 | 源图像数据矩形裁切范围的高度。 |
+
+**示例：**
```
@Entry
@Component
@@ -1852,7 +1872,7 @@ restore(): void
对保存的绘图上下文进行恢复。
-- 示例
+**示例：**
```
@Entry
@Component
@@ -1883,7 +1903,7 @@ save(): void
对当前的绘图上下文进行保存。
-- 示例
+**示例：**
```
@Entry
@Component
@@ -1914,15 +1934,15 @@ createLinearGradient(x0: number, y0: number, x1: number, y1: number): void
创建一个线性渐变色。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | ---- | ------ | ---- | ---- | -------- |
- | x0 | number | 是 | 0 | 起点的x轴坐标。 |
- | y0 | number | 是 | 0 | 起点的y轴坐标。 |
- | x1 | number | 是 | 0 | 终点的x轴坐标。 |
- | y1 | number | 是 | 0 | 终点的y轴坐标。 |
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 描述 |
+| ---- | ------ | ---- | ---- | -------- |
+| x0 | number | 是 | 0 | 起点的x轴坐标。 |
+| y0 | number | 是 | 0 | 起点的y轴坐标。 |
+| x1 | number | 是 | 0 | 终点的x轴坐标。 |
+| y1 | number | 是 | 0 | 终点的y轴坐标。 |
-- 示例
+**示例：**
```
@Entry
@Component
@@ -1960,17 +1980,17 @@ createRadialGradient(x0: number, y0: number, r0: number, x1: number, y1: number,
创建一个径向渐变色。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | ---- | ------ | ---- | ---- | ----------------- |
- | x0 | number | 是 | 0 | 起始圆的x轴坐标。 |
- | y0 | number | 是 | 0 | 起始圆的y轴坐标。 |
- | r0 | number | 是 | 0 | 起始圆的半径。必须是非负且有限的。 |
- | x1 | number | 是 | 0 | 终点圆的x轴坐标。 |
- | y1 | number | 是 | 0 | 终点圆的y轴坐标。 |
- | r1 | number | 是 | 0 | 终点圆的半径。必须为非负且有限的。 |
-
-- 示例
+**参数：**
+| 参数 | 类型 | 必填 | 默认值 | 描述 |
+| ---- | ------ | ---- | ---- | ----------------- |
+| x0 | number | 是 | 0 | 起始圆的x轴坐标。 |
+| y0 | number | 是 | 0 | 起始圆的y轴坐标。 |
+| r0 | number | 是 | 0 | 起始圆的半径。必须是非负且有限的。 |
+| x1 | number | 是 | 0 | 终点圆的x轴坐标。 |
+| y1 | number | 是 | 0 | 终点圆的y轴坐标。 |
+| r1 | number | 是 | 0 | 终点圆的半径。必须为非负且有限的。 |
+
+**示例：**
```
@Entry
@Component
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-combined-gestures.md b/zh-cn/application-dev/reference/arkui-ts/ts-combined-gestures.md
index f191e2dc2335c0d0c3f08a8b49c08d1abd85be2c..391e14147694953eddcc178a7b91708a9d860670 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-combined-gestures.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-combined-gestures.md
@@ -1,7 +1,8 @@
# 组合手势
->  **说明：**
-> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+> **说明：**
+>
+> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
## 权限列表
@@ -13,30 +14,32 @@
GestureGroup(mode: GestureMode, ...gesture: GestureType[])
-- 参数
- | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
- | -------- | -------- | -------- | -------- | -------- |
- | mode | GestureMode | 是 | - | 设置组合手势识别模式。 |
- | gesture | [TapGesture](ts-basic-gestures-tapgesture.md)
\| [LongPressGesture](ts-basic-gestures-longpressgesture.md)
\| [PanGesture](ts-basic-gestures-pangesture.md)
\| [PinchGesture](ts-basic-gestures-pinchgesture.md)
\| [RotationGesture](ts-basic-gestures-rotationgesture.md) | 是 | - | 可变长参数，1个或者多个基础手势类型，这些手势会被组合识别。 |
+**参数：**
-- GestureMode枚举说明
- | 名称 | 描述 |
- | -------- | -------- |
- | Sequence | 顺序识别，按照手势的注册顺序识别手势，直到所有手势识别成功。当有一个手势识别失败时，所有手势识别失败。 |
- | Parallel | 并发识别，注册的手势同时识别，直到所有手势识别结束，手势识别互相不影响。 |
- | Exclusive | 互斥识别，注册的手势同时识别，若有一个手势识别成功，则结束手势识别。 |
+| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
+| ------- | ---------------------------------------- | ---- | ---- | ------------------------------ |
+| mode | GestureMode | 是 | - | 设置组合手势识别模式。 |
+| gesture | [TapGesture](ts-basic-gestures-tapgesture.md)
\| [LongPressGesture](ts-basic-gestures-longpressgesture.md)
\| [PanGesture](ts-basic-gestures-pangesture.md)
\| [PinchGesture](ts-basic-gestures-pinchgesture.md)
\| [RotationGesture](ts-basic-gestures-rotationgesture.md) | 是 | - | 可变长参数，1个或者多个基础手势类型，这些手势会被组合识别。 |
+## GestureMode枚举说明
+
+| 名称 | 描述 |
+| --------- | ---------------------------------------- |
+| Sequence | 顺序识别，按照手势的注册顺序识别手势，直到所有手势识别成功。当有一个手势识别失败时，所有手势识别失败。 |
+| Parallel | 并发识别，注册的手势同时识别，直到所有手势识别结束，手势识别互相不影响。 |
+| Exclusive | 互斥识别，注册的手势同时识别，若有一个手势识别成功，则结束手势识别。 |
## 事件
-| 名称 | 功能描述 |
-| -------- | -------- |
+| 名称 | 功能描述 |
+| ---------------------------------------- | ------------------------------------ |
| onCancel(event: () => void) | 顺序组合手势（GestureMode.Sequence）取消后触发回调。 |
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct GestureGroupExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-canvas.md b/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-canvas.md
index ea1d29106df1db7eedb5b28b8cec9fd43f5a51d1..32a14b8bc4e168b013a9f8380f68e43c1cb56231 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-canvas.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-canvas.md
@@ -1,6 +1,8 @@
# Canvas
->  **说明：** 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+> **说明：**
+>
+> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
提供画布组件，用于自定义绘制图形。
@@ -16,11 +18,11 @@
Canvas(context: CanvasRenderingContext2D)
-- 参数
+**参数：**
- | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
- | ------- | ---------------------------------------- | ---- | ---- | ---------------------------- |
- | context | [CanvasRenderingContext2D](ts-canvasrenderingcontext2d.md) | 是 | - | 见CanvasRenderingContext2D对象。 |
+| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
+| ------- | ---------------------------------------- | ---- | ---- | ---------------------------- |
+| context | [CanvasRenderingContext2D](ts-canvasrenderingcontext2d.md) | 是 | - | 见CanvasRenderingContext2D对象。 |
## 属性
@@ -36,7 +38,8 @@ Canvas(context: CanvasRenderingContext2D)
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct CanvasExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-canvasgradient.md b/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-canvasgradient.md
index aa0bc39520f2a1ea4dd66a314cb875425d0a339a..22b76489fe350fed7e67af969241eadb533a3487 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-canvasgradient.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-canvasgradient.md
@@ -1,7 +1,8 @@
# CanvasGradient对象
->  **说明：**
-> 从 API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+> **说明：**
+>
+> 从 API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
渐变对象。
@@ -13,39 +14,41 @@ addColorStop(offset: number, color: string): void
设置渐变断点值，包括偏移和颜色。
-- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | -------- | -------- | -------- | -------- | -------- |
- | offset | number | 是 | 0 | 设置渐变点距离起点的位置占总体长度的比例，范围为0到1。 |
- | color | string | 是 | 'ffffff' | 设置渐变的颜色。 |
-
-- 示例
- ```
- @Entry
- @Component
- struct Page45 {
- private settings: RenderingContextSettings = new RenderingContextSettings(true)
- private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
-
- build() {
- Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
- Canvas(this.context)
- .width('100%')
- .height('100%')
- .backgroundColor('#ffff00')
- .onReady(() =>{
- var grad = this.context.createLinearGradient(50,0, 300,100)
- grad.addColorStop(0.0, 'red')
- grad.addColorStop(0.5, 'white')
- grad.addColorStop(1.0, 'green')
- this.context.fillStyle = grad
- this.context.fillRect(0, 0, 500, 500)
- })
- }
- .width('100%')
- .height('100%')
+**参数：**
+
+| 参数 | 类型 | 必填 | 默认值 | 描述 |
+| ------ | ------ | ---- | -------- | ---------------------------- |
+| offset | number | 是 | 0 | 设置渐变点距离起点的位置占总体长度的比例，范围为0到1。 |
+| color | string | 是 | 'ffffff' | 设置渐变的颜色。 |
+
+**示例：**
+
+```ts
+@Entry
+@Component
+struct Page45 {
+ private settings: RenderingContextSettings = new RenderingContextSettings(true)
+ private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
+
+ build() {
+ Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
+ Canvas(this.context)
+ .width('100%')
+ .height('100%')
+ .backgroundColor('#ffff00')
+ .onReady(() =>{
+ var grad = this.context.createLinearGradient(50,0, 300,100)
+ grad.addColorStop(0.0, 'red')
+ grad.addColorStop(0.5, 'white')
+ grad.addColorStop(1.0, 'green')
+ this.context.fillStyle = grad
+ this.context.fillRect(0, 0, 500, 500)
+ })
}
+ .width('100%')
+ .height('100%')
}
- ```
+}
+```
- 
+
\ No newline at end of file
diff --git 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
index 4d29fbf8f32a1071465cc7c31be6fb0242c4a957..503f356cdfb8a25f2fd707d7f910198f409a4322 100644
--- 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
@@ -1,7 +1,8 @@
# ImageBitmap对象
->  **说明：**
-> 从 API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+> **说明：**
+>
+> 从 API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
CanvasImageData对象可以存储canvas渲染的像素数据。
@@ -9,8 +10,8 @@ CanvasImageData对象可以存储canvas渲染的像素数据。
## 属性
-| 属性 | 类型 | 描述 |
-| -------- | -------- | -------- |
-| width | number | 矩形区域实际像素宽度。 |
-| height | number | 矩形区域实际像素高度。 |
-| data | <Uint8ClampedArray> | 一维数组，保存了相应的颜色数据，数据值范围为0到255。 |
+| 属性 | 类型 | 描述 |
+| ------ | ------------------------- | ---------------------------- |
+| width | number | 矩形区域实际像素宽度。 |
+| height | number | 矩形区域实际像素高度。 |
+| data | <Uint8ClampedArray> | 一维数组，保存了相应的颜色数据，数据值范围为0到255。 |
diff --git 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
index 2e5d0d3546dad89a41f8fba0989681d50f4fbeae..7a0306444c98c9e9f42f4d966d7515813c554bc5 100644
--- 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
@@ -1,7 +1,8 @@
# ImageData对象
->  **说明：**
-> 从 API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+> **说明：**
+>
+> 从 API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
ImageData对象可以存储canvas渲染的像素数据。
@@ -9,8 +10,8 @@ ImageData对象可以存储canvas渲染的像素数据。
## 属性
-| 属性 | 类型 | 描述 |
-| -------- | -------- | -------- |
-| width | number | 矩形区域实际像素宽度。 |
-| height | number | 矩形区域实际像素高度。 |
-| data | <Uint8ClampedArray> | 一维数组，保存了相应的颜色数据，数据值范围为0到255。 |
+| 属性 | 类型 | 描述 |
+| ------ | ------------------------- | ---------------------------- |
+| width | number | 矩形区域实际像素宽度。 |
+| height | number | 矩形区域实际像素高度。 |
+| data | <Uint8ClampedArray> | 一维数组，保存了相应的颜色数据，数据值范围为0到255。 |
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-lottie.md b/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-lottie.md
index 15faeda1b25d7c00c560c380620ebe4e9add4d6d..68a709edb5bb657b47eef303399006f31d53f774 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-lottie.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-lottie.md
@@ -1,7 +1,8 @@
# Lottie
->  **说明：**
-> 从 API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+> **说明：**
+>
+> 从 API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
## 权限列表
@@ -15,8 +16,8 @@
import lottie from '@ohos/lottieETS'
```
->  **说明：**
-> 在Terminal窗口使用 `npm install @ohos/lottieETS` 命令下载Lottie。
+> **说明：**
+> 在Terminal窗口使用 `npm install @ohos/lottieETS` 命令下载Lottie。
## lottie.loadAnimation
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-path2d.md b/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-path2d.md
index 34e25b16a7a35c3985ad2fb73dd68b0ceed719fa..e457d286728476cdd8a566903c5622843104270f 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-path2d.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-path2d.md
@@ -1,7 +1,8 @@
# Path2D对象
->  **说明：**
-> 从 API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+> **说明：**
+>
+> 从 API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
路径对象，支持通过对象的接口进行路径的描述，并通过Canvas的stroke接口进行绘制。
@@ -14,9 +15,9 @@ addPath(path: Object): void
将另一个路径添加到当前的路径对象中。
- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | -------- | -------- | -------- | -------- | -------- |
- | path | Object | 是 | null | 需要添加到当前路径的路径对象 |
+ | 参数 | 类型 | 必填 | 默认值 | 描述 |
+ | ---- | ------ | ---- | ---- | -------------- |
+ | path | Object | 是 | null | 需要添加到当前路径的路径对象 |
- 示例
```
@@ -25,10 +26,10 @@ addPath(path: Object): void
struct AddPath {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
-
+
private path2Da: Path2D = new Path2D("M250 150 L150 350 L350 350 Z")
private path2Db: Path2D = new Path2D()
-
+
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
Canvas(this.context)
@@ -63,7 +64,7 @@ closePath(): void
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
private path2Db: Path2D = new Path2D()
-
+
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
Canvas(this.context)
@@ -94,10 +95,10 @@ moveTo(x: number, y: number): void
将路径的当前坐标点移动到目标点，移动过程中不绘制线条。
- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | -------- | -------- | -------- | -------- | -------- |
- | x | number | 是 | 0 | 目标点X轴坐标 |
- | y | number | 是 | 0 | 目标点Y轴坐标 |
+ | 参数 | 类型 | 必填 | 默认值 | 描述 |
+ | ---- | ------ | ---- | ---- | ------- |
+ | x | number | 是 | 0 | 目标点X轴坐标 |
+ | y | number | 是 | 0 | 目标点Y轴坐标 |
- 示例
```
@@ -107,7 +108,7 @@ moveTo(x: number, y: number): void
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
private path2Db: Path2D = new Path2D()
-
+
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
Canvas(this.context)
@@ -138,10 +139,10 @@ lineTo(x: number, y: number): void
从当前点绘制一条直线到目标点。
- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | -------- | -------- | -------- | -------- | -------- |
- | x | number | 是 | 0 | 目标点X轴坐标 |
- | y | number | 是 | 0 | 目标点Y轴坐标 |
+ | 参数 | 类型 | 必填 | 默认值 | 描述 |
+ | ---- | ------ | ---- | ---- | ------- |
+ | x | number | 是 | 0 | 目标点X轴坐标 |
+ | y | number | 是 | 0 | 目标点Y轴坐标 |
- 示例
```
@@ -151,7 +152,7 @@ lineTo(x: number, y: number): void
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
private path2Db: Path2D = new Path2D()
-
+
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
Canvas(this.context)
@@ -183,14 +184,14 @@ bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number,
创建三次贝赛尔曲线的路径。
- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | -------- | -------- | -------- | -------- | -------- |
- | cp1x | number | 是 | 0 | 第一个贝塞尔参数的x坐标值。 |
- | cp1y | number | 是 | 0 | 第一个贝塞尔参数的y坐标值。 |
- | cp2x | number | 是 | 0 | 第二个贝塞尔参数的x坐标值。 |
- | cp2y | number | 是 | 0 | 第二个贝塞尔参数的y坐标值。 |
- | x | number | 是 | 0 | 路径结束时的x坐标值。 |
- | y | number | 是 | 0 | 路径结束时的y坐标值。 |
+ | 参数 | 类型 | 必填 | 默认值 | 描述 |
+ | ---- | ------ | ---- | ---- | -------------- |
+ | cp1x | number | 是 | 0 | 第一个贝塞尔参数的x坐标值。 |
+ | cp1y | number | 是 | 0 | 第一个贝塞尔参数的y坐标值。 |
+ | cp2x | number | 是 | 0 | 第二个贝塞尔参数的x坐标值。 |
+ | cp2y | number | 是 | 0 | 第二个贝塞尔参数的y坐标值。 |
+ | x | number | 是 | 0 | 路径结束时的x坐标值。 |
+ | y | number | 是 | 0 | 路径结束时的y坐标值。 |
- 示例
```
@@ -200,7 +201,7 @@ bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number,
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
private path2Db: Path2D = new Path2D()
-
+
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
Canvas(this.context)
@@ -228,12 +229,12 @@ quadraticCurveTo(cpx: number, cpy: number, x: number ,y: number): void
创建二次贝赛尔曲线的路径。
- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | -------- | -------- | -------- | -------- | -------- |
- | cpx | number | 是 | 0 | 贝塞尔参数的x坐标值。 |
- | cpy | number | 是 | 0 | 贝塞尔参数的y坐标值。 |
- | x | number | 是 | 0 | 路径结束时的x坐标值。 |
- | y | number | 是 | 0 | 路径结束时的y坐标值。 |
+ | 参数 | 类型 | 必填 | 默认值 | 描述 |
+ | ---- | ------ | ---- | ---- | ----------- |
+ | cpx | number | 是 | 0 | 贝塞尔参数的x坐标值。 |
+ | cpy | number | 是 | 0 | 贝塞尔参数的y坐标值。 |
+ | x | number | 是 | 0 | 路径结束时的x坐标值。 |
+ | y | number | 是 | 0 | 路径结束时的y坐标值。 |
- 示例
```
@@ -243,7 +244,7 @@ quadraticCurveTo(cpx: number, cpy: number, x: number ,y: number): void
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
private path2Db: Path2D = new Path2D()
-
+
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
Canvas(this.context)
@@ -272,14 +273,14 @@ arc(x: number, y: number, radius: number, startAngle: number, endAngle: number,
绘制弧线路径。
- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | -------- | -------- | -------- | -------- | -------- |
- | x | number | 是 | 0 | 弧线圆心的x坐标值。 |
- | y | number | 是 | 0 | 弧线圆心的y坐标值。 |
- | radius | number | 是 | 0 | 弧线的圆半径。 |
- | startAngle | number | 是 | 0 | 弧线的起始弧度。 |
- | endAngle | number | 是 | 0 | 弧线的终止弧度。 |
- | anticlockwise | boolean | 否 | false | 是否逆时针绘制圆弧。 |
+ | 参数 | 类型 | 必填 | 默认值 | 描述 |
+ | ------------- | ------- | ---- | ----- | ---------- |
+ | x | number | 是 | 0 | 弧线圆心的x坐标值。 |
+ | y | number | 是 | 0 | 弧线圆心的y坐标值。 |
+ | radius | number | 是 | 0 | 弧线的圆半径。 |
+ | startAngle | number | 是 | 0 | 弧线的起始弧度。 |
+ | endAngle | number | 是 | 0 | 弧线的终止弧度。 |
+ | anticlockwise | boolean | 否 | false | 是否逆时针绘制圆弧。 |
- 示例
```
@@ -289,7 +290,7 @@ arc(x: number, y: number, radius: number, startAngle: number, endAngle: number,
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
private path2Db: Path2D = new Path2D()
-
+
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
Canvas(this.context)
@@ -316,13 +317,13 @@ arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void
依据圆弧经过的点和圆弧半径创建圆弧路径。
- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | -------- | -------- | -------- | -------- | -------- |
- | x1 | number | 是 | 0 | 圆弧经过的第一个点的x坐标值。 |
- | y1 | number | 是 | 0 | 圆弧经过的第一个点的y坐标值。 |
- | x2 | number | 是 | 0 | 圆弧经过的第二个点的x坐标值。 |
- | y2 | number | 是 | 0 | 圆弧经过的第二个点的y坐标值。 |
- | radius | number | 是 | 0 | 圆弧的圆半径值。 |
+ | 参数 | 类型 | 必填 | 默认值 | 描述 |
+ | ------ | ------ | ---- | ---- | --------------- |
+ | x1 | number | 是 | 0 | 圆弧经过的第一个点的x坐标值。 |
+ | y1 | number | 是 | 0 | 圆弧经过的第一个点的y坐标值。 |
+ | x2 | number | 是 | 0 | 圆弧经过的第二个点的x坐标值。 |
+ | y2 | number | 是 | 0 | 圆弧经过的第二个点的y坐标值。 |
+ | radius | number | 是 | 0 | 圆弧的圆半径值。 |
- 示例
```
@@ -332,7 +333,7 @@ arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
private path2Db: Path2D = new Path2D()
-
+
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
Canvas(this.context)
@@ -360,16 +361,16 @@ ellipse(x: number, y: number, radiusX: number, radiusY: number, rotation: number
在规定的矩形区域绘制一个椭圆。
- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | -------- | -------- | -------- | -------- | -------- |
- | x | number | 是 | 0 | 椭圆圆心的x轴坐标。 |
- | y | number | 是 | 0 | 椭圆圆心的y轴坐标。 |
- | radiusX | number | 是 | 0 | 椭圆x轴的半径长度。 |
- | radiusY | number | 是 | 0 | 椭圆y轴的半径长度。 |
- | rotation | number | 是 | 0 | 椭圆的旋转角度，单位为弧度。 |
- | startAngle | number | 是 | 0 | 椭圆绘制的起始点角度，以弧度表示。 |
- | endAngle | number | 是 | 0 | 椭圆绘制的结束点角度，以弧度表示。 |
- | anticlockwise | number | 否 | 0 | 是否以逆时针方向绘制椭圆，0为顺时针，1为逆时针。(可选参数，默认为0) |
+ | 参数 | 类型 | 必填 | 默认值 | 描述 |
+ | ------------- | ------ | ---- | ---- | ------------------------------------ |
+ | x | number | 是 | 0 | 椭圆圆心的x轴坐标。 |
+ | y | number | 是 | 0 | 椭圆圆心的y轴坐标。 |
+ | radiusX | number | 是 | 0 | 椭圆x轴的半径长度。 |
+ | radiusY | number | 是 | 0 | 椭圆y轴的半径长度。 |
+ | rotation | number | 是 | 0 | 椭圆的旋转角度，单位为弧度。 |
+ | startAngle | number | 是 | 0 | 椭圆绘制的起始点角度，以弧度表示。 |
+ | endAngle | number | 是 | 0 | 椭圆绘制的结束点角度，以弧度表示。 |
+ | anticlockwise | number | 否 | 0 | 是否以逆时针方向绘制椭圆，0为顺时针，1为逆时针。(可选参数，默认为0) |
- 示例
```
@@ -379,7 +380,7 @@ ellipse(x: number, y: number, radiusX: number, radiusY: number, rotation: number
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
private path2Db: Path2D = new Path2D()
-
+
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
Canvas(this.context)
@@ -407,12 +408,12 @@ rect(x: number, y: number, width: number, height: number): void
创建矩形路径。
- 参数
- | 参数 | 类型 | 必填 | 默认值 | 描述 |
- | -------- | -------- | -------- | -------- | -------- |
- | x | number | 是 | 0 | 指定矩形的左上角x坐标值。 |
- | y | number | 是 | 0 | 指定矩形的左上角y坐标值。 |
- | width | number | 是 | 0 | 指定矩形的宽度。 |
- | height | number | 是 | 0 | 指定矩形的高度。 |
+ | 参数 | 类型 | 必填 | 默认值 | 描述 |
+ | ------ | ------ | ---- | ---- | ------------- |
+ | x | number | 是 | 0 | 指定矩形的左上角x坐标值。 |
+ | y | number | 是 | 0 | 指定矩形的左上角y坐标值。 |
+ | width | number | 是 | 0 | 指定矩形的宽度。 |
+ | height | number | 是 | 0 | 指定矩形的高度。 |
- 示例
```
@@ -422,7 +423,7 @@ rect(x: number, y: number, width: number, height: number): void
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
private path2Db: Path2D = new Path2D()
-
+
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
Canvas(this.context)
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-alphabet-indexer.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-alphabet-indexer.md
index 7ff4c1b32b752117270cbd503aaeb3787da8615d..07fc48d403c96427080e2ae8d5433589c669cb95 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-alphabet-indexer.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-alphabet-indexer.md
@@ -1,12 +1,10 @@
# AlphabetIndexer
->  **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
字母索引条。
-
+> **说明：**
+>
+> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
## 权限列表
@@ -22,48 +20,49 @@
AlphabetIndexer(value: {arrayValue : Array<string>, selected : number})
-- 参数
- | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
- | -------- | -------- | -------- | -------- | -------- |
- | arrayValue | Array<string> | 是 | - | 字母索引字符串数组。 |
- | selected | number | 是 | - | 选中项编号。 |
+**参数：**
+| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
+| ---------- | ------------------- | ---- | ---- | ---------- |
+| arrayValue | Array<string> | 是 | - | 字母索引字符串数组。 |
+| selected | number | 是 | - | 选中项编号。 |
## 属性
-| 名称 | 参数类型 | 描述 |
-| -------- | -------- | -------- |
-| selectedColor | Color | 选中文本文字颜色。 |
-| popupColor | Color | 弹出提示文本字体颜色。 |
-| selectedBackgroundColor | Color | 选中文本背景颜色。 |
-| popupBackground | Color | 弹窗索引背景色。 |
-| usingPopup | boolean | 是否使用弹出索引提示。 |
-| selectedFont | {
size?: number,
weight?: FontWeight,
family?: string,
style?: FontStyle
} | 选中文本文字样式。 |
-| popupFont | {
size?: number,
weight?: FontWeight,
family?: string,
style?: FontStyle
} | 弹出提示文本字体样式。 |
-| font | {
size?: number,
weight?: FontWeight,
family?: string,
style?: FontStyle
} | 字母索引条默认文本字体样式。 |
-| itemSize | Length | 字母索引条字母区域大小，字母区域为正方形，设置正方形边长。 |
-| alignStyle | IndexerAlign | 字母索引条对齐样式，支持左侧对齐样式与右侧对齐样式，影响弹窗弹出位置。 |
-
-- IndexerAlign枚举说明
- | 名称 | 描述 |
- | -------- | -------- |
- | Left | 弹框显示在索引条右侧。 |
- | Right | 弹框显示在索引条左侧。 |
-
+| 名称 | 参数类型 | 描述 |
+| ----------------------- | ---------------------------------------- | ----------------------------------- |
+| selectedColor | Color | 选中文本文字颜色。 |
+| popupColor | Color | 弹出提示文本字体颜色。 |
+| selectedBackgroundColor | Color | 选中文本背景颜色。 |
+| popupBackground | Color | 弹窗索引背景色。 |
+| usingPopup | boolean | 是否使用弹出索引提示。 |
+| selectedFont | {
size?: number,
weight?: FontWeight,
family?: string,
style?: FontStyle
} | 选中文本文字样式。 |
+| popupFont | {
size?: number,
weight?: FontWeight,
family?: string,
style?: FontStyle
} | 弹出提示文本字体样式。 |
+| font | {
size?: number,
weight?: FontWeight,
family?: string,
style?: FontStyle
} | 字母索引条默认文本字体样式。 |
+| itemSize | Length | 字母索引条字母区域大小，字母区域为正方形，设置正方形边长。 |
+| alignStyle | IndexerAlign | 字母索引条对齐样式，支持左侧对齐样式与右侧对齐样式，影响弹窗弹出位置。 |
+
+## IndexerAlign枚举说明
+
+| 名称 | 描述 |
+| ----- | ----------- |
+| Left | 弹框显示在索引条右侧。 |
+| Right | 弹框显示在索引条左侧。 |
## 事件
-| 名称 | 功能描述 |
-| -------- | -------- |
-| onSelected(index: number) => void(deprecated) | 索引条选中回调。 |
-| onSelect(index: number) => void8+ | 索引条选中回调。 |
+| 名称 | 功能描述 |
+| ---------------------------------------- | ---------------------------------------- |
+| onSelected(index: number) => void(deprecated) | 索引条选中回调。 |
+| onSelect(index: number) => void8+ | 索引条选中回调。 |
| onRequestPopupData(callback: (index: number) => Array<string>)8+ | 选中字母索引后，请求索引提示窗口显示内容回调。
返回值：索引对应的字符串数组，此字符串数组在弹出窗口中竖排显示，字符串列表最多显示5个，超出部分可以滑动显示。 |
-| onPopupSelect(callback: (index: number) => void)8+ | 字母索引提示窗口选中回调。 |
+| onPopupSelect(callback: (index: number) => void)8+ | 字母索引提示窗口选中回调。 |
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct AlphabetIndexerSample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-badge.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-badge.md
index 3c2159a08da2df72870e4edb268de33916722e0b..e46016e32002286fd98d4c305aaee07b77715bd5 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-badge.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-badge.md
@@ -1,7 +1,8 @@
# Badge
->  **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+> **说明：**
+>
+> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
新事件标记组件，在组件上提供事件信息展示能力。
@@ -21,44 +22,48 @@
Badge(value: {count: number, position?: BadgePosition, maxCount?: number, style?: BadgeStyle})
-- 参数
- | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
- | -------- | -------- | -------- | -------- | -------- |
- | count | number | 是 | - | 设置提醒消息数。 |
- | position | BadgePosition | 否 | BadgePosition.RightTop | 设置提示点显示位置。 |
- | maxCount | number | 否 | 99 | 最大消息数，超过最大消息时仅显示maxCount+。 |
- | style | BadgeStyle | 否 | - | Badge组件可设置样式，支持设置文本颜色、尺寸、圆点颜色和尺寸。 |
+**参数：**
+
+| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
+| -------- | ------------- | ---- | ---------------------- | --------------------------------- |
+| count | number | 是 | - | 设置提醒消息数。 |
+| position | BadgePosition | 否 | BadgePosition.RightTop | 设置提示点显示位置。 |
+| maxCount | number | 否 | 99 | 最大消息数，超过最大消息时仅显示maxCount+。 |
+| style | BadgeStyle | 否 | - | Badge组件可设置样式，支持设置文本颜色、尺寸、圆点颜色和尺寸。 |
Badge(value: {value: string, position?: BadgePosition, style?: BadgeStyle})
根据字符串创建提醒组件。
-- 参数
- | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
- | -------- | -------- | -------- | -------- | -------- |
- | value | string | 是 | - | 提示内容的文本字符串。 |
- | position | BadgePosition | 否 | BadgePosition.RightTop | 设置提示点显示位置。 |
- | style | BadgeStyle | 否 | - | Badge组件可设置样式，支持设置文本颜色、尺寸、圆点颜色和尺寸。 |
-
-- BadgeStyle对象说明
- | 名称 | 类型 | 必填 | 默认值 | 描述 |
- | -------- | -------- | -------- | -------- | -------- |
- | color | Color | 否 | Color.White | 文本颜色。 |
- | fontSize | number \| string | 否 | 10 | 文本大小。 |
- | badgeSize | number \| string | 是 | - | badge的大小。 |
- | badgeColor | Color | 否 | Color.Red | badge的颜色。 |
-
-- BadgePosition枚举说明
- | 名称 | 描述 |
- | -------- | -------- |
- | Right | 圆点显示在右侧纵向居中。 |
- | RightTop | 圆点显示在右上角。 |
- | Left | 圆点显示在左侧纵向居中。 |
+**参数：**
+
+| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
+| -------- | ------------- | ---- | ---------------------- | --------------------------------- |
+| value | string | 是 | - | 提示内容的文本字符串。 |
+| position | BadgePosition | 否 | BadgePosition.RightTop | 设置提示点显示位置。 |
+| style | BadgeStyle | 否 | - | Badge组件可设置样式，支持设置文本颜色、尺寸、圆点颜色和尺寸。 |
+
+## BadgeStyle对象说明
+| 名称 | 类型 | 必填 | 默认值 | 描述 |
+| ---------- | -------------------------- | ---- | ----------- | --------- |
+| color | Color | 否 | Color.White | 文本颜色。 |
+| fontSize | number \| string | 否 | 10 | 文本大小。 |
+| badgeSize | number \| string | 是 | - | badge的大小。 |
+| badgeColor | Color | 否 | Color.Red | badge的颜色。 |
+
+## BadgePosition枚举说明
+
+| 名称 | 描述 |
+| -------- | ------------ |
+| Right | 圆点显示在右侧纵向居中。 |
+| RightTop | 圆点显示在右上角。 |
+| Left | 圆点显示在左侧纵向居中。 |
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct BadgeExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-column.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-column.md
index 42bf03f17d543448f2172098b54817a1003d100e..b6f8c14612dba32eebbbeccf8815a7c0f24dad6b 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-column.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-column.md
@@ -1,11 +1,11 @@
# Column
->  **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
沿垂直方向布局的容器。
+> **说明：**
+>
+> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
## 权限列表
@@ -21,32 +21,32 @@
Column(value:{space?: Length})
+**参数：**
-- 参数
- | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
- | -------- | -------- | -------- | -------- | -------- |
- | space | Length | 否 | 0 | 纵向布局元素间距。 |
-
+| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
+| ----- | ------ | ---- | ---- | --------- |
+| space | Length | 否 | 0 | 纵向布局元素间距。 |
## 属性
-| 名称 | 参数类型 | 默认值 | 描述 |
-| -------- | -------- | -------- | -------- |
-| alignItems | HorizontalAlign | HorizontalAlign.Center | 设置子组件在水平方向上的对齐格式。 |
-| justifyContent8+ | [FlexAlign](ts-container-flex.md) | FlexAlign.Start | 设置子组件在垂直方向上的对齐格式。 |
+| 名称 | 参数类型 | 默认值 | 描述 |
+| ---------------- | --------------------------------- | ---------------------- | ----------------- |
+| alignItems | HorizontalAlign | HorizontalAlign.Center | 设置子组件在水平方向上的对齐格式。 |
+| justifyContent8+ | [FlexAlign](ts-container-flex.md) | FlexAlign.Start | 设置子组件在垂直方向上的对齐格式。 |
-- HorizontalAlign枚举说明
- | 名称 | 描述 |
- | -------- | -------- |
- | Start | 按照语言方向起始端对齐。 |
- | Center | 居中对齐，默认对齐方式。 |
- | End | 按照语言方向末端对齐。 |
+## HorizontalAlign枚举说明
+| 名称 | 描述 |
+| ------ | ------------ |
+| Start | 按照语言方向起始端对齐。 |
+| Center | 居中对齐，默认对齐方式。 |
+| End | 按照语言方向末端对齐。 |
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct ColumnExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-columnsplit.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-columnsplit.md
index 184d4e6c6f0b5c70d60f8a46ea4a7cc16e065053..22351db03f2ec17d82abc55efc5326868acad0fd 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-columnsplit.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-columnsplit.md
@@ -1,11 +1,11 @@
# ColumnSplit
->  **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
将子组件纵向布局，并在每个子组件之间插入一根横向的分割线。
+> **说明：**
+>
+> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
## 权限列表
@@ -24,17 +24,18 @@ ColumnSplit()
## 属性
-| 名称 | 参数类型 | 描述 |
-| -------- | -------- | -------- |
-| resizeable | boolean | 分割线是否可拖拽，默认为false。 |
+| 名称 | 参数类型 | 描述 |
+| ---------- | ------- | ------------------ |
+| resizeable | boolean | 分割线是否可拖拽，默认为false。 |
->  **说明：**
-> 与RowSplit相同，ColumnSplit的分割线最小能拖动到刚好包含子组件。
+> **说明：**
+> 与RowSplit相同，ColumnSplit的分割线最小能拖动到刚好包含子组件。
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct ColumnSplitExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-counter.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-counter.md
index 1a3f71f9a886de0a44220ebfaa5f1e81de435e01..4eb113fba9c3f3a8cc0ae37aad2cc63875c61aa9 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-counter.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-counter.md
@@ -1,7 +1,8 @@
# Counter
->  **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+> **说明：**
+>
+> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
计数器组件，提供相应的增加或者减少的计数操作。
@@ -26,15 +27,16 @@ Counter()
不支持通用事件和手势， 仅支持如下事件：
-| 名称 | 功能描述 |
-| -------- | -------- |
-| onInc(event: () => void) | 监听数值增加事件。 |
-| onDec(event: () => void) | 监听数值减少事件。 |
+| 名称 | 功能描述 |
+| ---------------------------------------- | --------- |
+| onInc(event: () => void) | 监听数值增加事件。 |
+| onDec(event: () => void) | 监听数值减少事件。 |
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct CounterExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-flex.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-flex.md
index abf5d65e286590e35f670f8e636ef2b9310d6964..11b41334040d4c7b60b0f2cad0cd43f66019c5c8 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-flex.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-flex.md
@@ -1,11 +1,11 @@
# Flex
->  **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
弹性布局组件。
+> **说明：**
+>
+> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
## 权限列表
@@ -23,40 +23,43 @@ Flex(options?: { direction?: FlexDirection, wrap?: FlexWrap, justifyContent?: F
标准Flex布局容器。
-- 参数
- | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
- | -------- | -------- | -------- | -------- | -------- |
- | direction | FlexDirection | 否 | FlexDirection.Row | 子组件在Flex容器上排列的方向，即主轴的方向。 |
- | wrap | FlexWrap | 否 | FlexWrap.NoWrap | Flex容器是单行/列还是多行/列排列。 |
- | justifyContent | FlexAlign | 否 | FlexAlign.Start | 子组件在Flex容器主轴上的对齐格式。 |
- | alignItems | [ItemAlign](ts-appendix-enums.md#itemalign枚举说明) | 否 | ItemAlign.Stretch | 子组件在Flex容器交叉轴上的对齐格式。 |
- | alignContent | FlexAlign | 否 | FlexAlign.Start | 交叉轴中有额外的空间时，多行内容的对齐方式。仅在wrap为Wrap或WrapReverse下生效。 |
-
-- FlexDirection枚举说明
- | 名称 | 描述 |
- | -------- | -------- |
- | Row | 主轴与行方向一致作为布局模式。 |
- | RowReverse | 与Row方向相反方向进行布局。 |
- | Column | 主轴与列方向一致作为布局模式。 |
- | ColumnReverse | 与Column相反方向进行布局。 |
-
-- FlexWrap枚举说明
- | 名称 | 描述 |
- | -------- | -------- |
- | NoWrap | Flex容器的元素单行/列布局，子项不允许超出容器。 |
- | Wrap | Flex容器的元素多行/列排布，子项允许超出容器。 |
- | WrapReverse | Flex容器的元素反向多行/列排布，子项允许超出容器。 |
-
-- FlexAlign枚举说明
- | 名称 | 描述 |
- | -------- | -------- |
- | Start | 元素在主轴方向首端对齐, 第一个元素与行首对齐，同时后续的元素与前一个对齐。 |
- | Center | 元素在主轴方向中心对齐，第一个元素与行首的距离与最后一个元素与行尾距离相同。 |
- | End | 元素在主轴方向尾部对齐, 最后一个元素与行尾对齐，其他元素与后一个对齐。 |
- | SpaceBetween | Flex主轴方向均匀分配弹性元素，相邻元素之间距离相同。 第一个元素与行首对齐，最后一个元素与行尾对齐。 |
- | SpaceAround | Flex主轴方向均匀分配弹性元素，相邻元素之间距离相同。 第一个元素到行首的距离和最后一个元素到行尾的距离是相邻元素之间距离的一半。 |
- | SpaceEvenly | Flex主轴方向元素等间距布局， 相邻元素之间的间距、第一个元素与行首的间距、最后一个元素到行尾的间距都完全一样。 |
-
+**参数：**
+
+| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
+| -------------- | ---------------------------------------- | ---- | ----------------- | ---------------------------------------- |
+| direction | FlexDirection | 否 | FlexDirection.Row | 子组件在Flex容器上排列的方向，即主轴的方向。 |
+| wrap | FlexWrap | 否 | FlexWrap.NoWrap | Flex容器是单行/列还是多行/列排列。 |
+| justifyContent | FlexAlign | 否 | FlexAlign.Start | 子组件在Flex容器主轴上的对齐格式。 |
+| alignItems | [ItemAlign](ts-appendix-enums.md#itemalign枚举说明) | 否 | ItemAlign.Stretch | 子组件在Flex容器交叉轴上的对齐格式。 |
+| alignContent | FlexAlign | 否 | FlexAlign.Start | 交叉轴中有额外的空间时，多行内容的对齐方式。仅在wrap为Wrap或WrapReverse下生效。 |
+
+## FlexDirection枚举说明
+
+| 名称 | 描述 |
+| ------------- | ---------------- |
+| Row | 主轴与行方向一致作为布局模式。 |
+| RowReverse | 与Row方向相反方向进行布局。 |
+| Column | 主轴与列方向一致作为布局模式。 |
+| ColumnReverse | 与Column相反方向进行布局。 |
+
+## FlexWrap枚举说明
+
+| 名称 | 描述 |
+| ----------- | --------------------------- |
+| NoWrap | Flex容器的元素单行/列布局，子项不允许超出容器。 |
+| Wrap | Flex容器的元素多行/列排布，子项允许超出容器。 |
+| WrapReverse | Flex容器的元素反向多行/列排布，子项允许超出容器。 |
+
+## FlexAlign枚举说明
+
+| 名称 | 描述 |
+| ------------ | ---------------------------------------- |
+| Start | 元素在主轴方向首端对齐, 第一个元素与行首对齐，同时后续的元素与前一个对齐。 |
+| Center | 元素在主轴方向中心对齐，第一个元素与行首的距离与最后一个元素与行尾距离相同。 |
+| End | 元素在主轴方向尾部对齐, 最后一个元素与行尾对齐，其他元素与后一个对齐。 |
+| SpaceBetween | Flex主轴方向均匀分配弹性元素，相邻元素之间距离相同。 第一个元素与行首对齐，最后一个元素与行尾对齐。 |
+| SpaceAround | Flex主轴方向均匀分配弹性元素，相邻元素之间距离相同。 第一个元素到行首的距离和最后一个元素到行尾的距离是相邻元素之间距离的一半。 |
+| SpaceEvenly | Flex主轴方向元素等间距布局， 相邻元素之间的间距、第一个元素与行首的间距、最后一个元素到行尾的间距都完全一样。 |
## 示例
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-grid.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-grid.md
index ee937be3a90c5e6e519c05a3e6ed29911f3145fc..867eb1359ab7b54ca19a9a0b17e6a69b2ec8f123 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-grid.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-grid.md
@@ -1,11 +1,10 @@
# Grid
->  **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
网格容器，由“行”和“列”分割的单元格所组成，通过指定“项目”所在的单元格做出各种各样的布局。
-
+> **说明：**
+>
+> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
## 权限列表
@@ -46,7 +45,8 @@ Grid()
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct GridExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-gridcontainer.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-gridcontainer.md
index b90566a04ba55389ccc14135cc5afd6face5f36a..51e10bb92756b345c0ca2cce102d25ac78229935 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-gridcontainer.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-gridcontainer.md
@@ -1,7 +1,7 @@
# GridContainer
->  **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+> **说明：**
+> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
纵向排布栅格布局容器，仅在栅格布局场景中使用。
@@ -21,23 +21,24 @@
GridContainer(options?: { columns?: number | 'auto', sizeType?: SizeType, gutter?: Length, margin?: Length})
-- 参数
- | 参数名 | 类型 | 必填 | 默认值 | 说明 |
- | -------- | -------- | -------- | -------- | -------- |
- | columns | number \| 'auto' | 否 | 'auto' | 设置当前布局总列数。 |
- | sizeType | SizeType | 否 | SizeType.Auto | 选用设备宽度类型。 |
- | gutter | Length | 否 | - | 栅格布局列间距。 |
- | margin | Length | 否 | - | 栅格布局两侧间距。 |
+**参数：**
-- SizeType枚举说明
- | 名称 | 描述 |
- | -------- | -------- |
- | XS | 最小宽度类型设备。 |
- | SM | 小宽度类型设备。 |
- | MD | 中等宽度类型设备。 |
- | LG | 大宽度类型设备。 |
- | Auto | 根据设备类型进行选择。 |
+| 参数名 | 类型 | 必填 | 默认值 | 说明 |
+| -------- | -------------------------- | ---- | ------------- | ---------- |
+| columns | number \| 'auto' | 否 | 'auto' | 设置当前布局总列数。 |
+| sizeType | SizeType | 否 | SizeType.Auto | 选用设备宽度类型。 |
+| gutter | Length | 否 | - | 栅格布局列间距。 |
+| margin | Length | 否 | - | 栅格布局两侧间距。 |
+## SizeType枚举说明
+
+| 名称 | 描述 |
+| ---- | ----------- |
+| XS | 最小宽度类型设备。 |
+| SM | 小宽度类型设备。 |
+| MD | 中等宽度类型设备。 |
+| LG | 大宽度类型设备。 |
+| Auto | 根据设备类型进行选择。 |
## 属性
@@ -51,7 +52,8 @@ GridContainer(options?: { columns?: number | 'auto', sizeType?: SizeType, gutter
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct GridContainerExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-griditem.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-griditem.md
index 98363660810da775de1869dbe402d36d3e674926..ebc1a958206f2a3201616dbc510bb7b171ea1c57 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-griditem.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-griditem.md
@@ -1,6 +1,6 @@
# GridItem
->  **说明：**
+> **说明：**
> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -31,7 +31,7 @@ GridItem()
| columnStart | number | - | 用于指定当前元素起始列号。 |
| columnEnd | number | - | 用于指定当前元素终点列号。 |
| forceRebuild | boolean | false | 用于设置在触发组件build时是否重新创建此节点。 |
-| selectable8+ | boolean | true | 当前GridItem元素是否可以被鼠标框选。
>  **说明：**
> 外层Grid容器的鼠标框选开启时，GridItem的框选才生效。 |
+| selectable8+ | boolean | true | 当前GridItem元素是否可以被鼠标框选。
> **说明：**
> 外层Grid容器的鼠标框选开启时，GridItem的框选才生效。 |
## 事件
@@ -43,7 +43,8 @@ GridItem()
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct GridItemExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-list.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-list.md
index c86fd24d0039df64ce45978ba6882b586f1211d8..aa2cbedbb15bc65bc7bf07ef96aba5ad8674541e 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-list.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-list.md
@@ -1,6 +1,6 @@
# List
->  **说明：**
+> **说明：**
> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -54,7 +54,7 @@ List(value:{space?: number, initialIndex?: number})
| onItemDelete(index: number) => boolean | 列表项删除时触发。 |
| onScrollIndex(firstIndex: number, lastIndex: number) => void | 当前列表显示的起始位置和终止位置发生变化时触发。 |
->  **说明：**
+> **说明：**
> List使能可编辑模式需配合onItemDelete事件和ListItem的editable属性，即可编辑模式实现删除列表项功能，需满足以下条件：
>
> - editMode属性设置为true。
@@ -72,7 +72,8 @@ List(value:{space?: number, initialIndex?: number})
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct ListExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-listitem.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-listitem.md
index d5c1abcf9079bbc4f57b6275b966a5ae5924fa4c..b95950a3225f3da92341b06e82a50b80aad29e81 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-listitem.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-listitem.md
@@ -1,6 +1,6 @@
# ListItem
->  **说明：**
+> **说明：**
> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -28,7 +28,7 @@ ListItem()
| -------- | -------- | -------- | -------- |
| sticky | Sticky | Sticky.None | 设置ListItem吸顶效果，参见Sticky枚举描述。 |
| editable | boolean | false | 当前ListItem元素是否可编辑，进入编辑模式后可删除。 |
-| selectable8+ | boolean | true | 当前ListItem元素是否可以被鼠标框选。
>  **说明：**
> 外层List容器的鼠标框选开启时，ListItem的框选才生效。 |
+| selectable8+ | boolean | true | 当前ListItem元素是否可以被鼠标框选。
> **说明：**
> 外层List容器的鼠标框选开启时，ListItem的框选才生效。 |
- Sticky枚举说明
| 名称 | 描述 |
@@ -46,7 +46,8 @@ ListItem()
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct ListItemExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-navigator.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-navigator.md
index cab72748f3c7faa088f282a5a93ffc9eb1a5f554..0e7c9dc69aff65141d33c5d579252949643d216f 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-navigator.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-navigator.md
@@ -1,6 +1,6 @@
# Navigator
->  **说明：**
+> **说明：**
> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-panel.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-panel.md
index b92c822e71dc187b16977e3cd71190973d29cabd..36959733612a951be41c2149c7ceca7e4c9a4a8e 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-panel.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-panel.md
@@ -1,6 +1,6 @@
# Panel
->  **说明：**
+> **说明：**
> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -62,7 +62,8 @@ Panel(value:{show：boolean})
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct PanelExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-refresh.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-refresh.md
index 2288474152b157e53fec446aeaaf15ff741c7de2..a9c22363adf16b105235897581f98a12b0eeeeeb 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-refresh.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-refresh.md
@@ -1,6 +1,6 @@
# Refresh
->  **说明：**
+> **说明：**
> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
下拉刷新容器。
@@ -48,7 +48,8 @@ Refresh\(value: \{refreshing: boolean, offset?: Length, friction?: number | stri
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct RefreshExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-row.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-row.md
index 3f9d172cf9ef2c7fcb3d29e66c4866bf9366c907..3e68e2a4d7cc369722144d2115470d39bbfd0292 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-row.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-row.md
@@ -1,6 +1,6 @@
# Row
->  **说明：**
+> **说明：**
> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -44,7 +44,8 @@ Row(value:{space?: Length})
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct RowExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-rowsplit.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-rowsplit.md
index 50a27edc41852620a49c0f91c9b653431c69921a..0cec1a56838513830296eb80e4860ffde3ddb795 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-rowsplit.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-rowsplit.md
@@ -1,6 +1,6 @@
# RowSplit
->  **说明：**
+> **说明：**
> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -28,13 +28,14 @@ RowSplit()
| -------- | -------- | -------- |
| resizeable | boolean | 分割线是否可拖拽，默认为false。 |
->  **说明：**
+> **说明：**
> RowSplit的分割线最小能拖动到刚好包含子组件。
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct RowSplitExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-scroll.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-scroll.md
index 5c208cc02a485c858b59cd95527e1ad1e733f528..5a3b9ac6d4ab53a61c0828fdb9a270b6d01c26a7 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-scroll.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-scroll.md
@@ -1,6 +1,6 @@
# Scroll
->  **说明：**
+> **说明：**
> 该组件从API version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -123,7 +123,7 @@ scroller.scrollToIndex(value: number): void
滑动到指定Index。
->  **说明：**
+> **说明：**
> 仅支持list组件。
@@ -135,7 +135,8 @@ scroller.scrollToIndex(value: number): void
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct ScrollExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-sidebarcontainer.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-sidebarcontainer.md
index b9c0fbfb166fab6f2c22f60630af11cda0a18a40..4471af90362cddb2faa8c36f6d06eb16b98b4219 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-sidebarcontainer.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-sidebarcontainer.md
@@ -1,6 +1,6 @@
# SideBarContainer
->  **说明：**
+> **说明：**
> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -64,7 +64,8 @@ SideBarContainer( type?: SideBarContainerType )
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct SideBarContainerExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-stack.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-stack.md
index 16691f323bce9ecfc053bf025313c45ec141eeee..6acbfc7449061d055a0d38148c8e4a164a21b7c9 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-stack.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-stack.md
@@ -1,6 +1,6 @@
# Stack
->  **说明：**
+> **说明：**
> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -29,7 +29,8 @@ Stack(value:{alignContent?: Alignment})
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct StackExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-tabcontent.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-tabcontent.md
index 6486c97a25964c9f1e6f10f72f95a77be28c6d5d..a9239960301704a2489b6f23a263d6a6b1976665 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-tabcontent.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-tabcontent.md
@@ -1,6 +1,6 @@
# TabContent
->  **说明：**
+> **说明：**
> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -28,9 +28,9 @@ TabContent()
| 名称 | 参数类型 | 默认值 | 描述 |
| ------ | ---------------------------------------- | ---- | ---------------------------------------- |
-| tabBar | string \| {
icon?: string,
text?: string
}
\| [CustomBuilder](../../ui/ts-types.md)8+ | - | 设置TabBar上显示内容。
CustomBuilder: 构造器，内部可以传入组件（API8版本以上适用）。
>  **说明：**
> 如果icon采用svg格式图源，则要求svg图源删除其自有宽高属性值。如采用带有自有宽高属性的svg图源，icon大小则是svg本身内置的宽高属性值大小。 |
+| tabBar | string \| {
icon?: string,
text?: string
}
\| [CustomBuilder](../../ui/ts-types.md)8+ | - | 设置TabBar上显示内容。
CustomBuilder: 构造器，内部可以传入组件（API8版本以上适用）。
> **说明：**
> 如果icon采用svg格式图源，则要求svg图源删除其自有宽高属性值。如采用带有自有宽高属性的svg图源，icon大小则是svg本身内置的宽高属性值大小。 |
->  **说明：**
+> **说明：**
> - TabContent组件不支持设置通用宽度属性，其宽度默认撑满Tabs父组件。
>
> - TabContent组件不支持设置通用高度属性，其高度由Tabs父组件高度与TabBar组件高度决定。
@@ -38,7 +38,8 @@ TabContent()
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct TabContentExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-tabs.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-tabs.md
index dc4ebb5e6880bf743b284ffdbb644f36a7d1f1f3..3a7a0cdd5b61bc9a2083e1c75f85da4571d0e0e6 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-tabs.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-tabs.md
@@ -1,6 +1,6 @@
# Tabs
->  **说明：**
+> **说明：**
> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -86,7 +86,8 @@ changeIndex(value: number): void
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct TabsExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-circle.md b/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-circle.md
index c2e660b62c106a8337592bfc21de67bb9b6faa9d..9c2b8cb1960bbbee4f081d0e55bde733c761c23b 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-circle.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-circle.md
@@ -1,6 +1,6 @@
# Circle
->  **说明：**
+> **说明：**
> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -43,7 +43,8 @@ Circle(options?: {width: Length, height: Length})
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct CircleExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-ellipse.md b/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-ellipse.md
index 322800fca201305e89e4c767c2fa142af3bb49a3..730cff155083faed405c6e183082b61680b936e5 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-ellipse.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-ellipse.md
@@ -1,6 +1,6 @@
# Ellipse
->  **说明：**
+> **说明：**
> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -43,7 +43,8 @@ ellipse(options?: {width: Length, height: Length})
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct EllipseExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-line.md b/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-line.md
index dd0565e1a35a6a5bfe6795454661260316f4e26a..6658359608e1a26a888b62e1981964150481c861 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-line.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-line.md
@@ -1,6 +1,6 @@
# Line
->  **说明：**
+> **说明：**
> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -45,7 +45,8 @@ Line(options?: {width: Length, height: Length})
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct LineExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-path.md b/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-path.md
index 0e9d0e33f4c34b37454ca8b8263298b0856984f0..e9bcdab04a398e119d96b4c2eae0c5f4ea6b67ff 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-path.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-path.md
@@ -63,7 +63,8 @@ Path(value?: { width?: number | string, height?: number | string, commands?: str
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct PathExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-polygon.md b/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-polygon.md
index fc5a45c6886e66b0b4c49e4819f467cc593672df..41cd830a14b34cb745cb3c74cebad072973fc1f0 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-polygon.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-polygon.md
@@ -1,6 +1,6 @@
# Polygon
->  **说明：**
+> **说明：**
> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -44,7 +44,8 @@ Polygon(value:{options?: {width: Length, height: Length}})
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct PolygonExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-polyline.md b/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-polyline.md
index cb6add47d5a1c90442db199b8e172954905237c5..6df605d88835c658eacbd7074eb9d694d30b096a 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-polyline.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-polyline.md
@@ -1,6 +1,6 @@
# Polyline
->  **说明：**
+> **说明：**
> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -44,7 +44,8 @@ Polyline(options?: {width: Length, height: Length})
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct PolylineExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-rect.md b/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-rect.md
index be2e35cf3ed10699a115fef900de6e29c2609b29..31f0e858d4b8a3976338adb34a5c09022f79e0cd 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-rect.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-rect.md
@@ -1,6 +1,6 @@
# Rect
->  **说明：**
+> **说明：**
> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -49,7 +49,8 @@ Rect(value:{options?: {width: Length,height: Length,radius?: Length | Array<L
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct RectExample {
diff --git 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
index 7c3e80fe8db461f185e254d9e7b22ab284aa7697..50612a62b7e45725830b144f874740bb4f727c30 100644
--- 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
@@ -1,6 +1,6 @@
# Shape
->  **说明：**
+> **说明：**
> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -59,7 +59,8 @@ Shape(value:{target?: PixelMap})
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct ShapeExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-explicit-animation.md b/zh-cn/application-dev/reference/arkui-ts/ts-explicit-animation.md
index 9b2c8200c3c62f8472861e88590fd3fb47866e0f..4bb719c6d48dff1cbf1137db9703133dd1c13134 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-explicit-animation.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-explicit-animation.md
@@ -1,6 +1,6 @@
# 显式动画
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -30,7 +30,8 @@
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct AnimateToExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-interpolation-calculation.md b/zh-cn/application-dev/reference/arkui-ts/ts-interpolation-calculation.md
index 8d7f9b9f75892f0c4cc4e83bf5bc6e28d82615c4..25a017df72ff01f7cb1fda311c7f30f14e9146b9 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-interpolation-calculation.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-interpolation-calculation.md
@@ -1,6 +1,6 @@
# 插值计算
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-matrix-transformation.md b/zh-cn/application-dev/reference/arkui-ts/ts-matrix-transformation.md
index fa9ecb8c49bc37ad43f20fabc6f14b77718768a6..40d89097abf49f7a49ec24b5e49387c645d66c86 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-matrix-transformation.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-matrix-transformation.md
@@ -1,6 +1,6 @@
# 矩阵变换
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-media-components-video.md b/zh-cn/application-dev/reference/arkui-ts/ts-media-components-video.md
index bd97f739ccbae22648af5b99e7f7d363fed9a7c6..b7bf5b90c356be7eab397976bce19c41d00a060d 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-media-components-video.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-media-components-video.md
@@ -1,6 +1,6 @@
# Video
->  **说明：**
+> **说明：**
> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
视频播放组件。
@@ -33,7 +33,7 @@ Video(value: VideoOptions)
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| ------------------- | ---------------------------------------- | ---- | ---------------------------------------- | ---------------------------------------- |
| src | string \| [Resource](../../ui/ts-types.md) | 否 | - | 视频播放源的路径，支持本地视频路径和网络路径。
支持在resources下面的video或rawfile文件夹里放置媒体资源。
支持dataability://的路径前缀，用于访问通过Data Ability提供的视频路径，具体路径信息详见[Data Ability说明](../../ability/fa-dataability.md)。 |
- | currentProgressRate | number \| PlaybackSpeed8+ | 否 | 1.0 \| PlaybackSpeed.
Speed_Forward_1_00_X | 视频播放倍速。
>  **说明：**
> number取值仅支持：0.75，1.0，1.25，1.75，2.0。
|
+ | currentProgressRate | number \| PlaybackSpeed8+ | 否 | 1.0 \| PlaybackSpeed.
Speed_Forward_1_00_X | 视频播放倍速。
> **说明：**
> number取值仅支持：0.75，1.0，1.25，1.75，2.0。
|
| previewUri | string \| PixelMap8+ \| [Resource](../../ui/ts-types.md) | 否 | - | 预览图片的路径。 |
| controller | [VideoController](#videocontroller) | 否 | - | 控制器。 |
@@ -155,7 +155,8 @@ setCurrentTime(value: number, seekMode: SeekMode)
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct VideoCreateComponent {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-methods-action-sheet.md b/zh-cn/application-dev/reference/arkui-ts/ts-methods-action-sheet.md
index 07d48cb35b8d26ed9ed9cb3d16659799e8e25506..e5e4e723fb00b7a44c4656b23b4125e39edaf8df 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-methods-action-sheet.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-methods-action-sheet.md
@@ -1,6 +1,6 @@
# 列表选择弹窗
->  **说明：**
+> **说明：**
> 从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -42,7 +42,8 @@ show(options: { paramObject1})
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct ActionSheetExapmle {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-methods-alert-dialog-box.md b/zh-cn/application-dev/reference/arkui-ts/ts-methods-alert-dialog-box.md
index 2f55b32db3bfe3d1873065876243b2f308702d49..57162b87f0ffa886dff0c4cb184ebc7dfac05844 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-methods-alert-dialog-box.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-methods-alert-dialog-box.md
@@ -1,6 +1,6 @@
# 警告弹窗
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -41,7 +41,8 @@
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct AlertDialogExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-methods-custom-dialog-box.md b/zh-cn/application-dev/reference/arkui-ts/ts-methods-custom-dialog-box.md
index 26a07679a32099d18d50cc43dac30cc14b288256..4608aba9dc8edc10aca85072454448606546cd61 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-methods-custom-dialog-box.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-methods-custom-dialog-box.md
@@ -1,6 +1,6 @@
# 自定义弹窗
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-methods-datepicker-dialog.md b/zh-cn/application-dev/reference/arkui-ts/ts-methods-datepicker-dialog.md
index 10a9a68cda53c73b82ce1dac80ad4044c7acaaf9..98663cb9bf0387b0cf266122cf76093e2c81eb50 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-methods-datepicker-dialog.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-methods-datepicker-dialog.md
@@ -1,6 +1,6 @@
# 日期滑动选择器弹窗
->  **说明：**
+> **说明：**
> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
根据指定范围的Date创建可以选择日期的滑动选择器，展示在弹窗上。
@@ -29,7 +29,8 @@ show(options?: DatePickerDialogOptions)
## 示例
### 日期滑动选择器（显示农历）示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct DatePickerDialogExample01 {
@@ -62,7 +63,8 @@ struct DatePickerDialogExample01 {
}
```
### 日期滑动选择器（不显示农历）示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct DatePickerDialogExample02 {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-methods-menu.md b/zh-cn/application-dev/reference/arkui-ts/ts-methods-menu.md
index df97249f6d38576b79f604df4aab7d277c7118f9..95d93a6d788e453bc22626641dc5d5b58de085bc 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-methods-menu.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-methods-menu.md
@@ -1,6 +1,6 @@
# 菜单
->  **说明：**
+> **说明：**
> 从 API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
## ContextMenu.close
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-methods-textpicker-dialog.md b/zh-cn/application-dev/reference/arkui-ts/ts-methods-textpicker-dialog.md
index b9c0e9cd7a1a410f2509f6ceb719820272d1c90f..21085f27e61f40bed7568fae682e820dad77cb9f 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-methods-textpicker-dialog.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-methods-textpicker-dialog.md
@@ -1,6 +1,6 @@
# 文本滑动选择器弹窗
->  **说明：**
+> **说明：**
> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
根据指定的选择范围创建文本选择器，展示在弹窗上。
@@ -33,7 +33,8 @@ show(options: TextPickerDialogOptions)
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct TextPickerDialogExample {
diff --git 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
index 073e84113a50767dab0a84a294b0ceb45e4faa91..2917d91350b4fd82e62f3a2c1092827f452f7c2d 100644
--- 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
@@ -1,6 +1,6 @@
# 时间滑动选择器弹窗
->  **说明：**
+> **说明：**
> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
默认以00：00至23：59的时间区间创建滑动选择器，展示在弹窗上。
@@ -27,7 +27,8 @@ show(options?: TimePickerDialogOptions)
## 示例
### 时间滑动选择器（24小时制）示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct TimePickerDialogExample01 {
@@ -55,7 +56,8 @@ struct TimePickerDialogExample01 {
}
```
### 时间滑动选择器（12小时制）示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct TimePickerDialogExample02 {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-motion-path-animation.md b/zh-cn/application-dev/reference/arkui-ts/ts-motion-path-animation.md
index 82a6b6a35aa076ddd43098bb09048e7405871ec0..022e2efe6d9466d14d21ec81d0d3dbbeeafefd57 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-motion-path-animation.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-motion-path-animation.md
@@ -1,6 +1,6 @@
# 路径动画
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -11,12 +11,13 @@
| 名称 | 参数类型 | 默认值 | 描述 |
| -------- | -------- | -------- | -------- |
-| motionPath | {
path: string,
from?: number,
to?: number,
rotatable?: boolean
}
>  **说明：**
> path中支持通过start和end进行起点和终点的替代，如：
>
> 'Mstart.x start.y L50 50 Lend.x end.y Z'。 | {
"",
0.0,
1.0,
false
} | 设置组件的运动路径，入参说明如下：
- path：位移动画的运动路径，使用svg路径字符串。
- from：运动路径的起点，默认为0.0。
- to：运动路径的终点，默认为1.0。
- rotatable：是否跟随路径进行旋转。 |
+| motionPath | {
path: string,
from?: number,
to?: number,
rotatable?: boolean
}
> **说明：**
> path中支持通过start和end进行起点和终点的替代，如：
>
> 'Mstart.x start.y L50 50 Lend.x end.y Z'。 | {
"",
0.0,
1.0,
false
} | 设置组件的运动路径，入参说明如下：
- path：位移动画的运动路径，使用svg路径字符串。
- from：运动路径的起点，默认为0.0。
- to：运动路径的终点，默认为1.0。
- rotatable：是否跟随路径进行旋转。 |
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct MotionPathExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-offscreencanvasrenderingcontext2d.md b/zh-cn/application-dev/reference/arkui-ts/ts-offscreencanvasrenderingcontext2d.md
index 065c59e0d43cf97c45b5d8aac131805a64b1bb1d..f62674077b93bb96247757fbbdd6d202fdbd3e39 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-offscreencanvasrenderingcontext2d.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-offscreencanvasrenderingcontext2d.md
@@ -1,6 +1,6 @@
# OffscreenCanvasRenderingContext2D对象
->  **说明：**
+> **说明：**
> 从 API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -30,7 +30,7 @@ OffscreenCanvasRenderingContext2D(width: number, height: number, setting: Render
| [lineJoin](#linejoin) | string | 'miter' | 指定线段间相交的交点样式，可选值为：
- 'round'：在线段相连处绘制一个扇形，扇形的圆角半径是线段的宽度。
- 'bevel'：在线段相连处使用三角形为底填充， 每个部分矩形拐角独立。
- 'miter'：在相连部分的外边缘处进行延伸，使其相交于一点，形成一个菱形区域，该属性可以通过设置miterLimit属性展现效果。 |
| [miterLimit](#miterlimit) | number | 10 | 设置斜接面限制值，该值指定了线条相交处内角和外角的距离。 |
| [font](#font) | string | 'normal normal 14px sans-serif' | 设置文本绘制中的字体样式。
语法：ctx.font='font-size font-family'
- font-size(可选)，指定字号和行高，单位只支持px。
- font-family(可选)，指定字体系列。
语法：ctx.font='font-style font-weight font-size font-family'
- font-style(可选)，用于指定字体样式，支持如下几种样式：'normal', 'italic'。
- font-weight(可选)，用于指定字体的粗细，支持如下几种类型：'normal', 'bold', 'bolder', 'lighter', 100, 200, 300, 400, 500, 600, 700, 800, 900。
- font-size(可选)，指定字号和行高，单位只支持px。
- font-family(可选)，指定字体系列，支持如下几种类型：'sans-serif', 'serif', 'monospace'。 |
-| [textAlign](#textalign) | string | 'left' | 设置文本绘制中的文本对齐方式，可选值为：
- 'left'：文本左对齐。
- 'right'：文本右对齐。
- 'center'：文本居中对齐。
- 'start'：文本对齐界线开始的地方。
- 'end'：文本对齐界线结束的地方。
>  **说明：**
> ltr布局模式下start和left一致，rtl布局模式下start和right一致·。 |
+| [textAlign](#textalign) | string | 'left' | 设置文本绘制中的文本对齐方式，可选值为：
- 'left'：文本左对齐。
- 'right'：文本右对齐。
- 'center'：文本居中对齐。
- 'start'：文本对齐界线开始的地方。
- 'end'：文本对齐界线结束的地方。
> **说明：**
> ltr布局模式下start和left一致，rtl布局模式下start和right一致·。 |
| [textBaseline](#textbaseline) | string | 'alphabetic' | 设置文本绘制中的水平对齐方式，可选值为：
- 'alphabetic'：文本基线是标准的字母基线。
- 'top'：文本基线在文本块的顶部。
- 'hanging'：文本基线是悬挂基线。
- 'middle'：文本基线在文本块的中间。
- 'ideographic'：文字基线是表意字基线；如果字符本身超出了alphabetic基线，那么ideograhpic基线位置在字符本身的底部。
- 'bottom'：文本基线在文本块的底部。 与ideographic基线的区别在于ideographic 基线不需要考虑下行字母。 |
| [globalAlpha](#globalalpha) | number | - | 设置透明度，0.0为完全透明，1.0为完全不透明。 |
| [lineDashOffset](#linedashoffset) | number | 0.0 | 设置画布的虚线偏移量，精度为float。 |
@@ -42,13 +42,14 @@ OffscreenCanvasRenderingContext2D(width: number, height: number, setting: Render
| [imageSmoothingEnabled](#imagesmoothingenabled) | boolean | true | 用于设置绘制图片时是否进行图像平滑度调整，true为启用，false为不启用。 |
| imageSmoothingQuality | string | 'low' | 用于设置图像平滑度，支持如下三种类型：'low', 'medium', 'high'。 |
->  **说明：**
+> **说明：**
> <color>类型格式为 'rgb(255, 255, 255)'，'rgba(255, 255, 255, 1.0)'，'\#FFFFFF'。
### fillStyle
-```
+```ts
+// xxx.ets
@Entry
@Component
struct FillStyleExample {
@@ -80,7 +81,8 @@ struct FillStyleExample {
### lineWidth
-```
+```ts
+// xxx.ets
@Entry
@Component
struct LineWidthExample {
@@ -112,7 +114,8 @@ struct LineWidthExample {
### strokeStyle
-```
+```ts
+// xxx.ets
@Entry
@Component
struct StrokeStyleExample {
@@ -146,7 +149,8 @@ struct StrokeStyleExample {
### lineCap
-```
+```ts
+// xxx.ets
@Entry
@Component
struct LineCapExample {
@@ -182,7 +186,8 @@ struct LineCapExample {
### lineJoin
-```
+```ts
+// xxx.ets
@Entry
@Component
struct LineJoinExample {
@@ -219,7 +224,8 @@ struct LineJoinExample {
### miterLimit
-```
+```ts
+// xxx.ets
@Entry
@Component
struct MiterLimit {
@@ -256,7 +262,8 @@ struct MiterLimit {
### font
-```
+```ts
+// xxx.ets
@Entry
@Component
struct Fonts {
@@ -288,7 +295,8 @@ struct Fonts {
### textAlign
-```
+```ts
+// xxx.ets
@Entry
@Component
struct CanvasExample {
@@ -335,7 +343,8 @@ struct CanvasExample {
### textBaseline
-```
+```ts
+// xxx.ets
@Entry
@Component
struct TextBaseline {
@@ -382,7 +391,8 @@ struct TextBaseline {
### globalAlpha
-```
+```ts
+// xxx.ets
@Entry
@Component
struct GlobalAlpha {
@@ -417,7 +427,8 @@ struct GlobalAlpha {
### lineDashOffset
-```
+```ts
+// xxx.ets
@Entry
@Component
struct LineDashOffset {
@@ -464,7 +475,8 @@ struct LineDashOffset {
| copy | 显示新绘制内容而忽略现有绘制内容。 |
| xor | 使用异或操作对新绘制内容与现有绘制内容进行融合。 |
-```
+```ts
+// xxx.ets
@Entry
@Component
struct GlobalCompositeOperation {
@@ -504,7 +516,8 @@ struct GlobalCompositeOperation {
### shadowBlur
-```
+```ts
+// xxx.ets
@Entry
@Component
struct ShadowBlur {
@@ -538,7 +551,8 @@ struct ShadowBlur {
### shadowColor
-```
+```ts
+// xxx.ets
@Entry
@Component
struct ShadowColor {
@@ -573,7 +587,8 @@ struct ShadowColor {
### shadowOffsetX
-```
+```ts
+// xxx.ets
@Entry
@Component
struct ShadowOffsetX {
@@ -608,7 +623,8 @@ struct ShadowOffsetX {
### shadowOffsetY
-```
+```ts
+// xxx.ets
@Entry
@Component
struct ShadowOffsetY {
@@ -643,7 +659,8 @@ struct ShadowOffsetY {
### imageSmoothingEnabled
-```
+```ts
+// xxx.ets
@Entry
@Component
struct ImageSmoothingEnabled {
@@ -1648,7 +1665,7 @@ transform(scaleX: number, skewX: number, skewY: number, scaleY: number, translat
transform方法对应一个变换矩阵，想对一个图形进行变化的时候，只要设置此变换矩阵相应的参数，对图形的各个定点的坐标分别乘以这个矩阵，就能得到新的定点的坐标。矩阵变换效果可叠加。
->  **说明：**
+> **说明：**
> 变换后的坐标计算方式（x和y为变换前坐标，x'和y'为变换后坐标）：
>
> - x' = scaleX \* x + skewY \* y + translateX
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-page-transition-animation.md b/zh-cn/application-dev/reference/arkui-ts/ts-page-transition-animation.md
index 6c2933272d3a0e90b99bf3eb687cc736fa4a113a..1c7595fe804ee158e8f87dc050835f8758df2c3b 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-page-transition-animation.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-page-transition-animation.md
@@ -1,6 +1,6 @@
# 页面间转场
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-transition-animation-component.md b/zh-cn/application-dev/reference/arkui-ts/ts-transition-animation-component.md
index cf0b35935cccc4d96d4b21a723664ba2e2b5ddd7..15650d25328004d44a47b8cafb8bc4cc06e11ae9 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-transition-animation-component.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-transition-animation-component.md
@@ -1,6 +1,6 @@
# 组件内转场
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -16,7 +16,7 @@
- transition入参说明
| 参数名称 | 参数类型 | 默认值 | 必填 | 参数描述 |
| -------- | -------- | -------- | -------- | -------- |
- | type | TransitionType | TransitionType.All | 否 | 默认包括组件新增和删除。
>  **说明：**
> 不指定Type时说明插入删除使用同一种效果。 |
+ | type | TransitionType | TransitionType.All | 否 | 默认包括组件新增和删除。
> **说明：**
> 不指定Type时说明插入删除使用同一种效果。 |
| opacity | number | 1 | 否 | 设置组件转场时的透明度效果，为插入时起点和删除时终点的值。 |
| translate | {
x? : number,
y? : number,
z? : number
} | - | 否 | 设置组件转场时的平移效果，为插入时起点和删除时终点的值。 |
| scale | {
x? : number,
y? : number,
z? : number,
centerX? : number,
centerY? : number
} | - | 否 | 设置组件转场时的缩放效果，为插入时起点和删除时终点的值。 |
@@ -34,7 +34,8 @@
示例功能通过一个Button控制第二个Button的出现和消失，并通过transition配置第二个Button出现和消失的过场动画。
-```
+```ts
+// xxx.ets
@Entry
@Component
struct TransitionExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-transition-animation-shared-elements.md b/zh-cn/application-dev/reference/arkui-ts/ts-transition-animation-shared-elements.md
index 57ebdcd0567bb63066f95db82d19910bae33c75c..06e889473736a080f28dc92523efcbea2d0f6099 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-transition-animation-shared-elements.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-transition-animation-shared-elements.md
@@ -1,6 +1,6 @@
# 共享元素转场
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -25,7 +25,8 @@
示例功能为两个页面，共享元素转场页面图片点击后转场至页面B的图片。
-```
+```ts
+// xxx.ets
@Entry
@Component
struct SharedTransitionExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-background.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-background.md
index 12b9c249fc0b3488240d5dcac36766867b0daa96..123824d1a5deba3e49c73e5986e905dde35956db 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-background.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-background.md
@@ -1,6 +1,6 @@
# 背景设置
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -33,7 +33,8 @@
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct BackgroundExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-border.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-border.md
index add589fa8e92a1946bfbbb4d232e8bc1226a5970..d5a4caf31865e7f87f4f7c370d787bc96cd5f516 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-border.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-border.md
@@ -1,6 +1,6 @@
# 边框设置
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -34,7 +34,8 @@
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct BorderExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-click.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-click.md
index 2f62426bd2ff18c88ae86ba0ab58eeddd93fd99d..f4f688c4c3920a669da4b41e4ecbc39bceab8c96 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-click.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-click.md
@@ -1,6 +1,6 @@
# 点击控制
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -19,7 +19,8 @@
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct TouchAbleExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-enable.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-enable.md
index b3939fe73d40d7bdc9aa1616497cd14829ef412d..3c891de4cdd5a799a6301fb0fb654332c07116dc 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-enable.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-enable.md
@@ -1,6 +1,6 @@
# 禁用控制
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -19,7 +19,8 @@
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct EnabledExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-flex-layout.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-flex-layout.md
index ae6ce5b46ecfba98a33c852e996d3050552454aa..9cb57983343423c9e5b4376d00dc7fc4489d4d1e 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-flex-layout.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-flex-layout.md
@@ -1,6 +1,6 @@
# Flex布局
->  **说明：**
+> **说明：**
> - 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
>
> - 仅当父组件是Flex组件时生效。
@@ -24,7 +24,8 @@
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct FlexExample {
diff --git 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
index e6ed56978e3cbcb1fe41101ece127d0f09b40cce..0748f2a9cd61aa6c5bd468fbc6a74d11958a2ac0 100644
--- 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
@@ -1,6 +1,6 @@
# 焦点控制
->  **说明：**
+> **说明：**
> 从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -15,13 +15,14 @@
| -------- | -------- | -------- | -------- |
| focusable | boolean | false | 设置当前组件是否可以获焦。 |
->  **说明：**
+> **说明：**
> 支持焦点控制的组件：Button、Text、Image、List、Grid。
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct FocusableExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-gradient-color.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-gradient-color.md
index bfa90330fb746ec3a6bbd76371c1963bd0fe6b77..e71af0022d870bb9b803f9cdf952be61c37ae345 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-gradient-color.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-gradient-color.md
@@ -1,6 +1,6 @@
# 颜色渐变
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -37,7 +37,8 @@
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct ColorGradientExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-grid.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-grid.md
index 6237d39f4e76c11657955fea6fb7fe6e6f136aa5..47a956ac210309c8dce276dc83ab8b228fadcaed 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-grid.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-grid.md
@@ -1,6 +1,6 @@
# 栅格设置
->  **说明：**
+> **说明：**
> - 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
>
> - 栅格布局的列宽、列间距由距离最近的GridContainer父组件决定。使用栅格属性的组件树上至少需要有1个GridContainer容器组件。
@@ -17,13 +17,14 @@
| 名称 | 参数类型 | 默认值 | 描述 |
| -------- | -------- | -------- | -------- |
| useSizeType | {
xs?: number \| { span: number, offset: number },
sm?: number \| { span: number, offset: number },
md?: number \| { span: number, offset: number },
lg?: number \| { span: number, offset: number }
} | - | 设置在特定设备宽度类型下的占用列数和偏移列数，span: 占用列数; offset: 偏移列数。
当值为number类型时，仅设置列数， 当格式如{"span": 1, "offset": 0}时，指同时设置占用列数与偏移列数。
- xs: 指设备宽度类型为SizeType.XS时的占用列数和偏移列数。
- sm: 指设备宽度类型为SizeType.SM时的占用列数和偏移列数。
- md: 指设备宽度类型为SizeType.MD时的占用列数和偏移列数。
- lg: 指设备宽度类型为SizeType.LG时的占用列数和偏移列数。 |
-| gridSpan | number | 1 | 默认占用列数，指useSizeType属性没有设置对应尺寸的列数（span)时，占用的栅格列数。
>  **说明：**
> 设置了栅格span属性，组件的宽度由栅格布局决定。 |
-| gridOffset | number | 0 | 默认偏移列数，指useSizeType属性没有设置对应尺寸的偏移(offset)时， 当前组件沿着父组件Start方向，偏移的列数，也就是当前组件位于第n列。
>  **说明：**
> -配置该属性后，当前组件在父组件水平方向的布局不再跟随父组件原有的布局方式，而是沿着父组件的Start方向偏移一定位移。
> -偏移位移 = （列宽 + 间距）\* 列数。
> -设置了偏移(gridOffset)的组件之后的兄弟组件会根据该组件进行相对布局，类似相对布局。 |
+| gridSpan | number | 1 | 默认占用列数，指useSizeType属性没有设置对应尺寸的列数（span)时，占用的栅格列数。
> **说明：**
> 设置了栅格span属性，组件的宽度由栅格布局决定。 |
+| gridOffset | number | 0 | 默认偏移列数，指useSizeType属性没有设置对应尺寸的偏移(offset)时， 当前组件沿着父组件Start方向，偏移的列数，也就是当前组件位于第n列。
> **说明：**
> -配置该属性后，当前组件在父组件水平方向的布局不再跟随父组件原有的布局方式，而是沿着父组件的Start方向偏移一定位移。
> -偏移位移 = （列宽 + 间距）\* 列数。
> -设置了偏移(gridOffset)的组件之后的兄弟组件会根据该组件进行相对布局，类似相对布局。 |
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct GridContainerExample1 {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-hover-effect.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-hover-effect.md
index 796b92a921c929133d6c1f9adec13f2b0f78dcce..5ff1536cc78f199d202aa3bcb207df5656930f42 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-hover-effect.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-hover-effect.md
@@ -1,6 +1,6 @@
# 悬浮态效果
->  **说明：**
+> **说明：**
> 从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -26,7 +26,8 @@
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct HoverExample {
diff --git 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
index 8e67fd5f1e9f076ac59c5f50f977626173be5675..dbb474ba4289020a0c0676bb040b5ae2ff6ee529 100644
--- 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
@@ -1,6 +1,6 @@
# 图像效果
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -29,7 +29,8 @@
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct ImageEffectsExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-layout-constraints.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-layout-constraints.md
index 7f267aac3beda6f6a373fb0183922e512f3657c8..23a1f4329db73c2f9b262e2f56f49239d331df8c 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-layout-constraints.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-layout-constraints.md
@@ -1,6 +1,6 @@
# 布局约束
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -15,12 +15,13 @@
| 名称 | 参数说明 | 默认值 | 描述 |
| -------- | -------- | -------- | -------- |
| aspectRatio | number | - | 指定当前组件的宽高比。 |
-| displayPriority | number | - | 设置当前组件在布局容器中显示的优先级，当父容器空间不足时，低优先级的组件会被隐藏。
>  **说明：**
> 仅在Row/Column/Flex(单行)容器组件中生效。 |
+| displayPriority | number | - | 设置当前组件在布局容器中显示的优先级，当父容器空间不足时，低优先级的组件会被隐藏。
> **说明：**
> 仅在Row/Column/Flex(单行)容器组件中生效。 |
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct AspectRatioExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-location.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-location.md
index ac65f17a241863ab26b65f9c4a0c217e38d5826f..8b10308acc70b1fd271d0b1d80c67ec4ee50fd7c 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-location.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-location.md
@@ -1,6 +1,6 @@
# 位置设置
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -31,7 +31,8 @@
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct PositionExample {
@@ -64,7 +65,8 @@ struct PositionExample {
-```
+```ts
+// xxx.ets
@Entry
@Component
struct PositionExample2 {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-menu.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-menu.md
index 71c1273bb276dca02d9708a0bbd85601c98f1a31..212c9359d3f391381fda1b991be1f77412190ec0 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-menu.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-menu.md
@@ -1,6 +1,6 @@
# Menu控制
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -34,7 +34,8 @@
#### 普通菜单
-```
+```ts
+// xxx.ets
@Entry
@Component
struct MenuExample {
@@ -116,7 +117,8 @@ struct MenuExample {
#### 菜单(右键触发显示)
-```
+```ts
+// xxx.ets
@Entry
@Component
struct ContextMenuExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-opacity.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-opacity.md
index bba65d744a27c56232b24f55b1fb46b29709d666..c674cb11ba10f0cee96871bdc533756c662d765b 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-opacity.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-opacity.md
@@ -1,6 +1,6 @@
# 透明度设置
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -22,7 +22,8 @@
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct OpacityExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-overlay.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-overlay.md
index 45b00a1bdafd5018100d506adf76cf217180106f..36d01e74f0e60ee8f2dcaf55e20a6d44df689d81 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-overlay.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-overlay.md
@@ -1,6 +1,6 @@
# 浮层
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -19,7 +19,8 @@
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct OverlayExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-polymorphic-style.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-polymorphic-style.md
index 02941dc6bccbf1e0c8429e1aa69b0a22f2d30d43..2363e09c47a0faac853927abe2a58bbdf4f3930b 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-polymorphic-style.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-polymorphic-style.md
@@ -1,6 +1,6 @@
# 多态样式
->  **说明：**
+> **说明：**
> 从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -28,7 +28,8 @@
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct StyleExample {
diff --git 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
index a26b8137956befec8e1153e987e4fb49998f88c4..49a6da0005583990c70f022fc45637371430f3a2 100644
--- 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
@@ -1,6 +1,6 @@
# Popup控制
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -52,7 +52,8 @@
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct PopupExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-size.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-size.md
index cb6e258fb771a93e1ea13c04f5f70c55ae477ac7..99e4e5b2864a0c5b9bab53b42eb0dfca5e50eec6 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-size.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-size.md
@@ -1,6 +1,6 @@
# 尺寸设置
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -20,12 +20,13 @@
| padding | {
top?: Length,
right?: Length,
bottom?: Length,
left?: Length
} \| Length | 0 | 设置内边距属性。
参数为Length类型时，四个方向内边距同时生效。 |
| margin | {
top?: Length,
right?: Length,
bottom?: Length,
left?: Length
}
\| Length | 0 | 设置外边距属性。
参数为Length类型时，四个方向外边距同时生效。 |
| constraintSize | {
minWidth?: Length,
maxWidth?: Length,
minHeight?: Length,
maxHeight?: Length
} | {
minWidth: 0,
maxWidth: Infinity,
minHeight: 0,
maxHeight: Infinity
} | 设置约束尺寸，组件布局时，进行尺寸范围限制。 |
-| layoutWeight | number | 0 | 容器尺寸确定时，元素与兄弟节点主轴布局尺寸按照权重进行分配，忽略本身尺寸设置。
>  **说明：**
> 仅在Row/Column/Flex布局中生效。 |
+| layoutWeight | number | 0 | 容器尺寸确定时，元素与兄弟节点主轴布局尺寸按照权重进行分配，忽略本身尺寸设置。
> **说明：**
> 仅在Row/Column/Flex布局中生效。 |
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct SizeExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-text-style.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-text-style.md
index 920f40215e0a787c69bfad314c5d21d9989af9c0..a09990be9037c2bb45375382a3cc7885c17dc2e3 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-text-style.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-text-style.md
@@ -1,6 +1,6 @@
# 文本样式设置
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -44,7 +44,8 @@
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct TextStyleExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-touch-target.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-touch-target.md
index 2af9b5be1fb516d1c58c40c7f4e949a6f9b0a6a7..58ecb13d98fd2899ef08e3cb5c14dc84e989a2b5 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-touch-target.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-touch-target.md
@@ -1,6 +1,6 @@
# 触摸热区设置
->  **说明：**
+> **说明：**
> 从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -17,7 +17,7 @@
| 名称 | 参数类型 | 默认值 | 描述 |
| -------- | -------- | -------- | -------- |
-| responseRegion | Array<Rectangle> \| Rectangle | {
x：0,
y：0,
width：'100%',
height：'100%'
} | 设置一个或多个触摸热区，包括位置和大小。
>  **说明：**
> -百分比是相对于组件本身来度量的。
> -x和y可以设置正负值百分比。当x设置为'100%'时表示热区往右偏移组件本身宽度大小，当x设置为'-100%'时表示热区往左偏移组件本身宽度大小。当y设置为'100%'时表示热区往下偏移组件本身高度大小，当y设置为'-100%'时表示热区往上偏移组件本身高度大小。
> -width和height只能设置正值百分比。width：'100%'表示热区宽度设置为该组件本身的宽度。比如组件本身宽度是100vp，那么'100%'表示热区宽度也为100vp。height：'100%'表示热区高度设置为该组件本身的高度。 |
+| responseRegion | Array<Rectangle> \| Rectangle | {
x：0,
y：0,
width：'100%',
height：'100%'
} | 设置一个或多个触摸热区，包括位置和大小。
> **说明：**
> -百分比是相对于组件本身来度量的。
> -x和y可以设置正负值百分比。当x设置为'100%'时表示热区往右偏移组件本身宽度大小，当x设置为'-100%'时表示热区往左偏移组件本身宽度大小。当y设置为'100%'时表示热区往下偏移组件本身高度大小，当y设置为'-100%'时表示热区往上偏移组件本身高度大小。
> -width和height只能设置正值百分比。width：'100%'表示热区宽度设置为该组件本身的宽度。比如组件本身宽度是100vp，那么'100%'表示热区宽度也为100vp。height：'100%'表示热区高度设置为该组件本身的高度。 |
### Rectangle对象说明
@@ -28,13 +28,14 @@
| width | Length | 否 | 100% | 触摸热区范围的宽度。 |
| height | Length | 否 | 100% | 触摸热区范围的高度。 |
- >  **说明：**
+ > **说明：**
> 当x和y都设置为正值时，表示组件的触摸热区的范围整体往组件本身右下角偏移，偏移的大小可通过数值来设置。
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct ResponseRegionExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-transformation.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-transformation.md
index 78e95635f49d05622b97de4dc09816b34a24711a..bdc2d21f877d1e2aa3872d5a84fc12e2005073ef 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-transformation.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-transformation.md
@@ -1,6 +1,6 @@
# 图形变换
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-visibility.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-visibility.md
index 81aee8bf9c665433b40692aec2413d21ef307fbb..f103cc63eeed6700fa06ae59456326b8d944a79f 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-visibility.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-visibility.md
@@ -1,6 +1,6 @@
# 显隐控制
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -27,7 +27,8 @@
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct VisibilityExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-z-order.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-z-order.md
index 00b052581dc316917ef8f27efcaec8b86eebbd2f..598e20ca5f1ec3636e2da206a3799634c3c9f033 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-z-order.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-z-order.md
@@ -1,6 +1,6 @@
# Z序控制
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -19,7 +19,8 @@
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct ZIndexExample {
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-component-area-change-event.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-component-area-change-event.md
index 61fd9b2820f6146677c5b16808ed70c8acb3cd66..1d1b50d7a19b2165070ca9d55d2e0ad1727c13f0 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-component-area-change-event.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-component-area-change-event.md
@@ -1,6 +1,6 @@
# 组件区域变化事件
->  **说明：**
+> **说明：**
> 从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -18,7 +18,8 @@
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct AreaExample {
diff --git 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
index 417b6c0611f7827d2b71a95c31ee4df25f71d4e2..1984127548acf64d26986d2a7a126e7a0ac33f1b 100644
--- 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
@@ -1,6 +1,6 @@
# 挂载卸载事件
->  **说明：**
+> **说明：**
> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-focus-event.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-focus-event.md
index b816e134e544ffbc07b91d9946fb74ec0527e2d4..9d03181aad6a16eb5a2f09e62c44e222e1fdf917 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-focus-event.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-focus-event.md
@@ -1,6 +1,6 @@
# 焦点事件
->  **说明：**
+> **说明：**
> 从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
@@ -16,13 +16,14 @@
| onFocus(callback: () => void) | 否 | 当前组件获取焦点时触发的回调。 |
| onBlur(callback:() => void) | 否 | 当前组件失去焦点时触发的回调。 |
->  **说明：**
+> **说明：**
> 支持焦点事件的组件：Button、Text、Image、List、Grid。
## 示例
-```
+```ts
+// xxx.ets
@Entry
@Component
struct FocusEventExample {