diff --git a/zh-cn/application-dev/reference/arkui-ts/Readme-CN.md b/zh-cn/application-dev/reference/arkui-ts/Readme-CN.md index 9f8f311319536a6f3c955a92113f1df49ce0bc7d..2020b9ebb6c771f623f4ab865cd916b3e62289f6 100644 --- a/zh-cn/application-dev/reference/arkui-ts/Readme-CN.md +++ b/zh-cn/application-dev/reference/arkui-ts/Readme-CN.md @@ -105,7 +105,6 @@ - [ColumnSplit](ts-container-columnsplit.md) - [Counter](ts-container-counter.md) - [Flex](ts-container-flex.md) - - [FlowItem](ts-container-flowitem.md) - [GridCol](ts-container-gridcol.md) - [GridRow](ts-container-gridrow.md) - [Grid](ts-container-grid.md) diff --git a/zh-cn/application-dev/reference/arkui-ts/figures/zh-cn_image_0000001511900496.png b/zh-cn/application-dev/reference/arkui-ts/figures/zh-cn_image_0000001511900496.png new file mode 100644 index 0000000000000000000000000000000000000000..1231a0e0e693e1648c06b25898596bdc8546a3e0 Binary files /dev/null and b/zh-cn/application-dev/reference/arkui-ts/figures/zh-cn_image_0000001511900496.png differ diff --git a/zh-cn/application-dev/reference/arkui-ts/figures/zh-cn_image_0000001563060749.png b/zh-cn/application-dev/reference/arkui-ts/figures/zh-cn_image_0000001563060749.png new file mode 100644 index 0000000000000000000000000000000000000000..a9b5769ad867f880dbe2b746b15de80cadbf799e Binary files /dev/null and b/zh-cn/application-dev/reference/arkui-ts/figures/zh-cn_image_0000001563060749.png differ diff --git a/zh-cn/application-dev/ui/arkts-ui-development-overview.md b/zh-cn/application-dev/ui/arkts-ui-development-overview.md index dd58416c25b2100297bd93e9e021ad1bba430f7b..92edc4d7d6d2b39efe1608ab6ad996169fd5c1b4 100644 --- a/zh-cn/application-dev/ui/arkts-ui-development-overview.md +++ b/zh-cn/application-dev/ui/arkts-ui-development-overview.md @@ -5,24 +5,31 @@ - **ArkTS** + ArkTS是UI开发语言,基于TypeScript(简称TS)语言扩展而来,是TS的超集。扩展能力包含各种装饰器、自定义组件、UI描述机制。状态数据管理作为基于ArkTS的声明式开发范式的特色,通过功能不同的装饰器给开发者提供了清晰的页面更新渲染流程和管道。状态管理包括UI组件状态和应用程序状态,两者协作可以使开发者完整地构建整个应用的数据更新和UI渲染。ArkTS语言的基础知识请参考[学习ArkTS语言](../quick-start/arkts-get-started.md)。 - **布局** + 布局是UI的必要元素,它定义了组件在界面中的位置。ArkUI框架提供了多种布局方式,除了基础的线性布局、层叠布局、弹性布局、相对布局、栅格布局外,也提供了相对复杂的列表、宫格、轮播。 - **组件** + 组件是UI的必要元素,形成了在界面中的样子,由框架直接提供的称为**系统组件**,由开发者定义的称为**自定义组件**。系统内置组件包括按钮、单选框、进度条、文本等。开发者可以通过链式调用的方式设置系统内置组件的渲染效果。开发者可以将系统内置组件组合为自定义组件,通过这种方式将页面组件化为一个个独立的UI单元,实现页面不同单元的独立创建、开发和复用,具有更强的工程性。 - **页面路由和组件导航** + 应用可能包含多个页面,可通过页面路由实现页面间的跳转。一个页面内可能存在组件间的导航如典型的分栏,可通过导航组件实现组件间的导航。 - **图形** + 方舟开发框架提供了多种类型图片的显示能力和多种自定义绘制的能力,以满足开发者的自定义绘图需求,支持绘制形状、填充颜色、绘制文本、变形与裁剪、嵌入图片等。 - **动画** + 动画是UI的重要元素之一。优秀的动画设计能够极大地提升用户体验,框架提供了丰富的动画能力,除了组件内置动画效果外,还包括属性动画、显式动画、自定义转场动画以及动画API等,开发者可以通过封装的物理模型或者调用动画能力API来实现自定义动画轨迹。 - **交互事件** + 交互事件是UI和用户交互的必要元素。方舟开发框架提供了多种交互事件,除了触摸事件、鼠标事件、键盘按键事件、焦点事件等通用事件外,还包括基于通用事件进行进一步识别的手势事件。手势事件有单一手势如点击手势、长按手势、拖动手势、捏合手势、旋转手势、滑动手势,以及通过单一手势事件进行组合的组合手势事件。