C++ 轻量级界面库DuiLib库简介（一）—XML基础配置

前不久换了一份工作，客户端界面是用DuiLib库来写的，当时就懵逼了。以前也就只用过MFC、QT等一些常规的库。经过尝试学习后，发现DuiLib库的使用很方便，全靠xml文件里面的条目就能做出美观的界面，而且发布包依赖的环境还少，是一个轻量级的UI库。DuiLib是一个基于Win32的UI库，并没有像MFC一样提供很多封装的类，它仅仅只包含了UI部分，其他的还需要Win32或者MFC的相关知识。

下面就来为你介绍DuiLib的使用，走你。

一、XML 文件编写配置

新建一个XML文件，test.xml，保存为UTF-8格式。内容如下：

<?xml version="1.0" encoding="utf-8"?>
<Window size="425,160" caption="0,0,0,50">
  <Font name="微软雅黑" size="12" bold="false" italic="false" default="true" />
  <Font name="微软雅黑" size="10" bold="false" italic="false" default="false" />
  <VerticalLayout  inset="1,1,1,1" bordersize="1" bordercolor="#FFb3b3b3" bkcolor="#ffffffff"  width="425" height="356" >
    <HorizontalLayout name="caption" inset="2,2,2,2" height="30" bkcolor="#ff118bd9">
      <VerticalLayout height="50">
        <Label name="theme_title" text="{b}新建{/b}" textpadding="5,-5,0,0" textcolor="#ffffffff" width="278" height="30"  font="3" showhtml="true" 

<span style="white-space:pre">	</span>endellipsis="true" />
      </VerticalLayout>
      <VerticalLayout />
      <VerticalLayout width="38" height="29">
        <Button name="btnClose" width="38" height="29" normalimage="Btn_Close.png" hotimage="Btn_Close.png" pushedimage="Btn_Close.png" />
      </VerticalLayout>
    </HorizontalLayout>
    <VerticalLayout inset="5,5,5,5" name="content">
      <HorizontalLayout height="10" />
      <HorizontalLayout height="50" >
        <Label text="项目名称：" width="60" height="30" textcolor="#FF000000" disabledtextcolor="#FFA7A6AA" />
        <Edit name="editTheme" inset="1,1,1,1" bordersize="1" bordercolor="#FFb3b3b3" width="350" height="30" bkcolor="#FFFFFFFF" textpadding="4,3,4,3" 

<span style="white-space:pre">	</span>textcolor="#FF000000" disabledtextcolor="#FFA7A6AA" />
      </HorizontalLayout>
      <HorizontalLayout inset="60,0,0,0" height="50" >
        <Button name="btnTest" width="56" height="30" normalimage="Btn_Sure.png"/>
        <Button name="btnTest2" padding="170,0,0" width="56" height="30" normalimage="Btn_Cancel.png"/>
      </HorizontalLayout>
    </VerticalLayout>
  </VerticalLayout>
</Window>

xml文件创建完成，关键节点的意思请查看后附文档（属性列表.xml），其实有Qt经验的人员应该比较容易看到这个xml的内容。下面说几点需要注意的地方：

1、一定要是保存为UTF-8格式的；

2、window节点不能少；

3、name节点的值需要做到整个xml文件唯一。这个值是与代码交互的关键，用于代码中标识这一个控件具体对象。

4、可以使用HorizontalLayout或者VerticalLayout来进行布局时占位。