【探索wireshark】 熟悉GTK+

// 所有原创文章转载请注明作者及链接
// blackboycpp(AT)gmail.com
// QQ群： 135202158

1. 背景

ethereal 0.2.0使用了GTK+来实现界面, 然而, 由于GTK+的更新很快, ethereal 0.2.0所使用的GTK+版本(1.0.1)和目前的版本(比如, 我所用的2.16.6)已经很不一样了, 很多构件或函数已遭废弃(如GtkText和GtkTree已经被设计更好的GtkTextView和GtkTreeView所代替), 因此直接编译是会出错的. 我们必须修改源代码, 以使得编译通过.

2. 下载并安装GTK+2.0

可以到http://www.gtk.org/download.html去下载GTK+. 对于Windows用户, 为了简便, 可以下载所谓的”All-in-one bundles”版本, 这种版本除了GTK+, 还包括它所要用到的所有第三方程序包. 一键安装, 岂不快哉?

下载之后解压缩到某个目录,如x/gtk. 然后将x/gtk/bin加入到环境变量PATH. 之后, 打开CMD, 运行”pkg-config --cflags gtk+-2.0”, 如果正常, 应该显示和以下相似的内容:

-mms-bitfields -IX/gtk/include/gtk-2.0 -IX/gtk/lib/gtk-2.0/include -ID :/dev/gtk/include/atk-1.0 -IX/gtk/include/cairo -IX/gtk/include/pango- 1.0 -IX/gtk/include/glib-2.0 -IX/gtk/lib/glib-2.0/include -IX/gtk /include/freetype2 -IX/gtk/include -IX/gtk/include/libpng14

注意: X/gtk/是你将GTK+解压缩到的主目录.

运行”gtk-demo”, 则会打开自带的演示程序. 不光如此, 它还贴心地附带了大量的文档, 位置在X/gtk/share/gtk-doc/html/目录下. 方便了离线查阅.

3. 在Windows下练习GTK+的开发

我推荐用两种IDE来进行Windows下的GTK+开发. 一是Code::Blocks, 二是Dev-C++. 我强烈推荐用强大的Code::Blocks!!! 因为她太好用了, 以至我不需要写说明. 喜欢用Dev-C++的朋友可以参考我的这篇介绍: http://blog.csdn.net/blackboyofsnp/archive/2008/11/20/3343045.aspx 好了, 有了GTK+, 有了IDE, 是时候练习一些东西了. HelloWorld就不说了, 主要学习一下较新的GtkTreeView和GTextView构件.

3.1 GtkTreeView构件

GTK+中的这个构件用来实现LIstView和TreeView.

概述

在GTK+中, 使用GtkTreeModel接口和GtkTreeView构件, 可以创建树形或列表控件. 此构件采用了Model/View/Controller设计, 包含4个主要部分:
(1) Tree view构件(GtkTreeView)
(2) 视图列(GtkTreeViewColumn)
(3) 单元格[cell]呈现器(GtkCellRenderer等)
(4) 模型接口(GtkTreeModel)

视图由前3个对象组成, 最后一个是模型. MVC设计的一个主要优点是多个视图可以基于一个模型创建. 例如, 可以为文件管理器创建一个映射文件系统的模型. 这样, 就可以创建多个视图来显示文件系统的多个部分, 而只需要在内存中保存一份拷贝. 单元格呈现器的目的是为了给构件提供可扩展性, 并以多种方式呈现相同类型的数据. 考虑如何呈现一个布尔变量. 它应该以字符串”True”或”False”, “On”或 ”Off”, 还是以一个checkbox呈现?

创建一个model

GTK+提供两个简单可用的Models: GtkListStore和GtkTreeStore. GtkListStore用于列表构件, 而GtkTreeStore用于树形构件. 开发一个新的model类型也是可能, 但这两个基本已经够用了. 创建model很简单:

GtkListStore *store = gtk_list_store_new (2, G_TYPE_STRING, G_TYPE_BOOLEAN);

以上代码创建了有两个列的列表, 一个字符串列和一个布尔值列. 不过一般不直接传递2这样的字面参数; 通常使用一个enum来包含不同的列, 它的最后一项是列的总数. 下面的示例代码显示了这一点, 仅仅是用treeview代替了listview:

