/* * Create By : 李紹良[lsl](zyzx)
* Create Time : 2015-03-19
* 轉載請注明來源:http://www.shnenglu.com/zyzx/category/21065.html
*/
前幾章已經將UI的基礎部分介紹完畢,這章思考了很久,不知道如何下筆。干脆就以入門界面時的考慮作為切入點。
就以使用windows界面為例,如下入是使用spy++截取的窗口截圖。
當spy++落在某個區域,周圍的一個黑框,就表示的是這個窗口所在區域。不停的移動spy++查找窗口,我們可以發現如下圖的規律:
看到什么沒有,如果認真學習過數據結構,就知道這是一顆樹。所有的UI元素都在這顆樹里面,一個對話框,也就可以看成是一個樹,窗口結構也可以使用樹這種數據結構來表達。
那么Windows的窗口結構就不難理解了,要么認為是一個以“系統”為根的大樹,要么也可以認為是去除“系統”這個根的一片森林。而在某時刻,永遠只有一個處于激活的最頂層窗口,也就是得到鼠標等響應的那顆樹。
Windows把窗口搞了很多概念出來,撥開這些迷霧,實際上在我看來只需要“對話框”與“控件”足以表達紛繁復雜的UI界面。對話框與控件都是衍生自窗口的概念。對話框與控件唯一的區別在于:只有對話框才擁有線程執行權。
這里先只討論如何將這顆樹繪制成一副UI圖片。其實也很簡單,就是遍歷整顆樹,使得每個節點窗口繪制(OnPaint函數)屬于自己管轄的區域。采用畫家算法(后面繪制會把前面繪制的覆蓋),如此UI界面就繪制出來了。
如下圖,中間的對話框。目前代碼只實現了窗口繪制的一小部分,控件啥也沒有。