HTMLayout界面技術研究

原文地址:http://blog.sina.com.cn/s/blog_44f68c960100sgdl.html

爲軟件設計一個漂亮的界面,是每一個軟件開發者的夢想和目標。誠然,越來越“智能化”的快速開發工具(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. 具有較高的學習曲線。

 

自己做的一些界面展示

HTMLayout界面技術研究

HTMLayout界面技術研究

HTMLayout界面技術研究

HTMLayout界面技術研究

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章