用 MFC 写完前几节,你应该已经能跑出一个带窗口、能响应消息的游戏骨架了。但只要动手改过界面就会知道:原生控件那套灰色按钮和系统标题栏,跟"游戏"两个字放在一起很违和。想换成自绘皮肤、异形标题栏、带 hover 状态的按钮,靠 MFC 手写绘制代码量大、复用差。这一节补的就是这块缺口——DuiLib。

先说清楚:这门课解决的是哪个具体问题

DuiLib 是一个基于 DirectUI 思路的 Windows 界面库,核心卖点是把界面外观从 C++ 代码里挪到 XML 里描述,程序只负责逻辑。它解决的是"界面改一处、编译一整轮"的老问题,也解决了 MFC 自绘控件难以统一维护的问题。

但它不是拿来即用的东西:源码需要自己编译、VS 环境要手动配、消息机制跟 MFC 的差异不小。这些坑恰好是自学时最容易卡住的地方,也是这门课大部分篇幅真正花掉的地方。如果你只是听说过 DuiLib,或者照文档配了两小时环境都没跑出第一个窗口,那这一节的针对性就很强。

几个必须自己动手才能过去的知识点

  • 编译源码与配置 VS 环境。DuiLib 不是纯头文件库,不同版本源码在字符集、运行时库上的默认设置不一致,直接拿来编译报错是常态。这部分必须自己走一遍,否则后面读到崩溃都定位不到原因。
  • 消息机制与按钮事件。DuiLib 有自己的通知机制,不是 MFC 那套 ON_BN_CLICKED 直接映射。得先理解控件怎么把事件抛给窗口,才能谈后面接游戏逻辑。
  • XML 描述界面与局部 Layout。整窗一个 XML 会很快失控。局部 Layout 讲的是怎么把界面拆块、什么时候该拆,这直接决定后期改皮肤的成本。
  • 标题栏自绘。这是 DuiLib 最能体现价值的一步:把系统标题栏换成自绘,同时还得处理拖动、最小化、关闭这些交互,是把"好看"和"能用"绑在一起练的典型场景。
  • 与 MFC 结合。如果你已有的游戏逻辑写在 MFC 工程里,这一块决定你要不要推倒重来。

模拟 360 安全卫士界面,练的是什么

这个案例的价值不在"抄一个界面",而在于它同时包含了侧边导航、可切换页面、多种控件状态和高频重绘。做到一半你会发现,真正难的从来不是某一个控件长什么样,而是页面切换时状态怎么保、资源什么时候释放、多个 Layout 之间怎么通信。这些是在写小型工具界面时反复会遇到的问题,只不过平时没人专门讲过。

建议不要一次抄完。先跑通自己能改颜色的程度,再逐步替换成自己的布局,这样才看得出哪些代码是 DuiLib 的固定套路、哪些是自己业务的边界。

看完应该能回答的问题

  • DuiLib 的 XML 界面描述和 MFC 的对话框资源,在修改成本上差别体现在哪?
  • 一个按钮点击后要触发游戏内的动作,事件是怎么从控件走到你的业务代码的?
  • 为什么自绘标题栏比想象中麻烦?
  • 已有的 MFC 工程接 DuiLib,哪些部分能留、哪些必须改?
  • 界面局部拆 Layout 时,按什么标准判断该拆还是不该拆?

如果这些问题里有三个以上你答不上来,这一节就值得从头到尾动手做一遍。DuiLib 本身不算新东西,但能把环境、消息、布局、自绘这几块连贯走通,对后面自己做带界面的 Windows 工具或小游戏,是实打实省时间的一段。

Windows游戏编程系列之4:DuiLib界面美化及游戏实战

课程详情

课程标题

Windows游戏编程系列之4:DuiLib界面美化及游戏实战

课程核心介绍

本课程系统讲解DuiLib的界面美化知识,包括布局、控件,与MFC的结合,以及模拟360安全卫士的界面。

适合人群

编程爱好者

学习收获

- 系统掌握DuiLib的界面美化知识 - 熟悉布局、控件的使用 - 了解DuiLib与MFC的结合 - 掌握模拟360安全卫士界面设计

课程亮点

  • DuiLib开发环境配置及第一个窗口
  • 编译Duilib源码
  • 配置VS的Duilib开发环境
  • DuiLib的消息机制及按钮事件
  • DuiLib通过XML配置界面
  • DuiLib页面局部Layout
  • DuiLib实现标题栏的绘制
  • DuiLib的控件使用
  • DuiLib与MFC的结合
  • DuiLib模拟360安全卫士

课程目录

01 DuiLib开发环境配置及第一个窗口
  01 DuiLib课程概览与简介.mp4
  02 Dui项目简介.mp4
  03 Dui源码编译.mp4
02 DuiLib开发第一个程序
  01 Dui开发环境配置.mp4
  02 第一个Dui窗口程序.mp4
03 DuiLib的消息机制及按钮事件
  01 Dui程序的消息处理机制.mp4
04 DuiLib通过XML配置界面
  01 Dui程序通过XML绘制窗口.mp4
  02 Dui程序通过XML绘制三个按钮.mp4
  03 WindowImplBsae基类与XML.mp4
05 DuiLib页面局部Layout
  01 Dui的几种布局.mp4
06 DuiLib实现标题栏的绘制
  01 Dui自定义标题栏之按钮美化.mp4
  02 Dui自定义标题栏之完整实现.mp4
  03 Dui自定义标题栏之后台代码.mp4
07 DuiLib的界面设计器DuiDesigner.exe
  01 DuiDesigner界面设计器.mp4
08 DuiLib的控件
  01 Dui控件之文本编辑框.mp4
  02 Dui控件之进度条.mp4
  03 Dui控件之List列表框.mp4
  04 Dui控件之Tab选项卡.mp4
  05 亲自动手制作Tab选项卡.mp4
09 DuiLib与MFC的结合
  01 Dui与MFC的结合应用.mp4
10 DuiLib模拟360安全卫士
  01 Dui模拟360卫士界面的项目工程移植.mp4
  02 Dui模拟360卫士界面的xml标签分析.mp4
  03 Dui模拟360卫士界面的后台CPP代码.mp4
  04 动手创建360卫士界面的标题栏及状态栏.mp4
  05 动手创建360卫士界面的选项卡核心区.mp4