HTMLayout界面技术研究

tttk 2011-03-23 11:57:47
为软件设计一个漂亮的界面,是每一个软件开发者的梦想和目标。诚然,越来越“智能化”的快速开发工具(RAD),在给予开发者快捷高效的开发效率的同时,也剥夺了越来越多开发者在软件界面上的创造性。

•如果你是一个VC/VB/Delphi等桌面工具的开发人员,对传统开发工具的界面设计充满乏味;
•如果你希望自己的软件界面充满个性,不再受锢于Windows界面的制约;
•如果你有一点HTML/CSS的基础和一些界面设计的灵感
•如果你喜欢钻研,为了新技术而乐于交流
•如果你想了解或深入HTMLayout,欢迎阅读本文章。
•加入HTMLayout的研究群:145775715

什么是HTMLayout

HTMLayout是一个免费的开源界面库(核心未开源),以DLL的方式运行,并提供一个API的调用接口和一系列的C++封装和sample例程。HTMLayout相当于一个轻量级浏览器引擎,可以高效的解析和渲染HTML网页。其几乎支持所有的HTML元素和CSS3标准,并根据界面库的特征,做了很多有用的功能性扩展,简要列举如下:

1.强大的CSS+扩展,支持九宫格的图片扩展和拉伸模式,增强了容器的前景和背景图片填充能力,支持PNG图片透明和动画;
2.支持多样化功能强大的布局模式,有效了解决了标准HTML中流模式布局的不足;
3.功能完善的事件传播机制和定时机制,通过behavior行为在应用中通过c++类和网页元素进行交互,制作网页效果易如反掌;
4.功能齐全的字符串处理和及c++类,并提供了功能完善的JSON字符串和类Variant的VALUE值类型,有效的解决多字符/UNICODE/UTF8/BYTE等字符串之间的转换和操作。
5.强大的图像处理API,可以在任何的HTML元素之上绘图。
6.支持自定义控件,例如Flash、Chart等第三方ActiveX元素的绘制,方便了界面库的扩展;
7.运行速度飞快,占用内存低,性能高效。
8.和DirectUI一样,控件以无窗口模式运行,所有的控件都是绘制在界面上;

HTMLayout的应用

目前,基于HTMLayout的应用在全世界已经有成千上万个。在HTMLayout的官方网站上,列举了一些比较知名的企业:http://www.terrainformatica.com/customers.whtm

•Symantec Corporation
•Hewlett-Packard Corporation
•Motorola company
•Real Networks, Inc. •Alawar Entertainment, Inc. •EverNote Corporation •Munnin •Gaijin Entertainment •ALWIL Software, home of the AVAST! •Maxthon •BitDefender •SpamFighter

国内的应用,例如傲游浏览器3.0,其界面基于HTMLayout设计。由于HTMLayout中文文档缺乏,且早些年处于商业收费状态,在国内的应用并不广泛,甚至很少有人谈论。作为这个技术的受益者,本人建立一个推广群,希望能带动这个技术的发展。群:145775715 欢迎加入!



同传统的IE浏览器对比

作为对比,IE浏览器也可以通过ActiveX嵌入到对话框中的方式进行基于Web的开发,但IE浏览器作为一个界面引擎有以下不足:

1.IE浏览器对HTML标准和CSS支持不足,不同版本的支持经常有很大差异。导致在不同的客户端上部署经常出现问题;
2.IE基于COM模型集成,应用程序的代码与IE之间通讯困难,往往需要大量的COM接口类进行辅助,而且字符串形式单一,很多交互通过JS代码方式进行,性能低下;
3.图片透明和扩展不灵活,不能支持复杂的背景和前景图片;
4.流模式的布局在支持复杂的网页布局方面力不从心。
5.加载速度慢,内存占用高。

同传统的贴图方式比较

传统的贴图界面具有较强的用户群体,主要是通过把界面分隔成小块的图片,在界面更新时绘制到界面的对应位置。这种方式完全模拟了Windows界面处理的逻辑,在性能上具有较大优势。但缺点依然很显著:

1.界面的切割相当麻烦,用户需要精确的知道切割的坐标和大小,稍有不慎便面目全非;
2.仅支持界面的换肤,功能单一,对界面元素和系统之间的交互性没有任何支持;
3.缺乏一个统一的标准来统一,各种API的使用方式大相径庭,各显神通

同DirectUI的对比

