OpenHarmony实战开发——图形UI组件解析

作者：Gausst松鼠会 | 2024-05-19 20:54:47

踩

简介

图形UI组件实现了一套系统级的图形引擎。

该组件为应用开发提供UIKit接口，包括了动画、布局、图形转换、事件处理，以及丰富的UI组件。

组件内部直接调用HAL接口，或者使用WMS(Window Manager Service)提供的客户端与硬件交互，以完成事件响应、图像绘制等操作。

图 1 图形子系统架构图

/foundation/arkui/ui_lite
├── frameworks                  # 框架代码
│   ├── animator                # 动画模块
│   ├── common                  # 公共模块
│   ├── components              # 组件
│   ├── core                    # ui主流程（渲染、任务管理等）
│   ├── default_resource
│   ├── dfx                     # 维测功能
│   ├── dock                    # 驱动适配层
│   │   └── ohos                # ohos平台适配
│   ├── draw                    # 绘制逻辑
│   ├── engines                 # 绘制引擎
│   ├── events                  # 事件
│   ├── font                    # 字体
│   ├── imgdecode               # 图片管理
│   ├── layout                  # 页面布局
│   ├── themes                  # 主题管理
│   ├── window                  # 窗口管理适配层
│   └── window_manager
│       └── dfb
├── interfaces                  # 接口
│   ├── innerkits               # 模块间接口
│   │   └── xxx                 # 子模块的接口
│   └── kits                    # 对外接口
│       └── xxx                 # 子模块的接口
├── test                        # 测试代码
│   ├── framework
│   │   ├── include             # 测试框架头文件
│   │   └── src                 # 测试框架源码
│   ├── uitest                  # 显示效果测试(可执行程序在foundation/window/window_manager_lite/test:sample_ui)
│   │   └── test_xxx            # 具体UI组件效果测试
│   └── unittest                # 单元测试
│       └── xxx                 # 具体UI组件单元测试
└── tools                       # 测试和模拟器工具（模拟器工程、资源文件）
    └── qt                      # QT工程
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35

约束

平台约束

Windows平台仅支持QT和OHOS IDE。
其他平台支持情况参考vendor/hisilicon/[product_name]/config.json中的graphic标签（不存在graphic标签即该产品不存在图形子系统）。

编译构建

# 通过gn编译，在out目录下对应产品的文件夹中生成图形库
hb build -T //foundation/arkui/ui_lite:ui_lite -f  # 编译libui.so
hb build -T //foundation/window/window_manager_lite/test:sample_ui -f # 编译UI用例
hb build -T //foundation/arkui/ui_lite/test/unittest:arkui_ui_lite_test -f # 编译TDD用例

# 编译qt库可直接参考qt模拟器工程：arkui/ui_lite/tools/qt/simulator/simulator.pro
1
2
3
4
5
6

说明

组件说明

组件分为基础组件和容器组件

基础组件：仅实现组件自身单一功能，比如按钮、文字、图片等；
容器组件：可将其他组件作为自己的子组件，通过组合实现复杂功能。

图 2 图形组件一览

使用说明

foundation/arkui/ui_lite/test/uitest中提供了图形所有组件和功能接口的使用范例。

Windows环境可运行QT工程调试，详见加入指引

工程文件路径：

arkui/ui_lite/tools/qt/simulator/simulator.pro
1

其他调试环境可以编译运行foundation/window/window_manager_lite/test:sample_ui

编译成功后得到可执行程序out/[product_name]/dev_tools/bin/sample_ui，在实际环境上运行即可观察对应组件显示效果。

也为了积极培养鸿蒙生态人才，让大家都能学习到鸿蒙开发最新的技术，针对一些在职人员、0基础小白、应届生/计算机专业、鸿蒙爱好者等人群，整理了一套纯血版鸿蒙（HarmonyOS Next）全栈开发技术的学习路线。大家可以进行参考学习：https://qr21.cn/FV7h05

①全方位，更合理的学习路径：
路线图包括ArkTS基础语法、鸿蒙应用APP开发、鸿蒙能力集APP开发、次开发多端部署开发、物联网开发等九大模块，六大实战项目贯穿始终，由浅入深，层层递进，深入理解鸿蒙开发原理！

②多层次，更多的鸿蒙原生应用：
路线图将包含完全基于鸿蒙内核开发的应用，比如一次开发多端部署、自由流转、元服务、端云一体化等，多方位的学习内容让学生能够高效掌握鸿蒙开发，少走弯路，真正理解并应用鸿蒙的核心技术和理念。

③实战化，更贴合企业需求的技术点：
学习路线图中的每一个技术点都能够紧贴企业需求，经过多次真实实践，每一个知识点、每一个项目，都是码牛课堂鸿蒙研发团队精心打磨和深度解析的成果，注重对学生的细致教学，每一步都确保学生能够真正理解和掌握。

为了能让大家更好的学习鸿蒙（HarmonyOS NEXT）开发技术，这边特意整理了《鸿蒙开发学习手册》（共计890页），希望对大家有所帮助：https://qr21.cn/FV7h05