Duilib学习笔记《01》— duilib整体框架认识

简介:

 从GoogleCode上下载的duilib工程中附带的一副总体设计图(如下所示),可以先整体了解一下,有个初步的认识,对后续进一步深入了解学习会很有帮助。

duilib

通过设计图有了一个初步认识后,接下来开始进一步深入学习了解,主要从以下几个方面进行了解学习:
库的组成;框架基本流程;元素创建机制;消息处理机制。


1. 库的基本组成

1.1 工具库

由于duilib没有对外部的任何库进行依赖,所以在其内部实现了很多用于支撑项目的基础类(如下图所示)。这些类分布在Util文件夹中:
duilib-baseclass
  • UI相关:CPoint / CSize / CDuiRect
  • 简单容器:CStdPtrArray / CStdValArray / CStdString / CStdStringPtrMap

上面这些类看名字就基本能够理解其具体的含义了,当然除了基本的基础库,还有一些和窗口使用相关的工具的封装,如窗口工具:WindowImplBase,这个工具我们在这里不详述,后面使用中会经常用到。

1.2 控件库

duilib-common-control

控件库在duilib的实现中被分为了两块:Core和Control:

  • Core中包含的是所有控件公用的部分,里面主要是一些基类和绘制的封装。
  • Control中包含的就是各个不同的控件的行为了。

这当中尤其要注意控件基类CControlUI和容器基类CContainerUI,这是duilib核心类(如下图所示)中是很重要的两部分:

duilib-heart-class

1.2.1. 控件基类:CControlUI

        CControlUI在整个控件体系中非常重要,它是所有控件的基类,也是组成控件树的基本元素,控件树中所有的节点都是一个CControlUI。
        它基本包括了所有控件公共的属性,如:位置,大小,颜色,是否有焦点,是否被启用等等。当然这个类中还提供了非常多的基础函数,用于重载来实现子控件,如获取控件名称和ClassName,是否显示等等。
        另外为了方便从XML中直接解析出控件的各个属性,这个类中还在提供了一个SetAttribute的方法,传入字符串的属性名称和值对特定的属性进行设置,内部其实就是挨个比较字符串去完成的,所以平时使用的时候就还是不要使用的比较好了,因为每个属性实际上都有特定的方法来获取和设置。
        另外每个控件中还有几个事件管理的对象——CEventSource,这些对象会在特定的时机被触发,如OnInit,调用其中保存的各个回调函数。

1.2.2. 容器基类:CContainerUI

        有了基本的控件基类之后,我们就需要容器来将他管理起来,这个容器就是CContainerUI,其内部用一个数组来保存所有的CControlUI的对象,后续的所有工作,就都是基于这个对象来进行的了。
这样在CContainerUI里面,主要实现了一下几个功能:

  • 子控件的查找:CContainerUI::FindControl
  • 子控件的生命周期管理:是否销毁(在Remove的时候自动销毁) / 是否延迟销毁(交给CPaintMangerUI去一起销毁)。
  • 滚动条:所有的容器都支持滚动条,在其内部会对键盘和鼠标滚轮事件进行处理(CContainerUI::DoEvent),对其内部所有的元素调整位置,最后在绘制的时候实现滚动的效果
  • 绘制:由于容器中有很多元素,所以为了加快容器的绘制,绘制的时候会获取其真正需要绘制的区域,如果子控件不在此区域中,那么就不予绘制了

而对于这些控件的绘制实现以及相关使用,在后续具体进一步学习中再深入详解。


2. 框架基本流程

框架的基本流程实际上类似Win32创建窗口流程,如果对于Win32比较熟悉,这部分可以很快掌握。

1 int APIENTRY WinMain(HINSTANCE hInstance, HINSTANCE hPrevInstance, LPSTR lpCmdLine, int nCmdShow)
2 {
3     CPaintManagerUI::SetInstance(hInstance);        // 第一步: 实例句柄与渲染类关联
4     CPaintManagerUI::SetResourcePath(CPaintManagerUI::GetInstancePath() + _T("skin"));
5  
6     HRESULT Hr = ::CoInitialize(NULL);              // 第二步:初始化COM库, 为加载COM库提供支持
7     if( FAILED(Hr) ) return 0;
8  
9     CMainFrameWnd* pFrame = new CMainFrameWnd();    // 第三步:创建窗口类
10     if( pFrame == NULL ) return 0;
11  
12     pFrame->Create(NULL, _T("主程序"), UI_WNDSTYLE_FRAME, 0L, 0, 0, 800, 600); // 第四步:注册窗口类与创建窗口
13     //  实际上这里调用Create操作和Win32创建窗体一样,内部实际上做了以下操作:
14     //  -> RegisterSuperclass (注册一个超类 即已有一个窗口类的基上再注册一个窗口类)
15     //  -> RegisterWindowClass (注册窗口类)
16     //  -> ::CreateWindowEx (创建窗口,此时触发 WM_CREATE 消息)
17     //  -> HandleMessage  ( WM_CREATE消息处理OnCreate)
18  
19     pFrame->CenterWindow();          // 第五步:窗口居中显示
20     ::ShowWindow(*pFrame, SW_SHOW);
21  
22     CPaintManagerUI::MessageLoop(); // 第六步:处理消息循环
23  
24     ::CoUninitialize();             // 第七部:退出程序并释放COM库
25     return 0;
26 }

3.元素创建机制

第一步:响应WM_CREATE消息;

第二步:主窗口类与窗口句柄关联;

   m_pm.Init(m_hWnd)

第三步:加载XML并动态创建界面无素,与布局界面元素            

