1、第一章 FLTK 编程模型1.1 FLTK 功能简介1.2 搭建 FLTK 开发环境1.21 windows 下搭建 FLTK 开发环境1.22 ubuntu 下搭建 FLTK 开发环境1.3FLTK 构件简介1.4FLTK 事件处理1.5FLTK 消息处理1.6OpenGL 编程第二章 常用的控件和属性2.1 按钮2.2 文本2.3 颜色2.4 Box 类型第三章 FLTK 的画图函数3.1 何时可以画图3.2 FLTK 的画图函数3.3 剪切3.4 颜色3.5 设置线条的属性3.6 画一般的图形函数3.7 画封闭的线，一次连接个顶点3.8 画三边形或四边形，并填充内部3.9 复杂图形函数3
2、.10 字体3.11 覆盖画图函数第四章 在 FLTK 中自定义控件4.1 定制图形控件说明4.2 如何开发一个控件的子类4.3 处理事件4.4 画控件第一章：FLTK 编程模型FLTK(Fast Light Tool Kit 发音为 fulltick) 是一种使用 C+开发的 GUI 工具包，它可以应用于 Unix,Linux,MS-Windows95/98/NT/2000 和 MacOS 操作系统平台，相对于其它的许多图形接口开发工具包（如 MFC、GTK、QT 等） ，它具有体积很小、速度比较快，且有着更好的移植性。FLTK(Fast Light Tool Kit 发音为 fulltic
3、k) 是一种使用 C+开发的 GUI 工具包，它可以应用于 Unix，Linux，MS-Windows95/98/NT/2000 和 MacOS 操作系统平台，相对于其它的许多图形接口开发工具包（如 MFC、GTK、QT 等） ，它具有体积很小、速度比较快，且有着更好的移植性。本文就 FLTK 编程的一些基本方法进行介绍。 1.1FLTK 功能简介(1)提供丰富的跨平台的 GUI 构件(Widget)。有按钮，菜单，窗口等，近六十个。(2)支持 OpenGL，提供 Fl_GL_Window，支持 OpenGL 相关的操作。(3)提供界面设计工具 FLUID，非常方便进行界面的设计。(4)良好的
4、跨平台移植性。(5)支持多种 C+编译器，Gcc ，BC，VC 等等。(6)灵活性。FLTK 本身可以定制，以满足不同的需要。这使得 FLTK 在嵌入式开发上有着极大的竞争力，这正是我要推荐使用 FLTK 的原因。本文就 FLTK 编程的一些基本方法进行介绍.1.2 搭建 FLTK 开发环境安装 FLTK 很简单，我们只需要下载它的源文件，解压缩到目录下，在 Linux 下我们只需要输入 make，编译完成然后 make install 就头文件安装到/usr/include/FL 目录下。库文件就在/usr/lib 下，也可以自己编译之后把这些文件复制到这些目录，或者不需要复制，只在编译连接
5、的时候指定路径。在 window 下可以使用 VC，BC 打开相应目录下的工程文件编译即可。1.21 windows 下搭建 FLTK 开发环境第一步:下载 FLTK 源码包FLTK 官网:http:/www.fltk.org/下载后解压缩到 C 盘根目录下 ,命名为 FLTK进到 C:FLTKidevisualc 目录下,找到 fltk.dsw用 Visual C+6.0 打开项目，然后选择【组建】全部重建，就开始编译了编译完成后关闭 Visual C+6.0第二步:添加 FTLK 库文件(1)重新打开 Visual C+6.0, 新建一个 Win32 Application 项目,命名为
6、FLTK，然后再新建一个 hello.cxx 文件(2)建立好之后选择【工程】-【设置】 选择“连接”选项卡“分类”下拉框选择输入，在对象/库模块添加：fltkd.lib fltkgld.lib comctl32.lib wsock32.lib opengl32.lib glu32.lib还要在忽略库中添加：LIBCD libcd.lib(3)之后选择“C/C+“选项卡 ,“分类”下拉框选择：code generation, 在“use run-time library“中选择”Multi-threaded DLL“ 最后确定。(4)选择【工具】【选项】 -“目录“ 选项卡在”目录“下拉框中选
7、择“Include Files“ 然后新增一项 C:FLTK(导入头文件)(5)在“目录“下拉框中选择“Library Files”然后新增一项 C:FLTK (导入类库)(6)编译运行 hello.cxx1.22 ubuntu 下搭建 FLTK 开发环境第一步：配置基础开发环境 GCCxhyxhy-desktop:$sudo apt-get install build-essential第二步：安装 QT 开发环境xhyxhy-desktop:$sudo apt-get install qt4-dev-tools qt4-doc qt4-qtconfig qt4-demos qt4-desi
8、gner第三步：下载 FLTK 源码包FLTK 官网:http:/www.fltk.org/下载后解压缩：xhyxhy-desktop:$sudo tar zxvf FLTK.tar.gz第四步：编译安装 FLTKxhyxhy-desktop:$cd FLTKxhyxhy-desktop:$makexhyxhy-desktop:$sudo make install第五步：测试环境写一个简单的 FLTK 程序#include #include #include int main(int argc, char *argv) Fl_Window *window = new Fl_Window(300
9、,180);Fl_Box *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);window-end();window-show(argc, argv);return Fl:run();包含了需要的头文件后，该程序创建了一个窗口Fl_Window *window = new Fl_Window(300,180);还创建了一个 box 类，标签是“Hel
10、lo World!”Fl_Box *box = new Fl_Box(20,40,260,100,“Hello, World!“);下一步，我们设置了 box 的类型，大小，字体和标签的类型box-box(FL_UP_BOX);box-labelsize(36);1.3FLTK 构件简介FLTK 作为 GUI 开发包，包含了常用的图形用户接口需要的一些构件，视觉表现非常丰富，如下两图所示：常用按钮构件 按钮名称 头文件 按钮名称 头文件Fl_Button Fl_Button.H Fl_Check_Button Fl_Check_Button.HFl_Light_Button Fl_Light_
11、Button.H Fl_Repeat_Button Fl_Repeat_Button.HFl_Return_ButtonFl_Return_Button.HFl_Round_ButtonFl_Round_Button.H对于具有 Fl_Check_Button、Fl_Loght_Button 和 Fl_Round_Button 当状态为 off 时 value() =0 ，On 时 value()返回 1。处理按钮时间可以使用回调(callback)函数, 参见后面的事件处理。文本处理构件 构件名称 头文件 构件名称 头文件Fl_Input Fl_Input.H Fl_Output Fl_Ou
12、tput.HFl_Multiline_InputFl_Multiline_Input.HFl_Multiline_outputFl_Multiline_output.H设置和取得文本内容使用 value();如：(new Fl_Input(x,y,width,height,“Label“)-value(“Hello World!“);其他构件参见 FLTK.org 的 文档说明。写一个简单的 FLTK 程序#include #include #include int main(int argc, char *argv) Fl_Window *window = new Fl_Window(300
13、,180);Fl_Box *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);window-end();window-show(argc, argv);return Fl:run();包含了需要的头文件后，该程序创建了一个窗口Fl_Window *window = new Fl_Window(300,180);还创建了一个 box 类，标签是“Hel
14、lo World!”Fl_Box *box = new Fl_Box(20,40,260,100,“Hello, World!“);下一步，我们设置了 box 的类型，大小，字体和标签的类型box-box(FL_UP_BOX);box-labelsize(36);box-labelfont(FL_BOLD+FL_ITALIC);box-labeltype(FL_SHADOW_LABEL);最后，我们显示该窗口并进入 FLTK 事件循环window-end();window-show(argc, argv);return Fl:run();运行该程序得到的界面如下，你能直接关闭该窗口退出，也可以
15、按 ESC 键退出1.4FLTK 事件处理对于一般构件的如按钮，菜单等常用事件的处理一般可以使用回调函数实现，回调函数的原型是：void XXX_callback( Fl_Widget *w,void *data )/添加自己处理的内容使用 F1_Widget-callback( XXX_callback, data) 注册回调函数/*按钮事件例子*/#include #include #include #include void Btn01_cb(Fl_Widget *w, void *data)(Fl_Button *)w)-label(char *)data);fl_alert(“Hel
16、lo“);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, “Btn01-shortcut(FL_ALT+t); /定义按钮的快捷键Btn01-callback(Fl_Callback*)Btn01_cb,buff); /调用处理函数 buff 作为参数w-end();w-show(argc, argv);return Fl:run();编译运行程序，鼠标点击按钮，按钮
17、标签会发生改变，并且会弹出提示框。通常的 callback 是当构件的 value 改变时调用，可以使用 when()改变为其他事件发生调用回调函数，主要事件有以下事件事件 说明FL_WHEN_NERVER 从不调用回调函数FL_WHEN_CHANGED 当构件值改变时调用FL_WHEN_RELEASE 当释放按键或者鼠标并且构件值改变FL_WHEN_RELEASE_ALWAYS 当释放按键或者鼠标，即使构件值没有改变FL_WHEN_ENTER_KEY 按下 Enter 键并且构件值改变FL_WHEN_ENTER_KEY_ALWAYS 按下 Enter 键，即使构件值没有改变通过使用 F1_W
18、idget-when(FL_WHEN_XXXX)来改变回调事件。#include #include #include #include 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, “Btn01-shortcut(FL_ALT + t);Btn01-c
19、allback(Fl_Callback*) Btn01_cb, buff);Btn01-when(FL_WHEN_RELEASE_ALWAYS);w-end();w-show(argc, argv);return Fl:run();编译运行程序，在按钮上按下鼠标左键，移动到按钮外，松开鼠标按键，仍然会弹出对话框，对比上面的两程序，看看有什么不同。1.5FLTK 消息处理在 FLTK 中是通过 Fl_Widegt:handle(),虚拟函数来处理系统的消息。我们可以查看 Fltk 的源代码来分析系统是怎样处理一些系统消息的，如按钮的消息处理/*Fl_Button 中处理消息的代码，省略了具体的处
20、理代码*/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()中进行处理的。系统的主要消息有以下鼠标事件消息 焦点事件消息FL_PUSH FL_ENTERFL
21、_DRAG FL_LEAVEFL_RELEASE FL_FOCUSFL_MOVE FL_UNFOCUS键盘事件消息 剪贴板事件消息FL_KEYBOARD FL_PASTEFL_SHORTCUT FL_SELECTIONCLEAR构件事件消息FL_DEACTIVATE FL_ACTIVEFL_HIDE FL_SHOW通过重载 handle 函数我们可扩充标准构件，下面是一个鼠标移动到上面就改变颜色的按钮的实现源代码。#include #include #include #include class EnterButton : public Fl_Button int handle(int e)
22、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 *dat
23、a)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 下演示 截屏时鼠标没有取到1.6OpenGL 编程在 FLTK 中很容易使用 OpenGL 进行图形
24、编程的，我们只需要使用它的 Fl_Gl_Window 构件，重新定义一个派生于 Fl_Gl_Window 的类，重载 draw()和 handle()就可以。所需要的代码和步骤如下：1.包含以下头文件 #include #include #include 2.定义一个子类，如下代码所示 class MYGLWindow : public Fl_Gl_Windowvoid 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);
