自制GUI第4篇：https://blog.csdn.net/shungry/article/details/78659613

自制GUI第5篇：https://blog.csdn.net/shungry/article/details/85246023

———————————————————————分割線—————————————————————————

本篇文章我在野火論壇中釋出過，現在修改下發到這裡（裡面可能會有很多邏輯不通的地方請見諒）

第一篇

因為接近畢業，在老師的推薦下做了個GUI，花了將近一個月的時間，從一點都不瞭解C++，到用C++做出一個簡單的訊息機制，以及簡單的控制元件庫，發帖紀念一下。雖然還是簡單的不行，包括各個控制元件的重繪機制都有些BUG 重繪的控制元件會重新改過所有的控制元件-----尷尬。想訊息處理機制依然有些混亂，借鑑了miniGui的視窗過程方式，但是人家畢竟是pc上的大型GUI，理解不大來，期間也看了QT，最後才加了自己理解用孩子兄弟二叉樹表示了整個GUI的結構，現在發現了許多因這種方式的不足，但是一條路走到黑了。
二叉樹：

 
目前的GUI測試介面：
 
list控制元件：（實在是簡陋）
鍵盤：（只支援英文）
 
對話方塊：
 

圖中還有 單選框，複選框，滑塊和進度條。---第一次發帖，確實不會排版，大牛們見諒哈。。
現在自己的腦子一片混亂，沒發做下去了。我老師還想我增強可移植性。。。😢
。
。
。
補充一句：我現在還在完善程式碼，如果不出意外，本週末或下週會發最新的情況。
中間還有很多BUG，我也不知道自己能做成什麼樣。
有興趣的各位可以加入一起完善程式碼。---------------------但是C++程式碼真的寫的難看

第二篇

之前的GUI實現方法都沒講，以後慢慢講把。但是程式碼都公開，雖然很難看。但是很歡迎大家提意見。
這裡還是感謝火哥支援，讓我有了做下去的動力!!!
之前留下了一些自己很難解決的問題，這次大概全部都解決了（但是有些都是走擦邊球

）
上次發的問題 ：
     問題 1：當某個控制元件註冊重繪後再消失時，桌面還留下了之前的控制元件的圖案，之前解決方法在控制元件銷售時重繪桌面（這樣當所有小按鍵消失時都會導致背景重繪，所以會出現螢幕經常閃動）
     解決 ：在撥出要覆蓋當前介面的控制元件時，先把要覆蓋的資料儲存到新建的buffer裡面，再覆蓋，噹噹前控制元件回收時再從buffer中把資料讀回。如圖：（字醜不要嫌棄）
     
     問題 2：當有撥出一些控制元件時（如鍵盤）,在去按其他被鍵盤覆蓋的控制元件時，又會把鍵盤覆蓋。（這個不符合邏輯，按理說按鍵應該時最高層的，誰都無法覆蓋它。）
                 問題的本身是所有的控制元件不知道誰把誰覆蓋了，各個的顯示層次是怎麼樣的。
     解決 ：當建立，或撥出一個新的控制元件時，把自己進行取樣成一個個點，會遍歷控制元件樹（上一篇稍微提過，我是用樹來實現相應關係的）去一個個比對是否取樣點在控制元件範圍中，若是則把控制元件標記為被覆蓋，設定覆蓋其的物件是新的控制元件。這樣當被覆蓋的控制元件被點按時，上面的控制元件也會被重新整理，保證一直被覆蓋。如圖：（這個會一點出現閃屏，但是是我目前不大改程式碼下最好的方法了。）
       
     問題 3：一些按鈕會出現bug，導致GUI奔潰，卡帶。（這個想想就害羞 0 0 ----不完整的就發出來了。）

     這個純屬自己沒考慮好，現在已經解決。

注意： 左上角的‘ X ’是我測試用的 不要按得太頻繁，會出現髒影象。
       

之後將要實現 1.佈局類（可以方便的佈局控制元件，不需要計算絕對座標）
                    2.重寫繪畫函式（現在都是使用火哥的函式，為了方便GUI其他板子方便移植）
                    3.完成可移植性
我用Cpp寫的所以堆的要求較大，因為是樹結構我中間用了遞迴，所以棧的要求也不小。

第三篇

最近去投簡歷了，就沒有太多的進展（添加了佈局類），這次我就大概記錄自己做這個GUI的思路吧。
1.
在第一篇的時候我簡單的講過我這個是基於 孩子兄弟二叉樹 的映像表達。
如圖：（二叉樹中，左邊的為孩子，右邊的為兄弟）
 
有什麼好處呢？當時覺得比較容易管理，而且思路清晰。
如圖：這樣一個根節點會有兩個孩子視窗（WinA，WinB），然後視窗中又有孩子控制元件（a，b1，b2），WinA和WinB是兄弟關係，b1和b2也是兄弟關係，查詢起來就很方便。
 
因為我選擇的是二叉樹，所以當要重繪全部的時候，只要用樹的先序遍歷就能把所有的視窗控制元件全部都畫出來。如果我想要登出某一個視窗或控制元件，通過把他們從樹中分離，其他連帶的孩子也會背分離，同樣的新增也很方便。
如圖：（便於遍歷，刪除，新增，這是我的主要目的）
 
上面講的是GUI的結構儲存情況。
下面的GUI控制元件中的訊息機制，我有點參考MiniGUI（其實也沒怎麼研究MiniGUI >_< 大神們莫見怪）

2.
TGUI的所有控制元件的互動都是基於訊息機制的。
怎麼說呢，就是每一個執行緒會維護一個訊息佇列。（我這裡用的是freeRTOS 執行緒自帶的佇列--原理一樣）
然後每個控制元件/視窗都會有 視窗過程函式 （這需要我們自己實現），用來實現觸發該控制元件/視窗時應該做的處理過程。
如圖：描述了一個 建立控制元件/視窗 註冊 重繪 迴圈接收資訊處理 的全過程。（當然也可以自己動態建立，這個是後話了 其實原理差不多）
 

3.
這一次我多添加了佈局類（以後新增控制元件，佈局控制元件比較方便吧）參考於Java的佈局類。我主要實現了 
流式佈局（flowLayout）：一個一個控制元件按順序排列，一行排列不下就換行接著排列，到時只需用addWin函式新增控制元件就好
 
邊框佈局（borderLayout）：把指定的區域分成東、西、南、北、中五個區域存放控制元件
 
網格佈局（gridLayout）：這個顧名思義就把視窗劃分為大小一樣的網格，用控制元件進行排列（都繼承一個layout基類，用的方法都差不多。）
 

還有可移植性還是沒想好，畫圖的函式還沒做。主要就是畫圖函式和後面的LCD驅動各有不同，還在想中。
最後還是貼上我的資源：
GitHub：https://github.com/909452726/TGUI
百度網盤：http://pan.baidu.com/s/1pLyZH0n