/* *********************************************************
* lgx_storeview module version 1.0 manual
* edited by LGX. based on GTK 2.
* 2010.01.15
*
http://leadgenius.cublog.cn/*
*
current version 0.9.1
*
* 1、通过一个结构数组定义stroe和treeview显示
* 2、支持文本、整数、toggle控件、combox控件和图片样式的列column
* 3、支持可编辑cell/column的修改更新
* 4、自动记录行row的添加/修改状态标记,支持标记列的显示
* 5、可自定义column宽度,支持宽度自适应
* 6、column可拖动调整宽度
* 7、鼠标点击列排序
* 8、支持列的edit/activate/sensitive属性的设置
* 9、目前只支持基于liststore的treeview,简单的行列表形式
* 10、最大支持255列
*
* a、每种属性和设置直接针对一列应用,丧失treeview的可对每个row^column(cell)的属性控制能力。
* **********************************************************/
说明:
一、定义结构
typedef struct STORVIEW_DATA {
GType column_type; // store field data type
gchar *column_name; // column text
gint column_size; // column width. >0 the fixed. auto when =0
unsigned int attr; // column type and attributions
void *udata; // user data. see example
StoreView_ChgCallback ucallback; // a user call back
}StorView_data;
GtkTreeView * liststoreview_new(guint dnum, StorView_data *data, guint type);
二、简单例子
StorView_data exampleSVdata[] = {
{G_TYPE_STRING, "编号", 70, SVCOL_TEXT, NULL, NULL},
{G_TYPE_STRING, "姓名", 100, SVCOL_TEXT|SVCOL_EDITABLE, NULL, NULL},
{G_TYPE_STRING, "电话", 70, SVCOL_TEXT|SVCOL_EDITABLE|SVCOL_SORTABLE, NULL, NULL},
{G_TYPE_STRING, "地址", 0, SVCOL_TEXT|SVCOL_RESZABLE, NULL, NULL},
{G_TYPE_STRING, "adder", 0, SVCOL_INVISIABLE, NULL, NULL},
{G_TYPE_STRING, "addtime", 0, SVCOL_INVISIABLE, NULL, NULL}
};
GtkTreeView * lgx_listview;
lgx_listview = liststoreview_new(sizeof(exampleSVdata)/sizeof(*exampleSVdata), exampleSVdata, SVTYPE_NOFLAG);
这个例子生成一个6个字段的liststore,并且显示编号、姓名、电话、地址4个列的treeview。
store的type全是G_TYPE_STRING。
SVCOL_TEXT|SVCOL_EDITABLE|SVCOL_SORTABLE表示text类型的column显示,并且可直接编辑可通过鼠标点击列头部分进行排序。
SVCOL_INVISIABLE表示这一列只在liststore中存在,但并不显示在view中。其他属性忽略。
// 获得model
GtkTreeModel *model = gtk_tree_view_get_model (lgx_listview);
// 获得store
GtkListStore *store = GTK_LIST_STORE (model);
就可以操作treeview的显示内容了
// 取得修改标记列序号,按照习惯也可以用对store的枚举数值
gint colmaxnum = gtk_tree_model_get_n_columns(model);
colmaxnum列中记录每一行的修改状态,如下:
SVCOL_ST_EDITED:行已经被修改过
SVCOL_ST_APPEND:新添加的行
SVCOL_ST_REMOVE:行已经删除,用于假删除需要
状态值可或操作。
三、其他的定义
// new一个LGX storeview widget
GtkTreeView * liststoreview_new(guint dnum, StorView_data *data, guint type);
type取值为:
SVTYPE_NOFLAG:不显示操作标记列
SVTYPE_CHRFLAG:显示操作标记列,并以字符标明行的修改状态
SVTYPE_STRFLAG:显示操作标记列,并以文本标明行的修改状态
SVTYPE_PICFLAG:显示操作标记列,并以图标标明行的修改状态
目前v1.0只有 SVTYPE_NOFLAG和SVTYPE_CHRFLAG。
// 查看LGX storeview是否有所修改,返回1已经修改,0没有修改
gint liststoreview_model_ischanged(GtkTreeModel *model);
gint liststoreview_treeview_ischanged(GtkTreeView *treeview);
四、另一个例子
StorView_data exampleSVdata[] = {
{G_TYPE_UINT, "编号", 70, SVCOL_TEXT|SVCOL_DESENSABLE, NULL, NULL},
{G_TYPE_STRING, "姓名", 100, SVCOL_TEXT|SVCOL_EDITABLE|SVCOL_RESZABLE, NULL, NULL},
{G_TYPE_STRING, "电话", 70, SVCOL_TEXT|SVCOL_EDITABLE|SVCOL_SORTABLE, NULL, NULL},
{G_TYPE_STRING, "性别", 0, SVCOL_COMBO, NULL, NULL},
{G_TYPE_BOOLEAN, "可见?", 0, SVCOL_TOGGLE|SVCOL_DEACTIABLE, NULL, NULL},
{G_TYPE_OBJECT, "醒目:)", 0, SVCOL_PIXBUF, NULL, NULL}
};
SVCOL_PIXBUF列column对应的store中放入GdkPixbuf的指针就行。
SVCOL_COMBO列column在new之后通过udata返回一个gtk_list_store_new (1, G_TYPE_STRING)的指针,向这个store中append数据加入下拉内容。
五、代码
在MinGW2.0下编译运行通过。
lgx_listview = liststoreview_new(sizeof(exampleSVdata)/sizeof(*exampleSVdata), exampleSVdata, SVTYPE_CHRFLAG);
gtk_container_add (GTK_CONTAINER (scrollw), (GtkWidget *)lgx_listview);
// Add some data into storeview here.
GtkTreeModel *model;
GtkListStore *store;
GtkTreeIter iter;
//// fill combox contents
store = (GtkListStore *)exampleSVdata[EXPSV_COL_COMBOX].udata;
gtk_list_store_append (store, &iter);
gtk_list_store_set (store, &iter, 0, g_locale_to_utf8("男", -1,NULL,NULL,NULL), -1);
gtk_list_store_append (store, &iter);
gtk_list_store_set (store, &iter, 0, g_locale_to_utf8("女", -1,NULL,NULL,NULL), -1);
gtk_list_store_append (store, &iter);
gtk_list_store_set (store, &iter, 0, g_locale_to_utf8("二", -1,NULL,NULL,NULL), -1);
model = gtk_tree_view_get_model(lgx_listview);
store = GTK_LIST_STORE (model);
gtk_list_store_append (store, &iter);
gtk_list_store_set (store, &iter,
EXPSV_COL_UINT, 1,
EXPSV_COL_STR1, g_locale_to_utf8("酱油甲", -1,NULL,NULL,NULL),
EXPSV_COL_STR2, g_locale_to_utf8("123456", -1,NULL,NULL,NULL),
EXPSV_COL_COMBOX, g_locale_to_utf8("男", -1,NULL,NULL,NULL),
EXPSV_COL_TOGGLE, TRUE,
EXPSV_COL_PIC, gtk_image_get_pixbuf (GTK_IMAGE(gtk_image_new_from_file (FRIDAYBOX_ICON))),
-1);
在看這篇之前,請先看過GtkComboBox 與 GtkListStore,由於以Model-View的方式設計,您可以在不修改Model的情況下,為Model換上另一個顯示的外觀(View),例如為 GtkComboBox 與 GtkListStore範例中建立的GtkListStore換上GtkTreeView的外觀。
具體來說,也就是該範例中的createModel()內容無需改變,將GtkComboBox的相對應程式碼,換成建立GtkTreeView的程式碼,例如:
GtkWidget *treeView = gtk_tree_view_new_with_model(createModel());
GtkCellRenderer *renderer = gtk_cell_renderer_pixbuf_new();
GtkTreeViewColumn *column = gtk_tree_view_column_new_with_attributes(
"Icon", renderer,
"pixbuf", PIXBUF_COL,
NULL);
gtk_tree_view_append_column(GTK_TREE_VIEW (treeView), column);
renderer = gtk_cell_renderer_text_new();
column = gtk_tree_view_column_new_with_attributes(
"Filename", renderer,
"text", TEXT_COL,
NULL);
gtk_tree_view_append_column(GTK_TREE_VIEW (treeView), column);
GtkTreeViewColumn是GtkTreeView中的列代表,可用以設定該列的內容如何繪製以及一些相關屬性,基本上以上程式片段
中,gtk_tree_view_column_new_with_attributes()與
gtk_tree_view_append_column()函式可以用
gtk_tree_view_insert_column_with_attributes()函式來簡化,也就是可以簡化為:
GtkWidget *treeView = gtk_tree_view_new_with_model(createModel());
GtkCellRenderer *renderer = gtk_cell_renderer_pixbuf_new();
gtk_tree_view_insert_column_with_attributes(
GTK_TREE_VIEW(treeView), -1, "Icon", renderer,
"pixbuf", PIXBUF_COL,
NULL);
renderer = gtk_cell_renderer_text_new();
gtk_tree_view_insert_column_with_attributes(
GTK_TREE_VIEW(treeView), -1, "Filename", renderer,
"text", TEXT_COL,
NULL);
在GtkTreeView當中的選擇,是以為個GtkTreeSelection物件作代表,當選擇改變時,會發出"changed"的Signal,所以要連結Signal與Callback函式,可以如下進行:
GtkTreeSelection *selection = gtk_tree_view_get_selection(GTK_TREE_VIEW(treeView));
g_signal_connect(G_OBJECT(selection), "changed",
G_CALLBACK(selection_changed), label);
至於Callback函式的部份大同小異,您要從傳遞的GtkTreeSelection中取得GtkTreeView,從
GtkTreeView中取得
GtkTreeModel,再使用gtk_tree_selection_get_selected()將GtkTreeIter指向選中的列,以取得您
想取得的欄位資料:
gboolean selection_changed(GtkTreeSelection *selection, GtkLabel *label) {
GtkTreeView *treeView;
GtkTreeModel *model;
GtkTreeIter iter;
gchar *active;
treeView = gtk_tree_selection_get_tree_view(selection);
model = gtk_tree_view_get_model(treeView);
gtk_tree_selection_get_selected(selection, &model, &iter);
gtk_tree_model_get(model, &iter,
1, &active,
-1);
gtk_label_set_text(label, active);
}
下面的範例是以上說明的綜合示範:
gtk_tree_view_demo.c#include
enum {
PIXBUF_COL,
TEXT_COL
};
GtkTreeModel* createModel() {
const gchar *files[] = {"caterpillar.jpg", "momor.jpg",
"hamimi.jpg", "bush.jpg"};
GdkPixbuf *pixbuf;
GtkTreeIter iter;
GtkListStore *store;
gint i;
store = gtk_list_store_new(2, GDK_TYPE_PIXBUF, G_TYPE_STRING);
for(i = 0; i < 4; i++) {
pixbuf = gdk_pixbuf_new_from_file(files[i], NULL);
gtk_list_store_append(store, &iter);
gtk_list_store_set(store, &iter,
PIXBUF_COL, pixbuf,
TEXT_COL, files[i],
-1);
gdk_pixbuf_unref(pixbuf);
}
return GTK_TREE_MODEL(store);
}
gboolean selection_changed(GtkTreeSelection *selection, GtkLabel *label) {
GtkTreeView *treeView;
GtkTreeModel *model;
GtkTreeIter iter;
gchar *active;
treeView = gtk_tree_selection_get_tree_view(selection);
model = gtk_tree_view_get_model(treeView);
gtk_tree_selection_get_selected(selection, &model, &iter);
gtk_tree_model_get(model, &iter,
1, &active,
-1);
gtk_label_set_text(label, active);
}
int main(int argc, char *argv[]) {
GtkWidget *window;
GtkWidget *treeView;
GtkCellRenderer *renderer;
GtkTreeViewColumn *column;
GtkWidget *label;
GtkWidget *vbox;
GtkTreeSelection *selection;
gtk_init(&argc, &argv);
window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
gtk_window_set_title(GTK_WINDOW(window), "GtkTreeView");
gtk_window_set_default_size(GTK_WINDOW(window), 200, 50);
treeView = gtk_tree_view_new_with_model(createModel());
renderer = gtk_cell_renderer_pixbuf_new();
column = gtk_tree_view_column_new_with_attributes(
"Icon", renderer,
"pixbuf", PIXBUF_COL,
NULL);
gtk_tree_view_append_column(GTK_TREE_VIEW (treeView), column);
renderer = gtk_cell_renderer_text_new();
column = gtk_tree_view_column_new_with_attributes(
"Filename", renderer,
"text", TEXT_COL,
NULL);
gtk_tree_view_append_column(GTK_TREE_VIEW (treeView), column);
label = gtk_label_new("caterpillar.jpg");
vbox = gtk_vbox_new(FALSE, 5);
gtk_box_pack_start(GTK_BOX(vbox), treeView, TRUE, TRUE, 5);
gtk_box_pack_start(GTK_BOX(vbox), label, TRUE, TRUE, 5);
gtk_container_add(GTK_CONTAINER(window), vbox);
selection = gtk_tree_view_get_selection(GTK_TREE_VIEW(treeView));
g_signal_connect(G_OBJECT(selection), "changed",
G_CALLBACK(selection_changed), label);
g_signal_connect(GTK_OBJECT(window), "destroy",
G_CALLBACK(gtk_main_quit), NULL);
gtk_widget_show_all(window);
gtk_main();
return 0;
}
一個執行的結果畫面如下所示:
有了以上的基礎,要在GtkTreeView搭配GtkTreeStore就沒什麼好解釋的了,下面這個範例,只是將範例中的createModel()函式,換成GtkComboBox 與 GtkTreeStore中的createModel()函式,剩下的都沒有改變,也就是為GtkComboBox 與 GtkTreeStore 中的Model換上GtkTreeView的外觀顯示:
gtk_tree_view_with_tree_store.c#include
enum {
PIXBUF_COL,
TEXT_COL
};
GtkTreeModel* createModel() {
const gchar *files[] = {"caterpillar.jpg", "momor.jpg",
"hamimi.jpg", "bush.jpg"};
gchar *stocks[] = {
GTK_STOCK_DIALOG_WARNING,
GTK_STOCK_STOP,
GTK_STOCK_NEW,
GTK_STOCK_CLEAR,
GTK_STOCK_OPEN
};
gchar *stockNames[] = {
"WARNING",
"STOP",
"NEW",
"GTK_STOCK_CLEAR",
"GTK_STOCK_OPEN"
};
GtkWidget *cellView;
GdkPixbuf *pixbuf;
GtkTreeIter iter1, iter2;
GtkTreeStore *store;
gint i, j, s;
store = gtk_tree_store_new(2, GDK_TYPE_PIXBUF, G_TYPE_STRING);
cellView = gtk_cell_view_new();
for(i = 0; i < 4; i++) {
pixbuf = gdk_pixbuf_new_from_file(files[i], NULL);
gtk_tree_store_append(store, &iter1, NULL);
gtk_tree_store_set(store, &iter1,
PIXBUF_COL, pixbuf,
TEXT_COL, files[i],
-1);
gdk_pixbuf_unref(pixbuf);
for(j = 0; j < 3; j++) {
s = rand() % 5;
pixbuf = gtk_widget_render_icon(cellView, stocks[s],
GTK_ICON_SIZE_BUTTON, NULL);
gtk_tree_store_append(store, &iter2, &iter1);
gtk_tree_store_set(store, &iter2,
PIXBUF_COL, pixbuf,
TEXT_COL, stockNames[s],
-1);
gdk_pixbuf_unref(pixbuf);
}
}
return GTK_TREE_MODEL(store);
}
gboolean selection_changed(GtkTreeSelection *selection, GtkLabel *label) {
GtkTreeView *treeView;
GtkTreeModel *model;
GtkTreeIter iter;
gchar *active;
treeView = gtk_tree_selection_get_tree_view(selection);
model = gtk_tree_view_get_model(treeView);
gtk_tree_selection_get_selected(selection, &model, &iter);
gtk_tree_model_get(model, &iter,
1, &active,
-1);
gtk_label_set_text(label, active);
}
int main(int argc, char *argv[]) {
GtkWidget *window;
GtkWidget *treeView;
GtkCellRenderer *renderer;
GtkTreeViewColumn *column;
GtkWidget *label;
GtkWidget *vbox;
GtkTreeSelection *selection;
gtk_init(&argc, &argv);
window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
gtk_window_set_title(GTK_WINDOW(window), "GtkTreeView");
gtk_window_set_default_size(GTK_WINDOW(window), 200, 50);
treeView = gtk_tree_view_new_with_model(createModel());
renderer = gtk_cell_renderer_pixbuf_new();
column = gtk_tree_view_column_new_with_attributes(
"Icon", renderer,
"pixbuf", PIXBUF_COL,
NULL);
gtk_tree_view_append_column(GTK_TREE_VIEW (treeView), column);
renderer = gtk_cell_renderer_text_new();
column = gtk_tree_view_column_new_with_attributes(
"Filename", renderer,
"text", TEXT_COL,
NULL);
gtk_tree_view_append_column(GTK_TREE_VIEW (treeView), column);
label = gtk_label_new("caterpillar.jpg");
vbox = gtk_vbox_new(FALSE, 5);
gtk_box_pack_start(GTK_BOX(vbox), treeView, TRUE, TRUE, 5);
gtk_box_pack_start(GTK_BOX(vbox), label, TRUE, TRUE, 5);
gtk_container_add(GTK_CONTAINER(window), vbox);
selection = gtk_tree_view_get_selection(GTK_TREE_VIEW(treeView));
g_signal_connect(G_OBJECT(selection), "changed",
G_CALLBACK(selection_changed), label);
g_signal_connect(GTK_OBJECT(window), "destroy",
G_CALLBACK(gtk_main_quit), NULL);
gtk_widget_show_all(window);
gtk_main();
return 0;
}