1. 程式人生 > >DirectUI介面程式設計(零)簡介

DirectUI介面程式設計(零)簡介

有過Win32、MFC程式設計經驗的朋友應該都知道,傳統Windows應用中的按鈕、編輯框等控制元件都是一個子視窗,作業系統通過視窗控制代碼來唯一標識該視窗。 使用Windows 標準控制元件建立使用者介面,美化起來是相當困難的,例如我們需要使用一張點陣圖作為按鈕的背景,MFC應用需要以下幾個步驟:

  • 1.繼承CButton類。
  • 2.為按鈕新增BS_OWNERDRAW樣式。
  • 3.重寫DrawItem函式,在該函式中呼叫繪圖API進行按鈕的繪製。

要對每一個控制元件都進行自繪工作量是相當大的,使用DirectUI結合目前市場上的介面庫進行介面設計就簡單多了。

DirectUI是相對於傳統控制元件而言的一種新的介面設計技術,筆者看來DirectUI只是一種介面設計理念,即我們的按鈕、編輯框等不再以視窗控制代碼的形式建立,而是在主視窗客戶區的一個邏輯區域。

例如通過DirectUI思想建立的按鈕,其實只是在主視窗中繪製的一張圖片,當用戶點選圖片在該視窗中的區域時,我們就認為是該"按鈕"的點選事件,為了使得按鈕更加逼真,我們還可以在點選時繪製另一張按下狀態的按鈕圖片。

目前基於DirectUI設計思想實現的介面庫也是比較多的,而且很多都是免費或者開源的,下面介紹筆者比較喜歡的兩款:

1.免費介面庫SkinUI

官方網站:http://www.skinui.cn/index.htm
特點:邏輯與介面分離:支援xml檔案進行窗口布局,更改介面佈局檔案,不影響程式功能,甚至不需重新編譯。
炫彩換膚:SkinUI介面庫具備一鍵換膚的功能,除了提供一套預設面板外,還可以自由配置多套系統面板。

官方Demo:
這裡寫圖片描述

這裡寫圖片描述

上面是使用SkinUI構建的360安全衛士和360壓縮介面,效果還不錯吧!

2.開源介面庫Duilib

Duilib是一款基於DirectUI思想實現的一款開源介面庫,支援xml介面佈局,介面設計與業務邏輯分離,具有強大的事件處理機制。而且提供了一款所見即所得的介面編輯器UIDesigner。
這套介面原始碼最初託管在Google Code上。
專案地址:http://code.google.com/p/duilib/,基於眾所周知的原因,目前最新的原始碼已經遷移到Github。
Github地址:https://github.com/duilib/duilib

下面我們來看看官方提供的Demo:
這裡寫圖片描述

這裡寫圖片描述

效果也還不錯吧,開源的東西一向比較受到筆者的青睞,Duilib也是筆者想詳細介紹的一款介面庫,從下節開始我們一起學習這套介面庫的使用方法。