enum{ TITLE_COLUMN, AUTHOR_COLUMN, CHECKED_COLUMN, N_COLUMNS};GtkTreeStore *store = gtk_tree_store_new (N_COLUMNS, /* 列总数 */ G_TYPE_STRING, /* 书名 */ G_TYPE_STRING, /* 作者 */ G_TYPE_BOOLEAN); /* 是否选中? */

要将数据添加到model, 需要使用gtk_tree_store_set()或gtk_list_store_set()函数. 另外还需要取得GtkTreeIter, 此迭代器指向数据将要被添加的位置. 请看以下示例:

GtkTreeIter iter;gtk_tree_store_append (store, &iter, NULL); /* 取得迭代器 */gtk_tree_store_set (store, &iter, TITLE_COLUMN, "深入浅出HTML", AUTHOR_COLUMN, "某网友", CHECKED_COLUMN, FALSE, -1);

注意最后一个参数是-1, 这是因为gtk_tree/list_store_set()是一个可变参数的函数, 它需要知道何时停止处理参数. 它可以用于为一个给定行的任意或所有列设定数据.

gtk_tree_store_append()的第3个参数是父迭代器. 它用于向一个GtkTreeStore添加一行, 并做为已存在的行的子行. 这意味着此新行只有在它的父行可见并处于展开状态时. 请考虑以下的示例:

GtkTreeIter iter1; /* 父 iter */GtkTreeIter iter2; /* 子 iter */gtk_tree_store_append (store, &iter1, NULL); /* 获得最顶层的iterator */gtk_tree_store_set (store, &iter1, TITLE_COLUMN, "The Art of Computer Programming", AUTHOR_COLUMN, "Donald E. Knuth", CHECKED_COLUMN, FALSE, -1);gtk_tree_store_append (store, &iter2, &iter1); /* 取得一个子iterator */gtk_tree_store_set (store, &iter2, TITLE_COLUMN, "Volume 1: Fundamental Algorithms", -1);gtk_tree_store_append (store, &iter2, &iter1);gtk_tree_store_set (store, &iter2, TITLE_COLUMN, "Volume 2: Seminumerical Algorithms", -1);gtk_tree_store_append (store, &iter2, &iter1);gtk_tree_store_set (store, &iter2, TITLE_COLUMN, "Volume 3: Sorting and Searching", -1);

 

尽管可以选择多种不同的models, 但只需要一种view构件. 它可以用于listview或treeview模式. 使用GtkTreeView不难, 它需要GtkTreeModel来了解从哪里取得它的数据:

GtkWidget *tree;tree = gtk_tree_view_new_with_model (GTK_TREE_MODEL (store));

 

Columns和cell renderers

有了Model的GtkTreeView需要用columns和cell renderers来显示model.

cell renderers以某种方式绘制tree model中的数据. GTK+2.0有很多cell renderers, 包括GtkCellRendererText, GtkCellRendererPixbuf和 GtkCellRendererToggle. 写一个自定义的renderer也是比较简单的.

GtkTreeView用GtkTreeViewColumn对象来组织tree view中的纵向列. 它需要知道列的名字, cell renderer的类型以及向给定行显示哪些数据.

