** component, the built-in sliding gestures can still be triggered. |
## Gesture Response Event
The component binds gesture objects of different **GestureType**s through gesture events. Each gesture object provides gesture-related information in the gesture response event. In the following example, the **TapGesture** object provides gesture-related information in the **onAction** event. For details about the event definitions of other gestures, see the corresponding gesture sections. To bind multiple gestures, use [combined gestures](ts-combined-gestures.md).
- TapGesture
- | Name| Description|
- | -------- | -------- |
- | onAction((event?:GestureEvent) => void) | Callback invoked when a tap gesture is recognized.|
+ | Name | Description |
+ | ---------------------------------------- | ---------------------------------------- |
+ | onAction((event?:GestureEvent) => void) | Callback invoked when a tap gesture is recognized. |
## GestureEvent
-| Name| Type| Description|
-| -------- | -------- | -------- |
-| repeat | boolean | Whether the event is triggered repeatedly. This attribute is used for the **LongPressGesture** event. |
-| offsetX | number | Offset of the gesture event on the x-axis, in vp. This attribute is used for the **PanGesture** event. A positive value means panning from left to right, and a negative value means the opposite. |
-| offsetY | number | Offset of the gesture event on the y-axis, in vp. This attribute is used for the **PanGesture** event. A positive value means panning from top to bottom, and a negative value means the opposite. |
-| angle | number | Rotation angle for the **RotationGesture** event;
angle of the swipe gesture for the **SwipeGesture** event, that is, the change in the included angle between the line segment created by the two fingers and the horizontal direction.
**NOTE**
Angle calculation method: After a swipe gesture is recognized, a line connecting the two fingers is identified as the initial line. As the fingers swipe, the line between the fingers rotates. Based on the coordinates of the initial line's and current line's end points, an arc tangent function is used to calculate the respective included angle of the points relative to the horizontal direction by using the following formula: Rotation angle = arctan2(cy2-cy1,cx2-cx1) – arctan2(y2-y1,x2-x1) The initial line is used as the coordinate system. The clockwise rotation is 0 to 180 degrees, and the counter-clockwise rotation is –180 to 0 degrees.|
-| scale | number | Scale ratio. This attribute is used for the **PinchGesture** event.|
-| pinchCenterX | number | X-coordinate of the center of the pinch gesture, in px relative to the upper left corner of the current component. This attribute is used for the **PinchGesture** event. |
-| pinchCenterY | number | Y-coordinate of the center of the pinch gesture, in px relative to the upper left corner of the current component. This attribute is used for the **PinchGesture** event. |
-| speed8+ | number | Swipe gesture speed, that is, the average swipe speed of all fingers. The unit is vp/s. This attribute is used for the **SwipeGesture** event.|
-| fingerList8+ | [FingerInfo](#fingerinfo)[] | Information about all fingers that trigger the event, which is used for the **LongPressGesture** and **TapGesture** events.|
-| timestamp8+ | number | Timestamp of the event.|
-| target8+ | [EventTarget](ts-universal-events-click.md#eventtarget8) | Display area of the element that triggers the gesture event.|
-| source8+ | [SourceType](#sourcetype) | Event input device.|
+| Name | Type | Description |
+| ----------------------- | ---------------------------------------- | ---------------------------------------- |
+| repeat | boolean | Whether the event is triggered repeatedly. This attribute is used for the **LongPressGesture** event. |
+| offsetX | number | Offset of the gesture event on the x-axis, in vp. This attribute is used for the **PanGesture** event. A positive value means panning from left to right, and a negative value means the opposite. |
+| offsetY | number | Offset of the gesture event on the y-axis, in vp. This attribute is used for the **PanGesture** event. A positive value means panning from top to bottom, and a negative value means the opposite. |
+| angle | number | Rotation angle for the **RotationGesture** event;
angle of the swipe gesture for the **SwipeGesture** event, that is, the change in the included angle between the line segment created by the two fingers and the horizontal direction.
**NOTE**
Angle calculation method: After a swipe gesture is recognized, a line connecting the two fingers is identified as the initial line. As the fingers swipe, the line between the fingers rotates. Based on the coordinates of the initial line's and current line's end points, an arc tangent function is used to calculate the respective included angle of the points relative to the horizontal direction by using the following formula: Rotation angle = arctan2(cy2-cy1,cx2-cx1) – arctan2(y2-y1,x2-x1) The initial line is used as the coordinate system. The clockwise rotation is 0 to 180 degrees, and the counter-clockwise rotation is –180 to 0 degrees. |
+| scale | number | Scale ratio. This attribute is used for the **PinchGesture** event. |
+| pinchCenterX | number | X-coordinate of the center of the pinch gesture, in px relative to the upper left corner of the current component. This attribute is used for the **PinchGesture** event. |
+| pinchCenterY | number | Y-coordinate of the center of the pinch gesture, in px relative to the upper left corner of the current component. This attribute is used for the **PinchGesture** event. |
+| speed8+ | number | Swipe gesture speed, that is, the average swipe speed of all fingers. The unit is vp/s. This attribute is used for the **SwipeGesture** event. |
+| fingerList8+ | [FingerInfo](#fingerinfo)[] | Information about all fingers that trigger the event, which is used for the **LongPressGesture** and **TapGesture** events. |
+| timestamp8+ | number | Timestamp of the event. |
+| target8+ | [EventTarget](ts-universal-events-click.md#eventtarget8) | Display area of the element that triggers the gesture event. |
+| source8+ | [SourceType](#sourcetype) | Event input device. |
## SourceType
-| Name| Description|
-| -------- | -------- |
-| Unknown | Unknown device type.|
-| Mouse | Mouse.|
-| TouchScreen | Touchscreen.|
+| Name | Description |
+| ----------- | -------------------- |
+| Unknown | Unknown device type. |
+| Mouse | Mouse. |
+| TouchScreen | Touchscreen. |
## FingerInfo
-| Name| Type| Description|
-| -------- | -------- | -------- |
-| id | number | Index of a finger.|
-| globalX | number | X-coordinate relative to the upper left corner of the application window.|
-| globalY | number | Y-coordinate relative to the upper left corner of the application window.|
-| localX | number | X-coordinate relative to the upper left corner of the current component.|
-| localY | number | Y-coordinate relative to the upper left corner of the current component.|
+| Name | Type | Description |
+| ------- | ------ | ---------------------------------------- |
+| id | number | Index of a finger. |
+| globalX | number | X-coordinate relative to the upper left corner of the application window. |
+| globalY | number | Y-coordinate relative to the upper left corner of the application window. |
+| localX | number | X-coordinate relative to the upper left corner of the current component. |
+| localY | number | Y-coordinate relative to the upper left corner of the current component. |
## Example
diff --git a/zh-cn/application-dev/reference/arkui-js/js-components-common-attributes.md b/zh-cn/application-dev/reference/arkui-js/js-components-common-attributes.md
index 6ac384c0e59e3c4a3340f7fb6137be138cb87f95..1779d6cbfdb1131518a60eff4b6fddbf34126fea 100644
--- a/zh-cn/application-dev/reference/arkui-js/js-components-common-attributes.md
+++ b/zh-cn/application-dev/reference/arkui-js/js-components-common-attributes.md
@@ -139,4 +139,4 @@ export default {
}
```
-
\ No newline at end of file
+
\ No newline at end of file
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 323fc72b1e63787f0be933224e4406c47a33e984..39b07310d12bd41fff675e3bf39b2176c5e55bb9 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
@@ -6,11 +6,10 @@
>
> 该组件从API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
-
## 子组件
- 构造参数type为"surface"时不支持。\
+
+ 构造参数type为"surface"时不支持。
+
从API version 9开始，构造参数type为"component"时可以包含子组件。
## 接口
@@ -19,12 +18,12 @@
**参数:**
-| 参数名 | 参数类型 | 必填 | 描述 |
-| --------- | ------ | ---- | ----- |
-| id | string | 是 | 组件的唯一标识，支持最大的字符串长度128。 |
-| type | string | 是 | 用于指定XComponent组件类型，可选值为：
-"surface"：用于EGL/OpenGLES和媒体数据写入，组件内容单独送显，直接合成到屏幕。
-"component"9+ ：XComponent将变成一个容器组件，并可在其中执行非UI逻辑以动态加载显示内容。 |
-| libraryname | string | 否 | 应用Native层编译输出动态库名称，仅XComponent类型为"surface"时有效。 |
-| controller | [XComponentcontroller](#xcomponentcontroller) | 否 | 给组件绑定一个控制器，通过控制器调用组件方法，仅XComponent类型为"surface"时有效。 |
+| 参数名 | 参数类型 | 必填 | 描述 |
+| ----------- | ---------------------------------------- | ---- | ---------------------------------------- |
+| id | string | 是 | 组件的唯一标识，支持最大的字符串长度128。 |
+| type | string | 是 | 用于指定XComponent组件类型，可选值为：
-"surface"：用于EGL/OpenGLES和媒体数据写入，组件内容单独送显，直接合成到屏幕。
-"component"9+ ：XComponent将变成一个容器组件，并可在其中执行非UI逻辑以动态加载显示内容。 |
+| libraryname | string | 否 | 应用Native层编译输出动态库名称，仅XComponent类型为"surface"时有效。 |
+| controller | [XComponentcontroller](#xcomponentcontroller) | 否 | 给组件绑定一个控制器，通过控制器调用组件方法，仅XComponent类型为"surface"时有效。 |
> **说明：**
>
@@ -46,7 +45,7 @@
## 事件
-仅type为"surface"时以下事件有效。不支持[通用事件和手势](./Readme-CN.md)。
+仅type为"surface"时以下事件有效。不支持[通用事件](ts-universal-events-click.md)和[手势](ts-gesture-settings.md)。
### onLoad
@@ -56,9 +55,9 @@ onLoad(callback: (event?: object) => void )
**参数:**
-| 参数名 | 参数类型 | 必填 | 描述 |
-| ------------- | ------ | ---- | ----------------------- |
-| event | object | 否 | 获取XComponent实例对象的context，context上挂载的方法由开发者在c++层定义。 |
+| 参数名 | 参数类型 | 必填 | 描述 |
+| ----- | ------ | ---- | ---------------------------------------- |
+| event | object | 否 | 获取XComponent实例对象的context，context上挂载的方法由开发者在c++层定义。 |
### onDestroy
@@ -99,7 +98,7 @@ setXComponentSurfaceSize(value: {surfaceWidth: number, surfaceHeight: number}):
**参数:**
-| 参数名 | 参数类型 | 必填 | 描述 |
+| 参数名 | 参数类型 | 必填 | 描述 |
| ------------- | ------ | ---- | ----------------------- |
| surfaceWidth | number | 是 | XComponent持有Surface的宽度。 |
| surfaceHeight | number | 是 | XComponent持有Surface的高度。 |
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 30a4714088ec8073702e2b79e25f3c6001cf2026..bdd1e633c7d43b7290c61620de71304ce0e60ede 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
@@ -22,12 +22,12 @@ Video(value: {src?: string | Resource, currentProgressRate?: number | string | P
**参数：**
-| 参数名 | 参数类型 | 必填 | 参数描述 |
-| ------------------- | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ |
-| src | string \| [Resource](ts-types.md) | 否 | 视频播放源的路径，支持本地视频路径和网络路径。
支持在resources下面的video或rawfile文件夹里放置媒体资源。
支持dataability://的路径前缀，用于访问通过Data Ability提供的视频路径，具体路径信息详见[DataAbility说明](../../ability/fa-dataability.md)。
**说明：**
视频支持的格式是：mp4、mkv、webm、TS。 |
-| currentProgressRate | number \| string \| PlaybackSpeed8+ | 否 | 视频播放倍速。
**说明：**
number取值仅支持：0.75，1.0，1.25，1.75，2.0。
默认值：1.0 \| PlaybackSpeed.Speed_Forward_1_00_X |
-| previewUri | string \| PixelMap8+ \| [Resource](ts-types.md) | 否 | 视频未播放时的预览图片路径。 |
-| controller | [VideoController](#videocontroller) | 否 | 设置视频控制器。 |
+| 参数名 | 参数类型 | 必填 | 参数描述 |
+| ------------------- | ---------------------------------------- | ---- | ---------------------------------------- |
+| src | string \| [Resource](ts-types.md) | 否 | 视频播放源的路径，支持本地视频路径和网络路径。
支持在resources下面的video或rawfile文件夹里放置媒体资源。
支持dataability://的路径前缀，用于访问通过Data Ability提供的视频路径，具体路径信息详见[DataAbility说明](../../application-models/dataability-overview.md)。
**说明：**
视频支持的格式是：mp4、mkv、webm、TS。 |
+| currentProgressRate | number \| string \| PlaybackSpeed8+ | 否 | 视频播放倍速。
**说明：**
number取值仅支持：0.75，1.0，1.25，1.75，2.0。
默认值：1.0 \| PlaybackSpeed.Speed_Forward_1_00_X |
+| previewUri | string \| PixelMap8+ \| [Resource](ts-types.md) | 否 | 视频未播放时的预览图片路径。 |
+| controller | [VideoController](#videocontroller) | 否 | 设置视频控制器。 |
## PlaybackSpeed8+枚举说明
@@ -43,29 +43,29 @@ Video(value: {src?: string | Resource, currentProgressRate?: number | string | P
除支持[通用属性](ts-universal-attributes-size.md)外，还支持以下属性：
-| 名称 | 参数类型 | 描述 |
-| --------- | ---------------------------------------- | ----------------------------------------------- |
-| muted | boolean | 是否静音。
默认值：false |
-| autoPlay | boolean | 是否自动播放。
默认值：false |
+| 名称 | 参数类型 | 描述 |
+| --------- | ---------------------------------------- | ---------------------------- |
+| muted | boolean | 是否静音。
默认值：false |
+| autoPlay | boolean | 是否自动播放。
默认值：false |
| controls | boolean | 控制视频播放的控制栏是否显示。
默认值：true |
-| objectFit | [ImageFit](ts-basic-components-image.md) | 设置视频显示模式。
默认值：Cover |
-| loop | boolean | 是否单个视频循环播放。
默认值：false |
+| objectFit | [ImageFit](ts-basic-components-image.md) | 设置视频显示模式。
默认值：Cover |
+| loop | boolean | 是否单个视频循环播放。
默认值：false |
## 事件
除支持[通用事件](ts-universal-events-click.md)外，还支持以下事件：
-| 名称 | 功能描述 |
-| ------------------------------------------------------------ | ------------------------------------------------------------ |
-| onStart(event:() => void) | 播放时触发该事件。 |
-| onPause(event:() => void) | 暂停时触发该事件。 |
-| onFinish(event:() => void) | 播放结束时触发该事件。 |
-| onError(event:() => void) | 播放失败时触发该事件。 |
+| 名称 | 功能描述 |
+| ---------------------------------------- | ---------------------------------------- |
+| onStart(event:() => void) | 播放时触发该事件。 |
+| onPause(event:() => void) | 暂停时触发该事件。 |
+| onFinish(event:() => void) | 播放结束时触发该事件。 |
+| onError(event:() => void) | 播放失败时触发该事件。 |
| onPrepared(callback:(event?: { duration: number }) => void) | 视频准备完成时触发该事件，通过duration可以获取视频时长，单位为秒(s)。 |
-| onSeeking(callback:(event?: { time: number }) => void) | 操作进度条过程时上报时间信息，单位为s。 |
-| onSeeked(callback:(event?: { time: number }) => void) | 操作进度条完成后，上报播放时间信息，单位为s。 |
-| onUpdate(callback:(event?: { time: number }) => void) | 播放进度变化时触发该事件，单位为s，更新时间间隔为250ms。 |
-| onFullscreenChange(callback:(event?: { fullscreen: boolean }) => void) | 在全屏播放与非全屏播放状态之间切换时触发该事件，返回值为true表示进入全屏播放状态，为false则表示非全屏播放。 |
+| onSeeking(callback:(event?: { time: number }) => void) | 操作进度条过程时上报时间信息，单位为s。 |
+| onSeeked(callback:(event?: { time: number }) => void) | 操作进度条完成后，上报播放时间信息，单位为s。 |
+| onUpdate(callback:(event?: { time: number }) => void) | 播放进度变化时触发该事件，单位为s，更新时间间隔为250ms。 |
+| onFullscreenChange(callback:(event?: { fullscreen: boolean }) => void) | 在全屏播放与非全屏播放状态之间切换时触发该事件，返回值为true表示进入全屏播放状态，为false则表示非全屏播放。 |
## VideoController
@@ -106,9 +106,9 @@ setCurrentTime(value: number)
**参数：**
-| 参数名 | 参数类型 | 必填 | 参数描述 |
-| ------ | -------- | ---- | --------------------------- |
-| value | number | 是 | 视频播放进度位置，单位为s。 |
+| 参数名 | 参数类型 | 必填 | 参数描述 |
+| ----- | ------ | ---- | -------------- |
+| value | number | 是 | 视频播放进度位置，单位为s。 |
### requestFullscreen
@@ -118,8 +118,8 @@ requestFullscreen(value: boolean)
**参数：**
-| 参数名 | 参数类型 | 必填 | 参数描述 |
-| ----- | ------ | ---- | ------- |
+| 参数名 | 参数类型 | 必填 | 参数描述 |
+| ----- | ------- | ---- | --------------------- |
| value | boolean | 是 | 是否全屏播放。
默认值：false |
### exitFullscreen
@@ -136,10 +136,10 @@ setCurrentTime(value: number, seekMode: SeekMode)
**参数：**
-| 参数名 | 参数类型 | 必填 | 参数描述 |
-| -------- | -------- | ---- | ------------------ |
-| value | number | 是 | 视频播放进度位置，单位为s。 |
-| seekMode | SeekMode | 是 | 跳转模式。 |
+| 参数名 | 参数类型 | 必填 | 参数描述 |
+| -------- | -------- | ---- | -------------- |
+| value | number | 是 | 视频播放进度位置，单位为s。 |
+| seekMode | SeekMode | 是 | 跳转模式。 |
## SeekMode8+枚举说明
diff --git a/zh-cn/application-dev/reference/js-service-widget-ui/js-service-widget-file.md b/zh-cn/application-dev/reference/js-service-widget-ui/js-service-widget-file.md
index d6102070dff485d382545b8bc5cfcb9fa8895fc9..f4684f5c8937166c2d1d4425b73a46f7035c8a96 100644
--- a/zh-cn/application-dev/reference/js-service-widget-ui/js-service-widget-file.md
+++ b/zh-cn/application-dev/reference/js-service-widget-ui/js-service-widget-file.md
@@ -58,6 +58,6 @@ JS服务卡片(entry/src/main/js/Widget)的典型开发目录结构如下：
## 配置文件
-FA卡片需要在应用配置文件config.json中进行配置。详细的配置内容请参考[FA卡片配置文件说明](../../ability/fa-formability.md#配置卡片配置文件)。
+FA卡片需要在应用配置文件config.json中进行配置。详细的配置内容请参考[FA卡片配置文件说明](../../application-models/widget-development-fa.md#配置卡片配置文件)。
-Stage卡片需要在应用配置文件module.json5中的extensionAbilities标签下，配置ExtensionAbility相关信息。详细的配置内容请参考[Stage卡片配置文件说明](../../ability/stage-formextension.md#配置卡片配置文件)。
\ No newline at end of file
+Stage卡片需要在应用配置文件module.json5中的extensionAbilities标签下，配置ExtensionAbility相关信息。详细的配置内容请参考[Stage卡片配置文件说明](../../application-models/widget-development-stage.md#配置卡片配置文件)。
\ No newline at end of file
diff --git a/zh-cn/application-dev/reference/js-service-widget-ui/js-service-widget-syntax-css.md b/zh-cn/application-dev/reference/js-service-widget-ui/js-service-widget-syntax-css.md
index 809c934f24978bb4ef2350a1be405676b9174d34..73d3376deb8aa579b4d690ddd985c2df84dcfc0d 100644
--- a/zh-cn/application-dev/reference/js-service-widget-ui/js-service-widget-syntax-css.md
+++ b/zh-cn/application-dev/reference/js-service-widget-ui/js-service-widget-syntax-css.md
@@ -23,7 +23,7 @@ CSS是描述HML页面结构的样式语言。所有组件均存在系统默认
每个页面目录下存在一个与布局hml文件同名的css文件，用来描述该hml页面中组件的样式，决定组件应该如何显示。
1. 内部样式，支持使用style、class属性来控制组件的样式。例如：
-
+
```html
@@ -31,7 +31,7 @@ CSS是描述HML页面结构的样式语言。所有组件均存在系统默认
```
-
+
```css
/* index.css */
.container {
@@ -40,7 +40,7 @@ CSS是描述HML页面结构的样式语言。所有组件均存在系统默认
```
2. 文件导入，合并外部样式文件。例如，在common目录中定义样式文件style.css，并在index.css中进行导入：
-
+
```css
/* style.css */
.title {
@@ -48,7 +48,7 @@ CSS是描述HML页面结构的样式语言。所有组件均存在系统默认
}
```
-
+
```css
/* index.css */
@import '../../common/style.css';
@@ -62,10 +62,10 @@ CSS是描述HML页面结构的样式语言。所有组件均存在系统默认
css选择器用于选择需要添加样式的元素，支持的选择器如下表所示：
-| 选择器 | 样例 | 样例描述 |
-| -------- | -------- | -------- |
+| 选择器 | 样例 | 样例描述 |
+| ------ | ---------- | ------------------------- |
| .class | .container | 用于选择class="container"的组件。 |
-| \#id | \#titleId | 用于选择id="titleId"的组件。 |
+| \#id | \#titleId | 用于选择id="titleId"的组件。 |
示例：
diff --git a/zh-cn/application-dev/ui/arkui-overview.md b/zh-cn/application-dev/ui/arkui-overview.md
index 842f41437ad61473148e93a21923e70e045c1052..7fa89a6eac39ce7be21dc7cca64f85b83723f419 100644
--- a/zh-cn/application-dev/ui/arkui-overview.md
+++ b/zh-cn/application-dev/ui/arkui-overview.md
@@ -27,7 +27,7 @@
| 开发范式名称 | 简介 | 适用场景 | 适用人群 |
| -------- | ---------------------------------------- | ---------------- | ------------------- |
| 声明式开发范式 | 采用基于TypeScript进行声明式UI语法扩展而来的[ArkTS语言](../quick-start/arkts-get-started.md)，从组件、动画和状态管理三个维度提供了UI绘制能力。声明式开发范式更接近自然语义的编程方式，让开发者直观地描述UI界面，不必关心框架如何实现UI绘制和渲染，实现极简高效开发。 | 复杂度较大、团队合作度较高的应用 | 移动系统应用开发人员、系统应用开发人员 |
- | 类Web开发范式 | 采用经典的HML、CSS、JavaScript三段式开发方式，使用HML标签文件进行布局搭建，使用CSS文件进行样式描述，使用JavaScript文件进行逻辑处理。UI组件与数据之间通过单向数据绑定的方式建立关联，当数据发生变化时，UI界面自动触发刷新。该开发方式更接近Web前端开发者的使用习惯，便于快速将已有的Web应用改造成方舟开发框架应用。 | 界面较简单的中小型应用和卡片 | Web前端开发人员 |
+ | 类Web开发范式 | 采用经典的HML、CSS、JavaScript三段式开发方式，使用HML标签文件进行布局搭建，使用CSS文件进行样式描述，使用JavaScript文件进行逻辑处理。UI组件与数据之间通过单向数据绑定的方式建立关联，当数据发生变化时，UI界面自动触发刷新。该开发方式更接近Web前端开发者的使用习惯，便于快速将已有的Web应用改造成方舟开发框架应用。 | 界面较简单的中小型应用和卡片 | Web前端开发人员 |
## 框架结构
@@ -37,24 +37,24 @@
## UI与Ability框架的关系
-Ability也是OpenHarmony应用的重要组成部分，[Ability框架](../ability/ability-brief.md)包括FA模型与Stage模型两种模型。下表给出了Ability框架的两种模型分别与方舟开发框架的两种开发范式的关系。
+OpenHarmony提供了FA模型与Stage模型两种[应用模型](../application-models/application-model-description.md)。下表给出了两种模型分别与方舟开发框架的两种开发范式的关系。
**FA模型：**
- | 类型 | UI开发范式 | 说明 |
- | -------- | --------------------------- | --------------------------- |
- | 应用 | 类web开发范式 | UI开发语言：使用hml/css/js
业务入口：使用固定文件名app.ets（Page类型Ability）/service.ts（Service类型Ability）/data.ts（Data类型Ability）
业务逻辑语言：js/ts |
- | | 声明式开发范式 | UI开发语言：ArkTS
业务入口：使用固定文件名app.ets（Page类型Ability）/service.ts（Service类型Ability）/data.ts（Data类型Ability）
业务逻辑语言：js/ts |
- | 服务卡片 | 类web开发范式 | UI开发语言：卡片显示使用hml+css+json(action)
业务入口：form.ts
卡片业务逻辑语言：js/ts |
- | | 声明式开发范式 | 当前不支持 |
+| 类型 | UI开发范式 | 说明 |
+| ---- | -------- | ---------------------------------------- |
+| 应用 | 类web开发范式 | UI开发语言：使用hml/css/js
业务入口：使用固定文件名app.ets（Page类型Ability）/service.ts（Service类型Ability）/data.ts（Data类型Ability）
业务逻辑语言：js/ts |
+| | 声明式开发范式 | UI开发语言：ArkTS
业务入口：使用固定文件名app.ets（Page类型Ability）/service.ts（Service类型Ability）/data.ts（Data类型Ability）
业务逻辑语言：js/ts |
+| 服务卡片 | 类web开发范式 | UI开发语言：卡片显示使用hml+css+json(action)
业务入口：form.ts
卡片业务逻辑语言：js/ts |
+| | 声明式开发范式 | 当前不支持 |
**Stage模型：**
- | 类型 | UI开发范式 | 说明 |
- | -------- | --------------------------- | --------------------------- |
- | 应用 | 类web开发范式 | 当前不支持 |
- | | 声明式开发范式 | UI开发语言：ArkTS
业务入口：应用模型基于ohos.application.Ability/ExtensionAbility等派生
业务逻辑语言：ts |
- | 服务卡片 | 类web开发范式 | UI开发语言：卡片显示使用hml+css+json(action)
业务入口：从FormExtensionAbility派生
业务逻辑语言：ts |
- | | 声明式开发范式 | 当前不支持 |
+| 类型 | UI开发范式 | 说明 |
+| ---- | -------- | ---------------------------------------- |
+| 应用 | 类web开发范式 | 当前不支持 |
+| | 声明式开发范式 | UI开发语言：ArkTS
业务入口：应用模型基于ohos.application.Ability/ExtensionAbility等派生
业务逻辑语言：ts |
+| 服务卡片 | 类web开发范式 | UI开发语言：卡片显示使用hml+css+json(action)
业务入口：从FormExtensionAbility派生
业务逻辑语言：ts |
+| | 声明式开发范式 | 当前不支持 |