引言

ArkUI 是 HarmonyOS 为应用 UI 开发提供的完整基础设施，涵盖简洁 UI 语法、丰富 UI 功能、实时界面预览工具，可有力支持开发者开展可视化界面开发。本节课将系统讲解 ArkUI 框架的基础能力、架构分层、核心特性、声明式开发范式以及常用组件分类。

核心内容

ArkUI 框架核心定位与基础能力

ArkUI 深度融合了语言、编译器与图形栈能力，为 UI 开发提供完整支撑。

架构分层

ArkUI 架构分为三个核心层级：

层级	核心职责
开发模型层	提供 UI 开发范式的基础语言规范，内置 UI 组件、布局、动画，提供多种状态管理机制，为应用开发者提供完善的技术支持
引擎层	后端引擎构建兼容不同开发范式的 UI 渲染管线，提供多种基础组件处理、精准布局计算、动效交互事件处理能力，具备状态管理和绘制能力，可将渲染指令准确绘制到屏幕
平台抽象层	针对不同操作系统的渲染层进行适配，消除不同平台间的接口差异，保障 ArkUI 框架在多平台使用时的一致性

核心特性

特性模块	具体能力
丰富的 UI 组件	提供符合 HarmonyOS Design 规范的 UI 组件，内置平滑动画，共 100+ 组件与样式
极简的 UI 语法	采用声明式 UI，可提升 30% 开发效率
ArkTS/C++ 混合开发	支持独立渲染能力，可接入相机输入
易用的 UI 多端能力	支持响应式布局、多态控件、Syscap 能力
实时开发预览	所见即所得，支持多种设备类型预览
跨平台开发	依托鸿蒙开发框架实现跨平台，支持 API 桥接，达到原生渲染性能

声明式开发范式核心概念

声明式开发范式定义

基于 ArkTS 的声明式开发范式，是一套开发极简、高性能、支持跨设备的 UI 开发框架，提供了构建 HarmonyOS 应用 UI 所必需的能力。

核心逻辑：f(Data) → UI，通过数据驱动 UI 变化，实现 UI 与逻辑分离，开发方式更加直观且高效。

开发者只需描述 UI 的最终状态，无需关注具体渲染过程，框架负责处理 UI 的创建、更新、删除，可提升编码效率与代码可读性。

声明式与命令式开发范式对比

对比维度	命令式开发范式	基于 ArkTS 的声明式开发范式
开发要求	开发者手动编写每一步 UI 渲染操作（创建/修改/删除）	开发者只需描述 UI 最终状态，不关注渲染过程
代码特点	UI 状态和操作逻辑混杂，代码量大易出错	UI 结构直接在代码描述，与状态数据关系隐式，代码更简洁
适用场景	适合面向框架性的应用	适合面向业务型的应用

声明式开发范式的三点优势：

1. 对开发者：无需关心底层实现细节，可将注意力更多放在上层业务。

2. 对框架：可在保证上层接口稳定的前提下持续迭代优化。

3. 对整个系统：可更全面地收集信息，优化系统行为，提升整体运行效率。

ArkUI 常用组件分类

ArkUI 提供了超过 100 种基础组件与样式，并新增了场景化组件，有效降低了复杂场景下的开发难度。常用组件可分为三大类：基础组件、布局容器组件、导航组件。

基础组件

基础组件是展示页面的基础元素。

组件	说明
Button	响应用户点击操作，分为普通按钮、胶囊按钮、圆形按钮三种类型；可作为容器嵌套文字/图片实现自定义按钮
Text	展示文本内容，支持两种加载模式：直接传入字符串加载，或预配置资源后通过资源路径加载
Image	显示图片，支持 png、jpg、bmp、svg、gif 等多种图片格式

布局容器组件

布局容器组件用于在界面上组织组件的排列。

组件	说明
Row/Column（线性布局）	开发最常用的布局，Row 让子组件沿水平方向排列，Column 让子组件沿垂直方向排列
Swiper	支持滑动轮播展示，可轮播多个子组件
List	列表容器，内容超出屏幕后自动提供滚动功能，适合展示同类数据集合
Grid（网格布局）	由行和列分割出的单元格组成，对页面均分和组件占比控制能力强，属于自适应布局
WaterFlow（瀑布流）	按行列表格排列，可自动将尺寸不同的组件自上而下排列，形成错落有致的瀑布流布局

导航组件

导航组件用于实现页面跳转或切换。

组件	说明
Navigation	路由导航组件，包含导航页和主页；导航页由标题栏和工具栏组成，可通过属性隐藏，页面间可通过路由操作切换
Tabs	页签导航，由 TabContent 和 TabBar 组成，按导航位置可分为底部导航、顶部导航、侧边导航三种布局

场景化扩展组件

组件	说明
图案密码锁组件	九宫格输入，用于密码验证
Slider 滑动条	快速调节数值，如调节音量、亮度
CalendarPicker	日历选择器，弹出日历供选择日期
TextPicker	滑动选择文本内容
DatePicker	按指定范围选择日期
TimePicker	选择小时与分钟

ArkUI 扩展能力

ArkTS/C++ 混合开发

为了满足高性能开发需求，ArkUI 支持 ArkTS 与 C++ 混合开发：开发者可将高负载渲染逻辑使用 C++ 开发为动态库，应用业务逻辑使用 ArkTS 开发。例如使用该方式实现需要独立渲染的游戏地图。

多设备适配能力

• 布局适配：提供自适应布局与响应式布局，实现一套代码适配多设备的布局效果。

• 交互统一：针对不同设备交互方式差异（PC 键鼠交互 / 手机平板触摸交互），ArkUI 统一了交互事件和组件交互方式，屏蔽设备差异，简化开发逻辑。

实时预览能力

• 提供所见即所得的实时预览能力，预览效果与目标设备的 UI 呈现效果一致。

• 编码过程中 UI 可同步更新，代码和 UI 可双向操作，随时查看和编辑组件属性。

• 支持组件级预览和多设备同时预览，全方位提升开发体验。

总结

本节课介绍了 ArkUI 框架的基础知识：

1. 框架定位：ArkUI 为应用 UI 开发提供完整基础设施，包含简洁语法、丰富功能、预览工具，深度融合语言、编译器与图形栈能力。

2. 架构分层：分为开发模型层（语言规范与组件）、引擎层（渲染管线与状态管理）、平台抽象层（跨平台适配）三层。

3. 声明式开发范式：基于 ArkTS，核心逻辑为 f(Data) → UI，通过数据驱动 UI 变化，实现 UI 与逻辑分离，相比命令式开发更加简洁高效。

4. 组件体系：提供 100+ 组件，分为基础组件（Button/Text/Image）、布局容器组件（Row/Column/List/Grid/WaterFlow）、导航组件（Navigation/Tabs）三大类，另有场景化扩展组件。

5. 扩展能力：支持 ArkTS/C++ 混合开发、多设备适配（自适应布局 + 统一交互）、实时预览（所见即所得，组件级与多设备预览）。