1. 程式人生 > >emWin 2天速成實例教程000_如何快速入門ucGUI/emWin

emWin 2天速成實例教程000_如何快速入門ucGUI/emWin

emWin教程emWin入門教程

備註:(1)打開工程目錄下的"Exe\GUISimulationDebug.exe"即可看到效果。(2)看完教程000~005就基本會用emWin做項目,其他章節可以需要時再參考。
emWin和ucGUI是一樣的,只是名稱不同而已。emWin是德國SEGGER公司一個嵌入式GUI圖形庫,GUI圖形庫的概念就好像它是一個平臺,我們只需要在這個平臺上通過其提供的方法寫自己的用戶界面應用程序就行,非常簡單、便捷。如果沒有這個GUI圖形庫,我們的應用程序還需要考慮按鍵、編輯框、下拉菜單等控件的繪制,以及控件各種功能的實現,還需要管理各個控件、窗口、頁面它們之間的相互關系,還需要做觸摸屏/鼠標/鍵盤的管理等等,這是非常麻煩而且容易出錯的事情;如果使用emWin,這些事情都是由emWin去處理的,所有的功能基本上是通過調用API函數完成。
因為emWin的用戶應用程序結構分明,開始學習emWin最好的方法是先掌握它的界面應用程序的結構;所有的emWin界面應用程序,對於每個頁面,都是由三部分組成:(1)控件結構體數組 (2)回調函數 (3) 頁面創建函數;另外補充三個元素:(1)控件句柄 (2)控件ID (3)消息。
static const GUI_WIDGET_CREATE_INFO_aDialogCreate[] =//控件結構體數組
{
控件(ID_0)
控件(ID_1)
......
控件(ID_x)

};
static void _cbDialog(WM_MESSAGE* pMsg)//回調函數
{
case WM_PAINT://窗口重繪消息,這個比較難說明白,反正在Framewin或Window窗口之中我們一般是用控
//件,如果要在Framewin或Window窗口之中顯示文字或繪制直線、矩形、圓等在這裏實現

......
case WM_INIT_DIALOG://初始化消息,創建窗口/控件時有效,比如在這裏設置一些控件的初始參數
......
case WM_NOTIFY_PARENT://操作觸發消息處理(操作屏幕程序會跑到這裏),比如點擊按鍵、點擊編輯框(任何的操作)等等......
......
}
句柄= GUI_CreateDialogBox(控件結構體數組,回調函數,父窗口句柄);//頁面創建函數,返回該頁面句柄
(1)控件結構體數組包含一個頁面的全部使用到的控件。
(2)每個頁面都對應一個回調函數,反正界面的任何操作都在這個回調函數裏面用程序處理。
(3)每個頁面或控件都對應一個句柄,通過句柄和ID可以找到和管理任何的頁面或控件,子父窗口/控件是從屬關系。
剛開始接觸emWin,千萬不要去研究怎麽移植驅動或者研究emWin的工作機理,只管用C語言去做界面就好;可以買個STM32+320*240液晶屏的開發板,也可以不買STM32開發板只在emWin脫機模擬仿真開發平臺(VC或CodeBlocks)上寫界面程序,不要懷疑在emWin模擬開發平臺上寫的界面程序在STM32上運行不了,100%不用修改直接能跑!只有一個地方需要考慮的是:STM32和emWin模擬開發平臺的內存RAM大小是不一樣的,STM32的RAM不夠的話emWin界面程序是跑不起來的。
要做到快速開發emWin界面程序,一定要借助脫機模擬仿真開發平臺(VC或CodeBlocks)在電腦上先做好界面,如果直接在STM32開發環境直接做界面,加上對emWin不熟悉,不斷下載測試將花費非常非常多的時間!
開始時可以借助emWin的配套工具GUIBuilder做界面然後生成C代碼,通過閱讀生成的C代碼去掌握emWin界面應用程序的框架和編程方法;但GUIBuilder功能比較弱智,因此只能設計一個初步的界面;其實emWin真正強大的地方是通過C語言和API函數實現千變萬化的界面,當你熟悉其C語言界面編程方法之後(事實上emWin界面編程是比較簡單的),你就會覺得原來做個界面如此簡單!

1.需要安裝的軟件:
(1) emWin脫機模擬仿真軟件:codeblocks-13.12mingw-setup(”軟件/資料下載”欄目可下載)
(2) 下載並解壓emWin模擬器版本:SeggerEval_WIN32_MSVC_MinGW_GUI_V528(”軟件/資料下載”欄目可下載)

2.運行emWin自帶的DEMO程序
(1) 解壓SeggerEval_WIN32_MSVC_MinGW_GUI_V528之後用CodeBlocks打開工程工程文件:SimulationTrial.cbp然後編譯工程:
技術分享圖片

(2) 運行emWin自帶的DEMO程序:
技術分享圖片


完了,是不是特別簡單?




3.實現最簡單的emWin界面
備註:如需要修改emWin的分辨率,可以通過修改..\Config\LCDConf.c文件實現:
#defineXSIZE_PHYS 320
#define YSIZE_PHYS 240

(1)刪除SeggerEval_WIN32_MSVC_MinGW_GUI_V528/Application目錄下的所有文件(只剩下GUIDEMO_Start.c),並修改GUIDEMO_Start.c:
#include "dialog.h"
void MainTask(void)
{
GUI_Init();//初始化emWin/ucGUI
CreateFramewin(WM_HBKWIN); //創建窗體,父窗體是桌面背景
while(1) {GUI_Delay(20);} //調用GUI_Delay函數延時20MS(最終目的是調用GUI_Exec()函數)
}