受到MSN Messager界面技术的影响,DirectUI近几年有渐热的趋势,很多技术人员开始研究DirectUI的原理。DirectUI的原理其实很简单,也是通过图片绘制的方式把界面和控件绘制在一个平面空间上,摆脱了传统windows中父子控件层层嵌套的事件传播机制,并提供基于脚本的界面交互机制,在性能方面具有较大优势。缺点如下:

1.目前缺乏统一的技术规范和文档支持,很多商业库实行技术封锁,卖价高昂,让普通开发者望尘莫及;
2.开源库功能简单,缺乏有效的文档和界面设计器支持,开发效率低下;
3.缺乏如HTML中DOM元素一样的灵活的层次关系,系统和界面交互较为复杂;
4.具有较高的学习曲线。
...全文
9650 30 打赏 收藏 转发到动态 举报
写回复
用AI写文章
30 条回复
切换为时间正序
请发表友善的回复…
发表回复
c10682 2013-04-16
  • 打赏
  • 举报
回复
HTMLayout 仿QQ2013 登录界面: 源码下载




Wildwolf 2013-04-10
  • 打赏
  • 举报
回复
随着软件上的功能越来越成熟了,在UI上可以放更多的时间。近段时间一直想找一种适用的界面技术。HTMLayout似乎不错。
weiys9532 2013-03-16
  • 打赏
  • 举报
回复
加入,讨论一下
c10682 2013-03-07
  • 打赏
  • 举报
回复
1. HTMLayout 现在还是挺不错的,最近修正Bug的频率已经很少,能成功运用在这么多成功的产品上就说明了还是比较稳定的,使用过程中遇到一些小问题这个什么界面库也都难免的。
2. HTMLayout 使用behavior扩展还是很方便的,毕竟只是用来做界面而已,其实不开源的好处是保持了一致性,没有必要去了解太多的细节。真有需要的话,HTMLayout的源码也是可以购买的。
3. 跨平台有他的优势,同样有他的劣势,跨是要付出代价的,例如QT,CEF他跨平台,可是他的DLL有十几MB、甚至是几十MB,跟几百KB的HTMLayout就没得比了,如果是开发一些共享软件,体积还是很重要的。

HTMLayout实现的仿iPad界面:点这里下载完整源码


HTMLayout实现的仿360界面:点这里下载源代码

hlqyq 2012-07-11
  • 打赏
  • 举报
回复
再说说其优点:
1、概念上应等同于xul/xaml,设计理念远高于QT/wxWidget等库,区别是:QT等库用程序员写代码去构建界面,Htmlayout用打字员去打印界面;
2、接口简单,标准的操作dom树即可,不像一个QWidget,如果你想设置文本,那么是setCaption/setTitle/setWindowText/setValue?不知道,没有QT帮助,寸步难行,加上VS的智能提示的不可靠,足够让你发狂;
3、扩充容易,想想将Scitilla和Coin3d嵌入到网页中,支持各种浏览器看看;想想嵌入二次开发语言如python看看;想想调用原生API看看。这些都是浏览器中难以实现的;
hlqyq 2012-07-11
  • 打赏
  • 举报
回复
我使用该东西很久了,估计都6年了,先说说其缺点:
1、不开源,代码质量不是很稳定,估计测试不充分。很多在低版本成立的东西,在高版本就不一定成立;
2、未定义更改的用户参与扩充机制,是否发生更改全由作者确定。不像python的PEP方式;
3、不跨平台,只能在Windows/WinCE(已经废了)上使用,其实完全可以做到跨平台的;
Conggang 2012-07-06
  • 打赏
  • 举报
回复
支持Htmlayout
向立天 2011-04-29
  • 打赏
  • 举报
回复
您好
我是本版版主
此帖已多日无人关注
请您及时结帖
如您认为问题没有解决可按无满意结帖处理
另外本版设置了疑难问题汇总帖
并已在版面置顶
相关规定其帖子中有说明
您可以根据规定提交您帖子的链接
如您目前不想结帖只需回帖说明
我们会删除此结帖通知

见此回复三日内无回应
我们将强制结帖
相关规定详见界面界面版关于版主结帖工作的具体办法
QQ282881515 2011-04-02
  • 打赏
  • 举报
回复
挺感兴趣的 但网上资料好少啊
qiuchengw 2011-04-02
  • 打赏
  • 举报
回复
[Quote=引用 14 楼 jameshooo 的回复:]

htmlayout老了
[/Quote]

为何?
QQ282881515 2011-04-02
  • 打赏
  • 举报