CDialogBuilder builder;</span>
CDialogBuilderCallbackEx cb;</span>
CControlUI* pRoot =builder.Create(_T("skin.xml"), (UINT)0,  &amp;cb, &amp;m_pm);

第四步:附加控件到HASH表      

PaintManagerUI::AttachDialog
InitControls
FindControl
__FindControlFromNameHash
pManager-&gt;m_mNameHash.Insert

第五步:添加通知处理

1 CPaintManagerUI::AddNotifier

第六步:窗口的绘制(以上是窗口的创建过程,通过xml,所有控件都被加载到CPaintManagerUI)

            CPaintManagerUI响应WM_PAINT消息,开始双缓存绘图

                     m_pRoot->DoPaint绘背景图 

                 CControlUI::DoPaint

                 CRenderEngine 真正的绘图类

             pPostPaintControl->DoPostPaint 在背景图上绘制控件

            ::BitBlt 把离屏视图画到主屏上


4.消息处理机制

 第一步:注册消息处理函数

在CWindowWnd注册窗口(RegisterWindowClass())里,注册消息回调函数(__WndProc);

第二步:消息分发

        消息回调函数(处理所有系统发送的消息),然后回调函数通过子类的CMainFrameWnd::HandleMessage对消息进行分发。

       非窗口消息通过CMainFrameWnd::HandleMessage调用CPaintManagerUI::MessageHandler进行分发。

第三步:消息循环

      在CPaintManagerUI类的MessageLoop处理消息循环; 

      接收到消息以后,进入消息回调函数(__WndProc);

(注:以下内容以鼠标单机Button事件为例)

第四步:处理控件消息

        鼠标按下时(WM_LBUTTONDOWN),查找鼠标点击的控件。

        处理控件的鼠标按下消息:通过调用基类CControlUI:: DoEvent,引起子类如CButtonUI::DoEvent事件。

       子类的DoEvent对不同类型的事件进行处理。通过CPaintManagerUI:: SendNotify回调控件注册的事件。

目录
相关文章
|
3月前
|
前端开发 Java UED
JSF 面向组件开发究竟藏着何种奥秘?带你探寻可复用 UI 组件设计的神秘之路
【8月更文挑战第31天】在现代软件开发中,高效与可维护性至关重要。JavaServer Faces(JSF)框架通过其面向组件的开发模式,提供了构建复杂用户界面的强大工具,特别适用于设计可复用的 UI 组件。通过合理设计组件的功能与外观,可以显著提高开发效率并降低维护成本。本文以一个具体的 `MessageComponent` 示例展示了如何创建可复用的 JSF 组件,并介绍了如何在 JSF 页面中使用这些组件。结合其他技术如 PrimeFaces 和 Bootstrap,可以进一步丰富组件库,提升用户体验。
56 0
|
3月前
|
容器 C# 开发者
XAML语言大揭秘:WPF标记的魅力所在,让你轻松实现界面与逻辑分离,告别复杂代码!
【8月更文挑战第31天】XAML提供了一种直观且易于维护的界面设计方式,使得开发者可以专注于逻辑和业务代码的编写,而无需关心界面细节。通过数据绑定、布局管理和动画效果等特性,XAML可以实现丰富的界面交互和视觉效果。在实际开发过程中,开发者应根据具体需求选择合适的技术方案,以确保应用程序能够满足用户的需求。希望本文的内容能够帮助您在WPF应用程序开发中更好地利用XAML语言。
44 0
|
3月前
|
C# 开发者 设计模式
WPF开发者必读:命令模式应用秘籍,轻松简化UI与业务逻辑交互,让你的代码更上一层楼!
【8月更文挑战第31天】在WPF应用开发中,命令模式是简化UI与业务逻辑交互的关键技术,通过将请求封装为对象,实现UI操作与业务逻辑分离,便于代码维护与扩展。本文介绍命令模式的概念及实现方法,包括使用`ICommand`接口、`RelayCommand`类及自定义命令等方式,并提供示例代码展示如何在项目中应用命令模式。
53 0
|
4月前
|
JavaScript
小而美的IKUN-UI组件库源码学习(前言)
小而美的IKUN-UI组件库源码学习(前言)
124 0
小而美的IKUN-UI组件库源码学习(前言)
|
C#
2000条你应知的WPF小姿势 基础篇<57-62 依赖属性进阶>
2000条你应知的WPF小姿势 基础篇<57-62 依赖属性进阶>
47 0
|
前端开发 定位技术 容器
webgis前端控件编程
webgis前端控件编程
89 0
|
前端开发
前端学习笔记202305学习笔记第二十三天-重构菜单组件2
前端学习笔记202305学习笔记第二十三天-重构菜单组件2
52 1
|
前端开发
前端学习笔记202305学习笔记第二十三天-重构菜单组件3
前端学习笔记202305学习笔记第二十三天-重构菜单组件3
54 0
|
运维 前端开发 Python
brython | 笨办法写个连连看-1.核心功能实现
brython | 笨办法写个连连看-1.核心功能实现
127 1
|
前端开发 JavaScript UED
封装库/工具库中重要概念之动画
前端开发中,动画是一个非常重要的技术特性。它可以提升用户体验,增加页面交互性,并且让网站看起来更加生动活泼。然而,在实现复杂动画时,手写代码往往会变得繁琐且容易出错。因此,前端工具库和封装库的出现为我们提供了便利。在本文中,我们将探讨前端中的封装库和工具库以及它们在实现动画效果方面的作用。
101 0
下一篇
无影云桌面