Duilib的界面设计工具DuiDesigner的使用说明

Duilib的界面设计工具DuiDesigner的使用说明

flyfish

可执行文件包括工具的源码下载地址

已在vs2013下编译通过

三个视图（项目视图，控件视图，资源视图）

工作区 工具箱 属性

以制作标题栏为例

从左到右的元素包括 logo图片，软件名称，帮助按钮，论坛按钮，菜单设置按钮，最小化按钮，还原与最大化按钮，关闭按钮

添加控件方法

VerticalLayoutUI开始

点击工具箱里的VerticalLayout 控件，再点击界面，即可加上控件，暂时不支持拖拽

退出测试窗体方法

按Esc键

控件设置属性特别的地方

Width=0，表示自动拉伸

一个标题栏分为两部分 两个HorizontalLayout

一个HorizontalLayout包括logo图片，软件名称

另一个HorizontalLayout 包括帮助按钮，论坛按钮，菜单设置按钮，最小化按钮，还原与最大化按钮，关闭按钮

logo图片是Container控件

软件名称是Text控件

其他的全是Button控件

可以设置HorizontalLayout BkColor的背景色 渐变色

closebtn

代码 响应消息判断的是控件的名字

void DuiLib_Dialog::Notify(TNotifyUI& msg)

{

if( msg.sType == _T(“click”) )

{

if( msg.pSender->GetName() == _T(“closebtn”) )

{

ShowWindow(false);

}

}

}

XML文件

<HorizontalLayout>
<Container width="22" height="22" bkimage="file='icon.png' source='0,0,16,16' dest='5,4,21,20' " />
<Text text="软件名称" pos="22, 5, 200, 24" float="true" textcolor="#FF447AA1" font="0" />
</HorizontalLayout>
<HorizontalLayout width="188" inset="0,1,0,0">
<Button text="{u}{a}帮助{/a}{/u}" showhtml="true"/>
<Button name="closebtn" maxwidth="45" maxheight="17" normalimage="file='sys_dlg_close.png' source='90,0,135,17'" hotimage="file='sys_dlg_close.png' source='45,0,90,17'" pushedimage="file='sys_dlg_close.png' source='0,0,45,17'"/>
</HorizontalLayout>

一个标题栏的树形结构



关于控件各种属性查看源码自带的

属性列表.xml