回复
听激动了 搞了半天终于配置好了
VC6.0下 需要支持6.0最后一个版本的SDK 汗
SDK地址 以及如何处理已经在
http://blog.csdn.net/QQ282881515/archive/2011/04/02/6298757.aspx里边了
bfcode 2011-03-31
  • 打赏
  • 举报
回复
qhtml其实也不错,只是现在不更新了,代码值得一看
houxidong 2011-03-31
  • 打赏
  • 举报
回复
[Quote=引用 10 楼 tttk 的回复:]
引用 6 楼 fafa_cai 的回复:
我仔细研究了一下HTMLayout库,感觉实现能力相当有限。比如一些相对复杂的控件似乎无法实现。


htmlayout只是提供了一个引擎,剩下的就是你自己的想象力和创造力。html+css的组合,几乎可以实现大多数复杂的界面。

至于你说的相对复杂的控件,我不知道指的什么,世上没有包治百病的良药,软件也一样。
[/Quote]

这对程序员的要求太高了,一般html+css这是web程序员需要掌握的,而mfc一般是桌面程序员要掌握的。如果在做网页界面,那么dw,fp这些都可以用,如果做mfc界面,那么Libuidk就很精彩,即使纯mfc,也有CHtmlDialog可以用web做界面,或者使用CHtmlView来做。像wpf,也仅仅是使用xml语言来组织界面,并不要求程序员去了解html,甚至xml也不需要了解,因为它提供了所见即所得的工具来生成xaml语言。
jameshooo 2011-03-30
  • 打赏
  • 举报
回复
htmlayout老了
g315580086 2011-03-30
  • 打赏
  • 举报
回复
受教了
tttk 2011-03-30
  • 打赏
  • 举报
回复
[Quote=引用 11 楼 achellies 的回复:]
不开源,使用起来还是很不爽的,htmlayout无非就是比较轻量级,要不直接就可以用webkit了
[/Quote]

如果单从浏览器引擎方面考量,htmlayout和webkit这样的工具相比,的确算得上是轻量级,而且我的感受是,htmlayout甚至还算不上一个合格的浏览器引擎,因为它不支持很多HTML标记,不支持javascript,不支持DOM。

htmlayout说到底还是一种界面库引擎,其采用HTML作为其标记语言,同一些UI工具所谓的XML标记一样,不过是HTML+CSS,听起来更像网页而已。

我不会采用webkit去开发桌面,基于脚本(JS)的引擎,本身就存在性能问题。htmlayout完全采用c++语言去编写业务代码,更利于代码的调试和优化,而且充分利用了c++开发工具的智能辅助,比起js代码的跟踪和调试来,真的要方便很多。而且,也更好的保护了代码。
achellies 2011-03-29
  • 打赏
  • 举报
回复
不开源,使用起来还是很不爽的,htmlayout无非就是比较轻量级,要不直接就可以用webkit了
tttk 2011-03-24
  • 打赏
  • 举报
回复
[Quote=引用 6 楼 fafa_cai 的回复:]
我仔细研究了一下HTMLayout库,感觉实现能力相当有限。比如一些相对复杂的控件似乎无法实现。
[/Quote]

htmlayout只是提供了一个引擎,剩下的就是你自己的想象力和创造力。html+css的组合,几乎可以实现大多数复杂的界面。

至于你说的相对复杂的控件,我不知道指的什么,世上没有包治百病的良药,软件也一样。
tttk 2011-03-24
  • 打赏
  • 举报
回复
[Quote=引用 8 楼 b2b160 的回复:]
这个不能说是开源的吧?

If this is open source.Then windows is too.

Why I can't input chinese sometime.
[/Quote]

htmlayout是免费而不是开源,开源是指完全公开源代码,官方license只是要求开发者在关于对话框中放上htmlayout的版权即可。作为一个开发者,我们只是要使用其功能,至于其完善和修复这些事,不用我们去关心。

至于中文输入法不能输入的问题,一般是发生在模式对话框中,微软的MFC和WTL 对话框解决方案有一个不会说清的问题,就是在消息泵中屏蔽了WCHAR消息,因此htmlayout不能进一步进行处理。作为使用者,我也曾遇到过此问题,并在官方论坛里寻求帮助。我的解决思路是,可以通过拦截并实现自己的消息泵循环来解决。
加载更多回复(4)

15,979

社区成员

发帖
与我相关
我的任务
社区描述
VC/MFC 界面
社区管理员
  • 界面
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