GtkCellRenderer *renderer;GtkTreeViewColumn *column;renderer = gtk_cell_renderer_text_new ();column = gtk_tree_view_column_new_with_attributes ("Author", // 表头文字 renderer, // cell renderer "text", AUTHOR_COLUMN, // 多个attributes NULL);// 可变参数, 最后必须以NULL结束gtk_tree_view_append_column (GTK_TREE_VIEW (tree), column);

处理选中的项

大多数应用程序不仅要显示数据, 还接受来自用户的输入事件<如选中某个结点>. 要完成这个功能, 可以简单地取得选中项(selection)对象的引用, 并和”changed”信号连接:

/* Prototype for selection handler callback */static void tree_selection_changed_cb (GtkTreeSelection *selection, gpointer data);/* Setup the selection handler */GtkTreeSelection *select;select = gtk_tree_view_get_selection (GTK_TREE_VIEW (tree));gtk_tree_selection_set_mode (select, GTK_SELECTION_SINGLE);g_signal_connect (G_OBJECT (select), "changed", G_CALLBACK (tree_selection_changed_cb), NULL);

 

然后, 在回调函数里取得选择行的数据:

static voidtree_selection_changed_cb (GtkTreeSelection *selection, gpointer data){ GtkTreeIter iter; GtkTreeModel *model; gchar *author; if (gtk_tree_selection_get_selected (selection, &model, &iter)) { gtk_tree_model_get (model, &iter, AUTHOR_COLUMN, &author, -1); g_print ("You selected a book by %s/n", author); g_free (author); }}

一个完整而简单的示例

/** File: GtkTreeView演示* Author: blackboy, [e-mail]* D/T: 2010.9.25*/#include <gtk/gtk.h>/* 用于list view */enum ListCols{ LIST_NUM, LIST_NAME, LIST_CHECKED, LIST_CNT};/* 用于tree view */enum TreeCols{ TREE_NAME, TREE_CNT};/* tree view选项项改变时调用的回调函数 */static voidtree_select_changed_cb(GtkTreeSelection* select, gpointer data){ GtkTreeIter iter; GtkTreeModel* model; gchar* str; if(gtk_tree_selection_get_selected(select, &model, &iter)) { gtk_tree_model_get(model, &iter, TREE_NAME, &str, -1); gtk_statusbar_push(GTK_STATUSBAR(data), gtk_statusbar_get_context_id(GTK_STATUSBAR(data), str), str); g_free(str); }}int main (int argc, char *argv[]){ GtkWidget* win; GtkWidget* vbox ; GtkWidget* statusbar ; GtkTreeView* tree; GtkTreeView* list; GtkTreeStore* tree_store; GtkListStore* list_store; GtkTreeIter iter; GtkTreeIter iter_child; GtkCellRenderer* renderer; GtkTreeViewColumn* column; GtkTreeSelection* select; /* 初始化gtk */ gtk_init (&argc, &argv); /* 创建窗口并设置其参数 */ win = gtk_window_new (GTK_WINDOW_TOPLEVEL); gtk_window_set_title (GTK_WINDOW (win), "My GtkTreeView"); gtk_window_set_position (GTK_WINDOW (win), GTK_WIN_POS_CENTER); gtk_widget_set_size_request(win, 480, 480); /* 创建垂直布局构件 */ vbox = gtk_vbox_new (FALSE, 2); gtk_container_add (GTK_CONTAINER (win), vbox); /* 创建TreeView */ tree = gtk_tree_view_new(); /* 创建TreeView的Model, 添加数据 */ tree_store = gtk_tree_store_new(TREE_CNT, G_TYPE_STRING); gtk_tree_store_append(tree_store, &iter, NULL); gtk_tree_store_set(tree_store, &iter, TREE_NAME, "Windows", -1); gtk_tree_store_append(tree_store, &iter_child, &iter); gtk_tree_store_set(tree_store, &iter_child, TREE_NAME, "Windows 98", -1); gtk_tree_store_append(tree_store, &iter_child, &iter); gtk_tree_store_set(tree_store, &iter_child, TREE_NAME, "Windows XP", -1); gtk_tree_store_append(tree_store, &iter_child, &iter); gtk_tree_store_set(tree_store, &iter_child, TREE_NAME, "Windows 7", -1); gtk_tree_store_append(tree_store, &iter, NULL); gtk_tree_store_set(tree_store, &iter, TREE_NAME, "Linux", -1); gtk_tree_store_append(tree_store, &iter_child, &iter); gtk_tree_store_set(tree_store, &iter_child, TREE_NAME, "Redhat", -1); gtk_tree_store_append(tree_store, &iter_child, &iter); gtk_tree_store_set(tree_store, &iter_child, TREE_NAME, "Fedora", -1); gtk_tree_store_append(tree_store, &iter_child, &iter); gtk_tree_store_set(tree_store, &iter_child, TREE_NAME, "Suse", -1); gtk_tree_view_set_model(tree, tree_store); g_object_unref(tree_store); /* 创建TreeView的View */ renderer = gtk_cell_renderer_text_new(); column = gtk_tree_view_column_new_with_attributes( "操作系统(选择项改变时状态栏会响应)", renderer, "text", TREE_NAME, NULL); gtk_tree_view_append_column(tree, column); gtk_tree_view_expand_all(tree); gtk_box_pack_start(vbox, tree, TRUE, TRUE, 1); /* 创建ListView */ list = gtk_tree_view_new(); /* 创建ListView的model, 添加数据 */ list_store = gtk_list_store_new(LIST_CNT, G_TYPE_STRING, G_TYPE_STRING, G_TYPE_BOOLEAN); gtk_list_store_append(list_store, &iter); gtk_list_store_set(list_store, &iter, LIST_NUM, "1001", LIST_NAME, "Lucy", LIST_CHECKED, FALSE, -1); gtk_list_store_append(list_store, &iter); gtk_list_store_set(list_store, &iter, LIST_NUM, "1001", LIST_NAME, "韩梅梅", LIST_CHECKED, TRUE, -1); gtk_list_store_append(list_store, &iter); gtk_list_store_set(list_store, &iter, LIST_NUM, "1001", LIST_NAME, "Tom Green", LIST_CHECKED, TRUE, -1); gtk_list_store_append(list_store, &iter); gtk_list_store_set(list_store, &iter, LIST_NUM, "1001", LIST_NAME, "李明", LIST_CHECKED, FALSE, -1); gtk_tree_view_set_model(list, list_store); g_object_unref(list_store); /* 创建ListView的View */ renderer = gtk_cell_renderer_text_new(); column = gtk_tree_view_column_new_with_attributes("学号", renderer, "text", LIST_NUM, NULL); column = gtk_tree_view_append_column(list, column); renderer = gtk_cell_renderer_text_new(); column = gtk_tree_view_column_new_with_attributes("姓名", renderer, "text", LIST_NAME, NULL); column = gtk_tree_view_append_column(list, column); renderer = gtk_cell_renderer_toggle_new(); column = gtk_tree_view_column_new_with_attributes("是否优秀?", renderer, "active", LIST_CHECKED, NULL); column = gtk_tree_view_append_column(list, column); gtk_box_pack_start(vbox, list, TRUE, TRUE, 1); /* 创建状态栏 */ statusbar = gtk_statusbar_new(); gtk_box_pack_start(vbox, statusbar, FALSE, TRUE, 1); /* 设置tree view选择项改变时的事件处理函数 */ select = gtk_tree_view_get_selection(tree); gtk_tree_selection_set_mode(select, GTK_SELECTION_SINGLE); g_signal_connect(G_OBJECT(select), "changed", G_CALLBACK(tree_select_changed_cb), statusbar); /* 窗口关闭处理 */ g_signal_connect (win, "destroy", gtk_main_quit, NULL); /* 主循环 */ gtk_widget_show_all (win); gtk_main (); return 0;}

---

3.2 GtkTextView构件

概述

GTK+拥有一个非常强大的多行文本编辑框架. 主要的对象是GtkTextBuffer,它用来表示正在编辑的文本, 还有GtkTextView构件, 它用来显示GtkTextBuffer. 每个buffer可以被多个view显示.

GTK+中的文本都以UTF-8进行编码. 这意味着一个字符可以被编码为多个字节. 字符数通常称为offsets, 而字节数则称为indexes. 如果混淆了两者, 在 ASCII的情况下当然没事, 但只要你的buffer包含了多字节字符, 情况就糟了.

buffer里的文本可以由tags来进行标记. tag是一个可以用于一系列文本的属性. 例如, 一个名为”bold”的tag可以用来加粗一些文本. 然而, tag的概念比这个更宽泛, 它也不只是影响到文本的外观, 还可以影响鼠标或击键的行为, “锁定”文字以使用户不可以编辑, 等等等等. tag由GtkTextTag对象表示. 一个GtkTextTag可以用于多个buffer内的多项文本.

每个tag储存于GtkTextTagTable. 一个tag table定义了一套可以一起使用的tags. 每个buffer关联一个tag table; 只有来自tab table的tags才能被 buffer所使用. 然而, 单个tag table可以在多个buffer间共享.

tag可以有名字(如”bold”), 也可以没有.

大多数文本操作使用GtkTextIter表示的iterators来完成. iterator用来表示text buffer中两个字符之间的位置. GtkTextIter这个struct被设计为在stack上分配内存, 它保证可以被值拷贝, 并绝不包含任何heap上分配的数据. Iterator也不是一直有效的, 每当buffer被修改导致其中的字符数发生变化时, 先前的iterator就会失效. (注意: 删除5个字符, 再重新插入5个字符仍然会使iterator失效, 尽管最终的数目一样, 但状态已经改变了)

因此, 不能使用iterators在buffer修改时保存位置, 而应使用理想的GtkTextMark. 可以把mark看作一个不可见的光标或插入点, 它通过在buffer内浮动来保存位置. 如果包围mark的文本被删除, 此mark依然处于以前所占的位置; 如果在mark那里插入文本, mark会根据gravity来决定位于新文本的左边或右边. 从左向右读的语言的标准文本光标是一个gravity为右的mark, 因为它总是呆在插入文本的右边.

和tag一样, mark也可以有名或匿名. GtkTextBuffer有2个内建的marks: “insert”和”selection_bound”, 分别指插入点和不是插入点的那个选择项的边界. 如果没有选择文本, 那么这两个marks的位置相同.

text buffer通常至少包含一行, 但有可能是空的(即buffer可以包含0个字符). text buffer的最后一行绝不会以行分隔符结束(如newline); 其他行则以一个行分隔符结束. 在计算字符数和字符偏移时会算上行分隔符. 注意一些Unicode行分隔符在UTF-8中以多个字节表示, 2个字符序列”/r/n”也会被看成是1个行分隔符.

一个简单示例

/** File: GtkTextView演示* Author: blackboy, [e-mail]* D/T: 2010.9.29*/#include <gtk/gtk.h>int main (int argc, char *argv[]){ GtkWidget* win; GtkWidget* vbox; GtkWidget* text_view; GtkTextBuffer* buffer; GtkTextIter start, end; PangoFontDescription* font_desc; GdkColor color; GtkTextTag* tag; gtk_init (&argc, &argv); win = gtk_window_new (GTK_WINDOW_TOPLEVEL); gtk_container_set_border_width (GTK_CONTAINER (win), 1); gtk_window_set_title (GTK_WINDOW (win), "GtkTextView Demo"); gtk_window_set_position (GTK_WINDOW (win), GTK_WIN_POS_CENTER); gtk_window_set_default_size(GTK_WINDOW(win), 400,200); g_signal_connect (win, "destroy", gtk_main_quit, NULL); vbox = gtk_vbox_new(TRUE, 1); text_view = gtk_text_view_new(); buffer = gtk_text_view_get_buffer(GTK_TEXT_VIEW(text_view)); gtk_text_buffer_set_text(buffer, "Hello, this is some text", -1); /* 更改整个TextView的默认字体与颜色 */ font_desc = pango_font_description_from_string("Courier New 15"); gtk_widget_modify_font(text_view, font_desc); pango_font_description_free(font_desc); gdk_color_parse("red", &color); gtk_widget_modify_text(text_view, GTK_STATE_NORMAL, &color); /* 设置文本缩进 */ gtk_text_view_set_left_margin(GTK_TEXT_VIEW(text_view), 30); /* 利用tag更改一部分文本的背景色 */ tag = gtk_text_buffer_create_tag(buffer, "blue_foreground", "background", "yellow", NULL); gtk_text_buffer_get_iter_at_offset(buffer, &start, 7); gtk_text_buffer_get_iter_at_offset(buffer, &end, 12); gtk_text_buffer_apply_tag(buffer, tag, &start, &end); gtk_box_pack_start(GTK_BOX(vbox), text_view, FALSE, TRUE, 0); gtk_container_add(GTK_CONTAINER(win), vbox); gtk_widget_show_all (win); gtk_main (); return 0;}

1. Gtk+自带文档 X/gtk/share/gtk-doc/html/gtk/
2. GTK+初学者教程(中文) – 卢名杨译
http://zetcode.com/tutorials/gtktutorial/chinese/