DirectUI

传统的Windows界面开发需要在一个主窗口(Window)上放置各种控件(Control),这些控件也是一个个小窗口,可以响应相应的消息。一般情况下,如果你想做出Windows标准风格的界面,用这种方法就可以。但是问题就在于,人们喜欢做出越来越炫的界面,越来越与众不同,越来越新颖的界面,例如Office几乎每两个版本的界面风格就会有一次大变化。

要做出很炫的界面,传统的方法就是利用窗口的自绘(Owner Draw)特性。当你将一个窗口声明为Owner Draw的时候,你就可以让Windows系统在重绘这个窗口的时候调用你自己的窗口绘制代码,而不是缺省的绘制代码。具体做法就是写一个绘制函数,在对应的WM_PAINT消息的事件响应函数中调用它,然后每当这个窗口上有任何消息(如鼠标移进,鼠标移出,按下鼠标,释放鼠标,移动鼠标,输入文字等)可能影响到窗口样子的时候,就用Invalidate函数通知窗口重绘,以调用你自己的重回函数。

从上面的描述中就可以看出来,这个过程非常繁琐。尤其很多控件/窗口都有多个状态,例如按钮就至少有普通,鼠标移进,按下,获得焦点等四种状态,复杂一点的控件,如树状视图和列表控件,自己绘制就更加麻烦了。

光这些还不够,别忘了,Windows都是支持多主题的。一般来说,自绘界面在缺省主题下可能表现得很炫,但是换了另一种主题就完全和环境格格不入了,看起来异常刺眼。

针对以上问题,人们想出了DirectUI这种方法。它的基本思路是用一个文件(现在通常是XML文件)专门描述整个窗口的界面布局,然后通过画图函数来绘制整个窗口,主窗口里面再没有任何子窗口,所有的控件,例如按钮,编辑框等等,都是自己通过贴图和GDI画图函数画出来。

例如,下面就是某DirectUI框架库的一个界面布局XML的例子:

可以看到布局文件将界面描述的很清楚,包括设定了很多控件,例如text,link,imgbtn,等等,每个控件的属性,例如title,width,height,id,class等也都有,还可以设定贴图等,实际上非常类似于一个HTML文件,只不过里面没有那么丰富的控件,动态代码和CSS而已。在程序里,代码可以通过id与每个控件通讯,获取或者设置它的状态,从而可以达到很炫的效果。

实际上,现在很多软件,例如QQ,例如360,例如迅雷等都是使用DirectUI技术绘制的界面,只不过每家用的框架都是自己开发的DirectUI框架罢了。

现在国内有两家比较出名的开源DirectUI框架,分别是金山的BkWin(Bk是贝壳的简称,原来也是一个杀木马的软件),以及迅雷的Bolt。上面的示例代码就是BkWin的界面布局文件格式。

BkWin开源较早,文档和例子较多,但是我们需要将它的代码从整个金山的代码库里面分离出来才行。主要是src/publish/目录下的bkwin,bkres,wtlhelper,以及tinyxml目录。BkWin是基于WTL开发的,因此还需要安装WTL才能编译。它的程序逻辑都在VC的代码里。

Bolt是最近刚刚放出的,与金山开源了整个软件不一样,它是一个专门的界面库。它使用的界面布局文件也是XML文件,但是还需要Lua代码与界面进行沟通与交互。实际上,这有点像现在的HTML代码编写。Bolt里的XML对应HTML,而Lua就相当于javascript。当然,Lua语言本身是很弱的,还需要和VC的代码交互才能拥有真正的功能,例如迅雷的多线程下载等。

其实,使用XML编写界面很早以前在火狐里就有了。例如你打开火狐,在地址栏输入chrome://browser/content/browser.xul,你就可以看到火狐自己的界面。实际上,火狐自己的界面都是使用XUL + javascript构建起来的,XUL就是基于XML的界面语言。在底层,火狐通过XPCOM(类似微软的COM技术,也使用IDL作为接口语言,但是是跨平台的,即所谓的Xross Platform)。

此外,Glade也使用了XML作为界面描述语言,微软的XAML也是这方面的努力。

要制作炫丽的界面,DirectUI只是一个选择。实际上,我们可以使用多种技术达到这个目的。例如:

  • HTA。简单来说,HTA就是本地化的HTML,直接把一个普通的HTML文件保存成HTA后缀的文件就得到了一个HTA。但是HTA里面可以访问任何WSH Script Runtime,以及WMI,以及COM自动化组件。更多的可以参考Javascript in WSH。当然,HTA不适合编写复杂的程序,不适合编写高性能程序,也不适合编写源代码保密的程序。
  • Flash Air。在RIA里,Flash Air是异常强大的家伙。你可以使用Air写代码,然后发布成可执行程序,iPhone App,Android App,网页形式,而且效果可以做得非常炫丽,功能也可以做得相当强大。
  • HTML5。这个HTML新版本已经完全超越了HTML之前的版本,几乎无所不能。音频,视频,绘图,数据库,实时通讯…HTML 5 + CSS + javascript可以实现非常丰富的效果。当然,缺点是,它仍然是Web页面,无法访问所有本地资源。

回过头再来说DirectUI,现在看来,DirectUI最大的问题有下面几个:

  • 因为它们大部分使用XML作为界面语言,而又需要精细的布局(至少要精确到像素),因此它们都需要一个强大的可视化编辑界面,方便设计师来快速搭建界面,并交付给开发人员。现在的BkWin和Bolt都没有可视化界面构建工具,因此设计师做好了设计之后,还需要手工转换成XML,每次修改一点点也需要如此操作,非常的麻烦。相对来说,微软的XAML就有非常好的工具
  • 需要有丰富的界面控件库,不然大部分界面都需要开发人员通过程序手绘,那是非常痛苦的,开发周期也会不必要的长
  • 界面与代码之间的骨架代码一般来说仍然需要耗费不少时间来搭建,如果框架更完善,规则和工具更多,也可以大大减少这些痛苦

如果能有效地解决上述问题,DirectUI一定会发展得更快,使用的人也会大大增加的。

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。