| 2003 年 5 月 10 日 FLTK(Fast Light Tool Kit 發(fā)音為fulltick) 是一種使用C++開(kāi)發(fā)的GUI工具包，它可以應用于Unix,Linux,MS-Windows95/98/NT/2000和MacOS操作系統平臺，相對于其它的許多圖形接口開(kāi)發(fā)工具包（如MFC、GTK、QT等），它具有體積很小、速度比較快，且有著(zhù)更好的移植性。 FLTK(Fast Light Tool Kit 發(fā)音為fulltick) 是一種使用C++開(kāi)發(fā)的GUI工具包，它可以應用于Unix，Linux，MS-Windows95/98/NT/2000和MacOS操作系統平臺，相對于其它的許多圖形接口開(kāi)發(fā)工具包（如MFC、GTK、QT等），它具有體積很小、速度比較快，且有著(zhù)更好的移植性。本文就FLTK編程的一些基本方法進(jìn)行介紹。 FLTK功能簡(jiǎn)介 1. 提供豐富的跨平臺的GUI構件(Widget)。有按鈕，菜單，窗口等，近六十個(gè)。 2. 支持OpenGL，提供Fl_GL_Window，支持OpenGL相關(guān)的操作。 3. 提供界面設計工具FLUID，非常方便進(jìn)行界面的設計。 4. 良好的跨平臺移植性。 5. 支持多種C++編譯器，Gcc，BC，VC等等。 6. 靈活性。FLTK本身可以定制，以滿(mǎn)足不同的需要。這使得FLTK在嵌入式開(kāi)發(fā)上有著(zhù)極大的競爭力，這正是我要推薦使用FLTK的原因。 本文就FLTK編程的一些基本方法進(jìn)行介紹。
安裝 安裝FLTK很簡(jiǎn)單，我們只需要下載它的源文件，解壓縮到目錄下，在Linux下我們只需要輸入make，編譯完成然后make install就頭文件安裝到/usr/include/FL目錄下。庫文件就在/usr/lib下，也可以自己編譯之后把這些文件復制到這些目錄，或者不需要復制，只在編譯連接的時(shí)候指定路徑。 在window下可以使用VC，BC打開(kāi)相應目錄下的工程文件編譯即可。
FLTK構件簡(jiǎn)介 FLTK作為GUI開(kāi)發(fā)包，包含了常用的圖形用戶(hù)接口需要的一些構件，視覺(jué)表現非常豐富，如下兩圖所示：
常用按鈕構件 | 按鈕名稱(chēng) | 頭文件 | 按鈕名稱(chēng) | 頭文件 | | Fl_Button | Fl_Button.H | Fl_Check_Button | Fl_Check_Button.H | | Fl_Light_Button | Fl_Light_Button.H | Fl_Repeat_Button | Fl_Repeat_Button.H | | Fl_Return_Button | Fl_Return_Button.H | Fl_Round_Button | Fl_Round_Button.H | 對于具有Fl_Check_Button、Fl_Loght_Button和Fl_Round_Button當狀態(tài)為off時(shí)value() =0 ，On時(shí)value()返回1。 處理按鈕時(shí)間可以使用回調(callback)函數,參見(jiàn)后面的事件處理。 文本處理構件 | 構件名稱(chēng) | 頭文件 | 構件名稱(chēng) | 頭文件 | | Fl_Input | Fl_Input.H | Fl_Output | Fl_Output.H | | Fl_Multiline_Input | Fl_Multiline_Input.H | Fl_Multiline_output | Fl_Multiline_output.H | 設置和取得文本內容使用value(); 如： (new Fl_Input(x,y,width,height,"Label"))->value("Hello World!"); |
其他構件 參見(jiàn)FLTK.org的 文檔說(shuō)明。 這些構件是使用C++開(kāi)發(fā)的，具有完善的繼承關(guān)系，下面是構件繼承關(guān)系圖
構件使用例子－HelloWorld #include <FL/Fl.H> #include <FL/Fl_Window.H> #include <FL/Fl_Box.H> int main (int argc, char *argv[]) { Fl_Window *window; Fl_Box *box; window = new Fl_Window (300, 180); window-> label("HelloWorld!"); //添加window的標題 box = new Fl_Box (20, 40, 260, 100, "Hello World!"); box->box (FL_UP_BOX); box->labelsize (36); box->labelfont (FL_BOLD+FL_ITALIC); //設置字體 box->labeltype (FL_SHADOW_LABEL); //設置label的類(lèi)型 /*************************************************************** 進(jìn)入FLTK的事件循環(huán)處理過(guò)程 ***************************************************************/ window->end (); window->show (argc, argv); return Fl::run(); } |
在window下程序編譯運行后如圖所示：[使用VC6編譯優(yōu)化后大小為116K]
Linux下圖片[編譯未優(yōu)化大小358K]
FLTK事件處理 對于一般構件的如按鈕，菜單等常用事件的處理一般可以使用回調函數實(shí)現，回調函數的原型是： void XXX_callback( Fl_Widget *w,void *data ) { //添加自己處理的內容 } 使用F1_Widget->callback( XXX_callback,data) 注冊回調函數 /*************************************************************** 按鈕事件例子 ***************************************************************/ #include <FL/Fl.H> #include <FL/Fl_Window.H> #include <FL/Fl_Button.H> #include <FL/Fl_ask.H> void Btn01_cb(Fl_Widget *w,void *data) { ((Fl_Button *)w)->label((char *)data); fl_alert("Hello"); } int main(int argc, char **argv) { char *buff ="Hello"; Fl_Window* w = new Fl_Window(272, 144); Fl_Button* Btn01 = new Fl_Button(85, 50, 105, 25, "&Test callback"); Btn01->shortcut(FL_ALT+'t'); //定義按鈕的快捷鍵 Btn01->callback((Fl_Callback*)Btn01_cb,buff); //調用處理函數 buff作為參數 w->end(); w->show(argc, argv); return Fl::run(); } |
編譯運行程序，鼠標點(diǎn)擊按鈕，按鈕標簽會(huì )發(fā)生改變，并且會(huì )彈出提示框。 通常的callback是當構件的value改變時(shí)調用，可以使用when()改變?yōu)槠渌录l(fā)生調用回調函數，主要事件有以下事件 | 事件 | 說(shuō)明 | | FL_WHEN_NERVER | 從不調用回調函數 | | FL_WHEN_CHANGED | 當構件值改變時(shí)調用 | | FL_WHEN_RELEASE | 當釋放按鍵或者鼠標并且構件值改變 | | FL_WHEN_RELEASE_ALWAYS | 當釋放按鍵或者鼠標，即使構件值沒(méi)有改變 | | FL_WHEN_ENTER_KEY | 按下Enter鍵并且構件值改變 | | FL_WHEN_ENTER_KEY_ALWAYS | 按下Enter鍵，即使構件值沒(méi)有改變 | 通過(guò)使用F1_Widget->when(FL_WHEN_XXXX)來(lái)改變回調事件。 #include <FL/Fl.H> #include <FL/Fl_Window.H> #include <FL/Fl_Button.H> #include <FL/Fl_ask.H> void Btn01_cb(Fl_Widget *w, void *data) { fl_alert("Hello"); } int main(int argc, char **argv) { char *buff = "Hello"; Fl_Window* w = new Fl_Window(272, 144); Fl_Button* Btn01 = new Fl_Button(85, 50, 105, 25, "&Test callback"); Btn01->shortcut(FL_ALT + 't'); Btn01->callback((Fl_Callback*) Btn01_cb, buff); Btn01->when(FL_WHEN_RELEASE_ALWAYS); w->end(); w->show(argc, argv); return Fl::run(); } |
編譯運行程序，在按鈕上按下鼠標左鍵，移動(dòng)到按鈕外，松開(kāi)鼠標按鍵，仍然會(huì )彈出對話(huà)框，對比上面的兩程序，看看有什么不同。
FLTK消息處理 在FLTK中是通過(guò)Fl_Widegt::handle(),虛擬函數來(lái)處理系統的消息。我們可以查看Fltk的源代碼來(lái)分析系統是怎樣處理一些系統消息的，如按鈕的消息處理 /******************************************************* Fl_Button中處理消息的代碼，省略了具體的處理代碼 *******************************************************/ int Fl_Button::handle(int event) { switch (event) { case FL_ENTER: case FL_LEAVE: return 1; case FL_PUSH: …… case FL_DRAG: …… case FL_RELEASE: …… case FL_SHORTCUT: …… case FL_FOCUS : …… case FL_UNFOCUS : …… case FL_KEYBOARD : …… default: return 0; } } |
可以看出了，系統的一些消息，都是在構件的handle()中進(jìn)行處理的。 系統的主要消息有以下 | 鼠標事件消息 | 焦點(diǎn)事件消息 | | FL_PUSH | FL_ENTER | | FL_DRAG | FL_LEAVE | | FL_RELEASE | FL_FOCUS | | FL_MOVE | FL_UNFOCUS | | 鍵盤(pán)事件消息 | 剪貼板事件消息 | | FL_KEYBOARD | FL_PASTE | | FL_SHORTCUT | FL_SELECTIONCLEAR | | | 構件事件消息 | | FL_DEACTIVATE | FL_ACTIVE | | FL_HIDE | FL_SHOW | 通過(guò)重載handle函數我們可擴充標準構件，下面是一個(gè)鼠標移動(dòng)到上面就改變顏色的按鈕的實(shí)現源代碼。 #include <FL/Fl.H> #include <FL/Fl_Window.H> #include <FL/Fl_Button.H> #include <FL/fl_ask.H> class EnterButton : public Fl_Button { int handle(int e) { switch (e) { case FL_ENTER: color(FL_GREEN); labelsize(18); redraw(); return 1; case FL_LEAVE: color(FL_GRAY); labelsize(18); redraw(); return 1; default: return Fl_Button::handle(e); } } public: EnterButton(int x, int y, int w, int h, const char *l ) : Fl_Button(x,y,w,h,l) { } }; static void cb(Fl_Widget* s, void *data) { fl_alert( "Hello World!" ); } int main(int argc, char **argv) { Fl_Window* w = new Fl_Window(130, 50); EnterButton *eBtn = new EnterButton(25,50,120,25,"HelloWorld"); eBtn->callback((Fl_Callback*)cb); w->end(); w->show(argc, argv); return Fl::run(); } |
運行顯示效果如圖:
Linux下演示[截屏時(shí)鼠標沒(méi)有取到]
FLUID簡(jiǎn)介 FLUID （FLTK UserInteface Designer）是FLTK進(jìn)行程序界面設計的有力工具，如同GTK界面開(kāi)發(fā)工具Glade一樣。 它包含在FLTK源代碼中，需要自己編譯成可執行文件。在Window平臺可以使用VC/BC編譯成可執行文件。啟動(dòng)和設計時(shí)界面如圖所示：
Fluid非常容易使用，首先是新建,輸入文件名，后點(diǎn)Bin 窗口的Function 圖標，建立main主函數[清空name就可以]，然后可以選擇window 圖標，建立窗口，然后拖放其他構件，可以在雙擊構件設置構件的屬性【如下圖】，在GUI屬性頁(yè)中設置標簽和快捷鍵，位置大小，圖片，提示，對齊方式等，在style中設置它的顯示風(fēng)格等，在C++中設置名字，書(shū)寫(xiě)它的回調函數等。
設計好界面后，我們可以把這些轉換為C++源代碼，選菜單File中的write Code即可，使用編輯器可以打開(kāi)與工程同名的源文件和頭文件，怎么做，不再贅述。
OpenGL編程 在FLTK中很容易使用OpenGL進(jìn)行圖形編程的，我們只需要使用它的Fl_Gl_Window構件，重新定義一個(gè)派生于Fl_Gl_Window的類(lèi)，重載draw()和handle()就可以。所需要的代碼和步驟如下： 包含以下頭文件 #include <FL/Fl.H> #include <FL/gl.h> #include <FL/Fl_Gl_Window.H> |
定義一個(gè)子類(lèi)，如下代碼所示 class MYGLWindow : public Fl_Gl_Window { void draw(); //作圖操作 void handle( int ); //消息事件處理 public : MYGLWindow(int x,int y,int w,int h,const char *L) : Fl_Gl_Window(x,y,w,h,L){}; }; |
實(shí)現draw()事件 void MYGLWindow::draw() //作圖 { if ( ! valid() ) { //設置viewport窗口大小等等 例如 /********************************************** valid(1); glLoadIdentity(); glViewport(0,0,w(),h()); ***********************************************/ } //添加使用OPENGL作圖操作 /* ……..*/ }; |
事件處理實(shí)現 void MYGLWindow::handle( int event) //事件處理 { switch (event) { case FL_PUSH : //操作等 return 1; case ……. } } |
注意 1. 編譯時(shí)需要包含openGL32的庫文件，名字在不同的平臺名字稍微不同。 2. 使用<FL/gl.h>代替<GL/gl.h>頭文件，不要使用后者的頭文件。 例子程序比較長(cháng)，附在參考中。運行顯示，彈出菜單后如圖所示：
VC中使用FLTK 在Vc中無(wú)法直接使用FLTK，需要下載FLTK的源文件編譯之后再進(jìn)行一些簡(jiǎn)單的設置，設置步驟如下： 1. 打開(kāi)Project->Settings->Link, 添加以下庫文件:
wsock32.lib opengl32.lib glu32.lib fltk.lib fltkgl.lib
[fltk.lib fltkgl.lib 需要自己編譯FLTK源文件生成,直接打開(kāi)源文件下的visualc目錄下的工程文件就可以編譯] 2. 在Project->Settings->Link的PROJECT OPTIONS中 添加 /nodefaultlib:"LIBCD"，如果你要生成release版本的那么是 /nodefaultlib:"LIBC" 3. 在Tools->Options->Directories, 選擇 include files 添加路徑如
C:\Program Files\fltk [對照自己的修改] 4. 在Tools->Options->Directories, 選擇 library files 設定為如下所示
C:\Program Files\fltk\lib [對照自己的修改] 5. Project->Settings->C/C++ 中的category 選擇 C++ Language 6. 在Project->Settings->C/C++,的PROJECT OPTIONS添加:
/I "c:\program files\fltk" [對照修改]，此處不修改也可以編譯
KDevelop中使用FLTK 作為跨平臺的一種輕量級的GUI Tools，在Linux下得到更為廣泛的使用，所以我們使用Linux下的最常用的Kdevelop也能很方便使用它。下面簡(jiǎn)述需要注意的配置步驟： 1. 我們建立C++工程后，需要修改的配置都在菜單[項目]-->[選項]'[連接器選項]中修改 2. 在[庫]中選定 X11和Xext，根據自己的需要還需要選定 math等庫 3. 在[附加庫]那里輸入 -L/usr/X11R6/lib -lfltk 4. 如果開(kāi)發(fā)OpenGL應用需要 在附加庫中輸入 -lfltk_gl -lglut 指定連接庫。
提示：因為我使用的Linux為RedHat 8,為選擇中文環(huán)境，所以配置說(shuō)明也是中文，英文版本可能有所不同，對照修改即可.
參考資料 1. 想了解更多的FLTK的知識和下載FLTK源代碼等可以到 www.fltk.org 網(wǎng)站。 FLTK的編程手冊你想了解FLTK構件的事件方法等都在里面。OpenGL 2. 還是參考一下 www.opengl.org上的資料吧，有文檔說(shuō)明還有教學(xué)和源代碼。
關(guān)于作者 | | | | 左錦，就職南沙資訊科技園，喜愛(ài) Linux，Java 還有藍天白云青山綠水。通過(guò) zuo170@163.com和他聯(lián)系。 | | 