技術分享圖片

利用emWin的配套工具GUIBuilderV530(”軟件/資料下載”欄目可下載),我們可實現組態、拖放式人機用戶界面設計;GUIBuilder操作界面非常簡單、一目了然;GUIBuilder生成的界面文件是標準C文件,將生成的C文件加到emWin工程中並在emWin這個圖形庫平臺上運行,即可顯示你所設計的界面;每生成一個界面C文件即對應一個頁面,如果要設計多個頁面的界面怎麽辦?生成多個界面C文件並在回調函數的操作觸發消息中用WM_HideWindow()和WM_ShowWindow()函數實現界面切換程序即可:

技術分享圖片

(2)值得註意的是emWin的每個界面都必須有一個Framewin/Window控件作為父窗體,這裏我們添加一個Framewin控件做父窗體:
備註:如果我需要一個純色的背景桌面怎麽辦?那就放一個Window做父窗體(保存為單獨C文件),其他Framewin/Window都作為它的子窗體。
備註:一定要記住emWin子父窗體/控件概念的重要性(前面有說)!

技術分享圖片

(3)添加一個Button控件並右鍵修改Button名稱和字體(Button控件還有很多修改屬性的API函數,只是GUIBuilder沒有而已,可通過修改C文件現實,這個時候需要查閱emWin說明書的Button控件API函數):
小技巧:放置xxxx控件之後不要用鼠標移動,用上下左右建移動更容易對齊(步進是5)。

技術分享圖片技術分享圖片

(4)添加一個Checkbox控件並設置文字、字體、顏色等(Checkbox控件還有很多修改屬性的API函數,只是GUIBuilder沒有而已,可通過修改C文件現實,這個時候需要查閱emWin說明書的Checkbox控件API函數):
小技巧:放置xxxx控件之後不要用鼠標移動,用上下左右建移動更容易對齊(步進是5)。

技術分享圖片

(5)將界面保存為C文件:
技術分享圖片

(6)將剛才用GUIBuilder生成的C文件”FramewinDLG.c”復制到SeggerEval_WIN32_MSVC_MinGW_GUI_V528/Applicatio目錄,並用CodeBlocks打開工程文件:SimulationTrial.cbp
技術分享圖片技術分享圖片

(7)刪除工程Applicatio下面原來的文件並把GUIDEMO_Start.c和FramewinDLG.c添加進來,然後編譯工程:
技術分享圖片

(8)運行:
技術分享圖片

(10)到目前為止,在Framewin窗體上的Button和Checkbox控件還是完全獨立的,也就是除了能點擊和顯示以外,還沒有任何的功能,那麽我們怎麽為這兩個控件添加功能程序呢?比如我們想通過Button控件去控制Checkbox控件的選擇狀態,那麽我們可以通過修改FramewinDLG.c文件的程序實現,在WM_NOTIFY_PARENT消息中(操作屏幕時程序跑到這裏)加入以下程序:
hItem = WM_GetDialogItem(pMsg->hWin, ID_CHECKBOX_0);//獲取ID_CHECKBOX_0控件句柄
if(CHECKBOX_IsChecked(hItem)) CHECKBOX_Uncheck(hItem);//ID_CHECKBOX_0取消選擇
else CHECKBOX_Check(hItem);// ID_CHECKBOX_0打勾選擇

技術分享圖片

改為中文顯示:
備註:GUIBuilder工具目前不支持中文,因此只能在CodeBlocks做界面模擬仿真時再改為中文顯示。
(1)在例程中加入以下兩個文件(可以在GLCD資料包的”helloPRJ_WINemWin530noOS_CodeBlocks_GBK.rar”例程中找到),GBK_16m16.c是字庫C文件,GUI_UC_EncodeGBK.c是設置emWin為GBK編碼C文件:

技術分享圖片

(2)設置emWin為GBK編碼:
技術分享圖片

(3)修改中文顯示:
備註:使用GBK編碼Code::Blocks需要做以下設置,否則保存C文件時將自動被改為UTF8編碼。

技術分享圖片

技術分享圖片

技術分享圖片


源碼/軟件下載


附錄:emWin說明書解讀
emWin說明書有一千多頁,對於初學者來說,通過emWin說明書來學會做界面是不可能的(不管花多少時間),emWin說明書唯一的用處是在做界面的過程中查閱相關的API函數,其API函數總共分三大類:
(1)2D繪圖類,函數以”GUI_”開頭,包括文字顯示(註:不是控件上面的文字)、線/圓/矩形等的繪制、圖片/影片顯示、字體/顏色設置等等...

技術分享圖片技術分享圖片技術分享圖片技術分享圖片技術分享圖片技術分享圖片技術分享圖片

(2)窗口管理類,函數以”WM_”開頭,比如隱藏/顯示某個窗口、禁止/使能某個窗口、使某個窗口或區域無效以重繪、移動某個窗口/控件、判斷某個窗口是否可見或被覆蓋等等...
技術分享圖片

(3)控件類,函數以”XXXX_”(控件名)開頭:
技術分享圖片技術分享圖片

emWin 2天速成實例教程000_如何快速入門ucGUI/emWin