12DUILib经典教程(实例)(2)

<Font name="幼圆" size="16" default="true" /> <VerticalLayout bkcolor="#FFFF00FF"> <Button name="changeskinbtn" height="20" text="测试按钮" maxwidth="120" /> <RichEdit name="testrichedit" bordercolor="#FF0000" bordersize="0"

inset="4,2,4,2" bkcolor="#A0F2F5FA" bkcolor2="#A0FF0000"

font="1" multiline="true" vscrollbar="true" autovscroll="true" borderround="18,18" bkcolor3="#A0F2F5FA"

enabled="true" rich="true" readonly="false" text="测试richedit"> </RichEdit> <Edit name="testedit" text="测试编辑框" /> </VerticalLayout>

</Window>

把以上xml保存为test1.xml，主要保存格式为utf-8（不要使用windows自带的记事本保存，可以使用ultraedit、editplus之类具备xml编辑能力的编辑器保存）。然后运行程序，可以看到如下效果：

好像还不是太难看，不过按钮好像看起来不大像按钮，；然后将button_nor.bmp、button；可以看到按钮的显示已经改变了，我们继续将Rich；继续修改这个xml，我们通过设置xml中控件的属；3响应事件；Duilib中的事件响应有两种方式：；?在事件处理类（一般使用窗口类）中实现INoti；中处理事件，这种方式比较简单常用；classCLoginFr

好像还不是太难看，不过按钮好像看起来不大像按钮，那就给贴个图把，将一下这 行加入到Window标签下： <Default name="Button" value="normalimage="file=‘button_nor.bmp‘ corner=‘4,2‘ fade=‘200‘ hsl=‘true‘" hotimage="file=‘button_over.bmp‘ corner=‘4,2‘ fade=‘200‘ hsl=‘true‘" pushedimage="file=‘button_down.bmp‘ corner=‘4,2‘ fade=‘200‘ hsl=‘true‘ " " />

然后将button_nor.bmp、button_over.bmp、button_down.bmp（可在Duilib发行包中找到）放到exe目录下，运行程序，可以看到：

可以看到按钮的显示已经改变了，我们继续将Richedit换个背景，将Richedit的背景色改成bkcolor="#FFF2F5FA" bkcolor2="#FFA0A000" bkcolor3="#FFF2F5FA"，我们得到下面的结果：

继续修改这个xml，我们通过设置xml中控件的属性，可以很简单的实现自由调整界面。

3 响应事件

Duilib中的事件响应有两种方式：

? 在事件处理类（一般使用窗口类）中实现INotifyUI接口，然后在Notify函数

中处理事件，这种方式比较简单常用。示例如下：

class CLoginFrameWnd : public CWindowWnd,public INotifyUI

{

public: // ……

void Notify(TNotifyUI& msg)

{

if( msg.sType == _T("click") ) {

if( msg.pSender->GetName() == _T("closebtn") ) { PostQuitMessage(0); return; }

else if( msg.pSender->GetName() == _T("loginBtn") ) { Close(); return; } }

else if( msg.sType == _T("itemselect") ) {

if( msg.pSender->GetName() == _T("accountcombo") ) {

CEditUI* pAccountEdit

static_cast<CEditUI*>(m_pm.FindControl(_T("accountedit"))); =

if( pAccountEdit ) pAccountEdit->SetText(msg.pSender->GetText()); }

}

}

}

? 使用代理机制处理事件

class CLoginFrameWnd : public CWindowWnd,public INotifyUI

{

public:

// …… bool OnAlphaChanged(void* param) {

TNotifyUI* pMsg = (TNotifyUI*)param;

if( pMsg->sType == _T("valuechanged") ) {

m_pm.SetTransparent((static_cast<CSliderUI*>(pMsg->pSender))->GetValue());

} void OnPrepare()

{

CSliderUI* pSilder =

MakeDelegate(this,} return true; static_cast<CSliderUI*>(m_pm.FindControl(_T("alpha_controlor"))); if( pSilder ) pSilder->OnNotify +=

&CFrameWindowWnd::OnAlphaChanged);

}

}

OnPrepare函数需要在控件创建完成之后调用。

4 贴图描述

Duilib的表现力丰富很大程度上得益于贴图描述的简单强大。Duilib的贴图描述分为简单模式和复杂模式两种。

简单模式使用文件名做为贴图描述内容，在这种方式下，此图片将会以拉伸方式铺满控件。

复杂模式使用带属性的字符串表示贴图方式，既支持从文件中加载图片，也可以从资源中加载，具体如下：

? 如果是从文件加载，设置file属性，如file=‘XXX.png‘，不要写res和restype属

性

?

?

?

? 如果从资源加载，设置res和restype属性，不要设置file属性 dest属性的作用是指定图片绘制在控件的一部分上面（绘制目标位置） source属性的作用是指定使用图片的一部分 corner属性是指图片安装scale9方式绘制

?

?

?

? mask属性是给不支持alpha通道的图片格式（如bmp）指定透明色 fade属性是设置图片绘制的透明度 hole属性是指定scale9绘制时要不要绘制中间部分 xtiled属性设置成true就是指定图片在x轴不要拉伸而是平铺，ytiled属性设

置成true就是指定图片在y轴不要拉伸而是平铺：

5 类html文本描述

Duilib使用一种经过简化的类html格式文本来描述复杂的图文格式。使用<>或{}符号来标识语法标签，支持标签嵌套，如<l><b>text</b></l>，但是应该避免交叉嵌套，如<l><b>text</l></b>。

?

?

?

?

?

?

?

?

?

?

?

?

? <b>text</b> 表示text的内容使用粗体 <c #xxxxxx>text</c> 表示text内容使用#xxxxxx颜色，#xxxxxx表示16进制的RGB值 <f x>text</f> 表示text内容使用x序号的字体 <i>text</i> 表示text内容使用斜体 <i x y z> 表示此次插入图片，x表示图片名称，y表示此图片包含几张字图片（可不填，默认值1），z表示当前使用的字图片id（可不填，默认值0） <a x>text</a> 表示text内容有链接功能，x表示链接地址（可不填），用法如app:notepad or http:www.xxx.com，此字符串需要在用户程序中解析处理。 <n> 表示此次换行 <p x>text</p> 表示text内容是一个段落（从这里开始换行），x表示此段落文字水平距离（可不填） <r>text</r> 表示text内容不使用语法标签功能 <s>text</s> 表示text内容被选中（显示选中的背景颜色） <u>text</u> 表示text内容使用下划线 <x i> 表示从此处向后面移动x个像素值 <y i> 表示该行高度固定为y个像素值

使用标签功能需要把控件的showhtml属性设置为true。

6 动态换肤

（编辑：ASP站长网）