mirror of
https://gitee.com/idea4good/GuiLite.git
synced 2025-04-05 17:37:55 +08:00
update doc
This commit is contained in:
idea4good
parent
2f19d609ae
commit
e0e92c2a2f
@ -72,7 +72,7 @@ GuiLite只是一个框架，本身并不能生成UI。为了能够展示如何
|
||||
|
||||
## 开发文档
|
||||
- [如何编译?](doc/HowToBuild.md)
|
||||
- [设计原理](doc/CodeWalkthrough-cn.md)
|
||||
- [设计原理](doc/HowToWork-cn.md)
|
||||
- [如何布局UI?](doc/HowLayoutWork.md)
|
||||
- [如何制作多种文字/位图资源?](https://github.com/idea4good/GuiLiteToolkit)
|
||||
- [如何“换肤”？](https://gitee.com/idea4good/GuiLiteSamples/blob/master/HostMonitor/UIcode/source/resource/resource.cpp)
|
||||
|
||||
@ -1,13 +1,33 @@
|
||||
# 代码结构及注释
|
||||
gui: 1）实现了各种常规控件（例如：按钮，标签，键盘）及容器（例如：视窗，对话框，滑动页面），开发者可以根据自己的需要，直接在相应的代码上进行修改或重绘，开发出有自己风格，特色的界面；2）实现了用户输入（例如：手指按下/释放）的消息传递，将用户的输入信息传递到整个UI体系树中，并调用相应的响应回调函数；开发者可以根据自己的需要添加/修改响应回调函数。
|
||||
|
||||
core: 实现了各个平台（例如：Windows, Linux）的封装，这些封装包括了基本的操作系统接口，底层绘制，图层管理和消息传递。由于开发者面对的应用场景有所不同，所需的操作系统接口也有区别，core中只提供了最基础的接口形式，开发者可以根据自己的需要，直接在api.h/api.cpp中添加新的操作系统接口或**单片机接口**。
|
||||
|
||||
最后，代码的更新/发布，不会作具体通知，请开发者随时更新代码库。
|
||||
|
||||
# 设计原理及代码注释
|
||||
## GuiLite的基本原理
|
||||
GuiLite只作两个工作：界面元素管理和图形绘制。
|
||||
|
||||
界面管理包括：
|
||||
- 添加/删除界面元素（例如：按钮，标签，对话框等控件），设置对应的文字及位置信息
|
||||
- 用户输入消息传递：根据用户输入寻找受影响的界面元素，并回调响应的处理的处理函数
|
||||
- 用户自定义消息传递：用户可以自定义消息响应函数，并自主产生消息；当消息产生时，对应的响应函数会被调用
|
||||
|
||||
图形绘制包括：
|
||||
- 基本的点线绘制，例如：画点，矩形，横线，竖线等
|
||||
- 设置绘制图层，如果需要多个图层，在基本点线绘制时，需要给出图层的索引值
|
||||
- 图层处理，在图层界面发生变化的时候，将其正确的组合，并输出到最终显示终端上
|
||||
|
||||
## GuiLited的扩展方法
|
||||
GuiLite只给出了基本控件（例如：按钮，标签，键盘，选择框）的实现方法，旨在说明控件的实现方法。对于扩展控件，可以选择下面的方式：
|
||||
- 如果开发者需要调整基本控件的细节，可以直接在源代码中修改
|
||||
- 如果开发者需要构建全新的控件，可以参考基本控件的实现方法，重新实现
|
||||
|
||||
对于扩展绘制，例如：画圆，画曲线，可以直接在surface.cpp文件中添加响应的函数接口。
|
||||
|
||||
## 代码介绍
|
||||
core:
|
||||
- 实现了底层绘制，图层管理和消息传递
|
||||
- adapter实现了各个平台（例如：Windows, Linux，Android，iOS，macOS,未知OS或无OS）的封装。
|
||||
|
||||
widgets:
|
||||
- 实现了各种常规控件（例如：按钮，标签，键盘，波形）及容器（例如：视窗，对话框，滑动页面），开发者可以根据自己的需要，直接在相应的代码上进行修改或重绘，开发出有自己风格，特色的界面
|
||||
- 实现了用户的手势识别（例如：手指滑动，鼠标按下/释放）的消息传递，将用户的输入信息传递到整个GUI体系树中，并调用相应的响应回调函数；开发者可以根据自己的需要添加/修改响应回调函数。
|
||||
|
||||
## 界面元素管理
|
||||
界面元素管理包括：对所有控件（button，spinbox, lable, keyboard），容器（dialog, view）管理；具体的管理方法是为所有的界面元素建造一棵树，利用这棵树实现对所有界面元素的遍历，查询，状态更改。
|
||||
|
||||
@ -16,7 +36,7 @@ GuiLite只作两个工作：界面元素管理和图形绘制。
|
||||
### 界面元素如何创建
|
||||
所有界面元素都继承自c_wnd类的对象，对象被实例化时，也就完成了界面元素的创建；但此时的界面元素是孤独的，与其他界面元素没有形成联系（没有父母，没有兄弟姐妹）
|
||||
|
||||
### 界面元素如何被管理（纳入tree中）
|
||||
### 界面元素如何被管理
|
||||
新创建的界面元素纳入管理的过程，就是为其添加父母，兄弟姐妹的过程。使用的函数接口为connect();从此该界面元素会跟其他界面元素一样，纳入一棵树中，并随之响应用户可能的点击操作。
|
||||
|
||||
当需要删掉该界面元素时，使用disconnect()；从此该界面元素会断绝所有的父子关系，从树上摘下来，不再响应用户的触控操作；但对象本身不会被销毁。典型应用场景：软键盘的创建/退出。
|
||||
@ -27,6 +47,7 @@ GuiLite只作两个工作：界面元素管理和图形绘制。
|
||||
### 绘制方法
|
||||
请参看文件bitmap.cpp和surface.cpp中的draw_xxx()函数。
|
||||
为了发挥GPU的加速功能，也可以通过改写draw_xxx/fill_xxx函数，使用GPU特性，来提升绘制效率。
|
||||
|
||||
### 图层管理
|
||||
GuiLite的所有图层，如下图所示：
|
||||
|
||||
@ -41,38 +62,37 @@ frame层:
|
||||
该层属于surface层的一个部分；它现实叠加界面元素而存在。
|
||||
|
||||
### 文件注释
|
||||
| core 文件名称 | 代码简介 |
|
||||
| core 重要程度/文件名称 | 代码简介 |
|
||||
| --- | --- |
|
||||
| ★★★ wnd.cpp | UI元素的基本类，定义所有的UI元素信息、绘制及管理办法 |
|
||||
| ★★ cmd_target.cpp | 映射UI消息及用户自定义的消息 |
|
||||
| ★★ display.cpp | 生成显示设备，设定surface的数目，一个surface对应一个滑动页面 |
|
||||
| ★★ surface.cpp| 实现像素点的绘制，并对各个图层（layer）进行管理 |
|
||||
| bitmap.cpp | 绘制位图，支持16 bits和32 bits |
|
||||
| cmd_target.cpp | 映射UI消息及用户自定义的消息 |
|
||||
| display.cpp | 生成显示设备，设定surface的数目，一个surface对应一个滑动页面 |
|
||||
| rect.cpp | UI元素的位置信息 |
|
||||
| surface.cpp | 实现像素点的绘制，并对各个图层（layer）进行管理 |
|
||||
| wave_buffer.cpp | 波形数据的缓冲管理 |
|
||||
| wave_ctrl.cpp | 实现波形控件 |
|
||||
| wnd.cpp | UI元素的基本类，定义所有的UI元素信息、绘制及管理办法 |
|
||||
| word.cpp | 显示文字 |
|
||||
| api_linux.cpp | Linux适配层 |
|
||||
| api_win.cpp | Window适配层 |
|
||||
| api_unknow.cpp | 无OS或其他OS适配层 |
|
||||
| audio_linux.cpp | Linux audio适配层 |
|
||||
| audio_win.cpp | Windows audio适配层 |
|
||||
| msg_linux.cpp | Dispatch消息的Linux实现 |
|
||||
| msg_win.cpp | Dispatch消息的Windows实现 |
|
||||
|
||||
|
||||
| gui 文件名称 | 代码简介 |
|
||||
| msg_unknow.cpp | Dispatch消息在无OS或其他OS下的实现 |
|
||||
***
|
||||
| widgets 难度/文件名称 | 代码简介 |
|
||||
| --- | --- |
|
||||
| label.cpp | 标签控件的绘制 |
|
||||
| button.cpp | 按钮控件的绘制及用户点击响应函数 |
|
||||
| table.cpp | Table控件的绘制 |
|
||||
| dialog.cpp | 对话框的绘制及管理方法 |
|
||||
| edit.cpp | Edit控件的绘制及用户点击响应函数 |
|
||||
| gesture.cpp | 手势识别方法，包括：鼠标按下，弹起及滑动 |
|
||||
| keyboard.cpp | 键盘控件的绘制及用户点击响应函数 |
|
||||
| label.cpp | 标签控件的绘制 |
|
||||
| list_box.cpp | List控件的绘制及用户点击响应函数 |
|
||||
| shape_resource.cpp | 自定义的形状资源，主要用于：支持圆角控件的缩放 |
|
||||
| slide_group.cpp | 滑动页面的显示及管理 |
|
||||
| spinbox.cpp | Spinbox控件的绘制及用户点击响应函数 |
|
||||
| table.cpp | Table控件的绘制 |
|
||||
| ★ gesture.cpp | 手势识别方法，包括：鼠标按下，弹起及滑动 |
|
||||
| ★ keyboard.cpp | 键盘控件的绘制及用户点击响应函数 |
|
||||
| ★★ list_box.cpp | List控件的绘制及用户点击响应函数 |
|
||||
| ★★ spinbox.cpp | Spinbox控件的绘制及用户点击响应函数 |
|
||||
| ★★★ wave_buffer.cpp | 波形数据的缓冲管理 |
|
||||
| ★★★ wave_ctrl.cpp | 实现波形控件 |
|
||||
|
||||
### 函数接口注释
|
||||
| 函数名称 | display.cpp 函数接口注释 |
|
||||
Loading…
Reference in New Issue
Block a user