基于GTK4、C与VFL的可编辑ListView实现及TreeView入门示例求助

GTK4 里替代原 TreeView 的新组件上手门槛确实不低，之前我也苦于找不到合适的入门示例。后来在社区论坛的建议帮助下，花了几个小时折腾出一个可编辑 ListView 的小型测试Demo，分享出来给有需要的开发者参考。

核心实现思路 #

• 使用 GListStore 作为数据模型，存储列表项数据
• 通过 SignalListItemFactory 创建列表项，绑定编辑逻辑
• 利用 GtkEditable 接口实现单元格内容的实时编辑

完整代码示例 #

#include <gtk/gtk.h>

// 定义列表项数据结构
typedef struct {
  gchar *text;
} ListItemData;

// 释放列表项数据
static void list_item_data_free(gpointer data) {
  ListItemData *item = data;
  g_free(item->text);
  g_free(item);
}

// 创建列表项Widget
static void setup_list_item(GtkListItemFactory *factory, GtkListItem *list_item) {
  GtkWidget *entry = gtk_entry_new();
  gtk_list_item_set_child(list_item, entry);
}

// 绑定列表项数据到Widget
static void bind_list_item(GtkListItemFactory *factory, GtkListItem *list_item) {
  GtkWidget *entry = gtk_list_item_get_child(list_item);
  ListItemData *item = gtk_list_item_get_item(list_item);
  gtk_entry_set_text(GTK_ENTRY(entry), item->text);

  // 绑定编辑信号，实时更新数据模型
  g_signal_connect(entry, "changed", G_CALLBACK(
    (void (*)(GtkEditable*, gpointer))(gtk_editable_get_text)), item);
}

int main(int argc, char *argv[]) {
  gtk_init(&argc, &argv);

  // 创建窗口
  GtkWidget *window = gtk_window_new();
  gtk_window_set_title(GTK_WINDOW(window), "GTK4 Editable ListView");
  gtk_window_set_default_size(GTK_WINDOW(window), 400, 300);
  g_signal_connect(window, "destroy", G_CALLBACK(gtk_main_quit), NULL);

  // 创建数据模型并添加测试数据
  GListStore *store = g_list_store_new(G_TYPE_POINTER);
  for (int i = 0; i < 5; i++) {
    ListItemData *item = g_new0(ListItemData, 1);
    item->text = g_strdup_printf("Item %d", i+1);
    g_list_store_append(store, item);
  }

  // 创建ListView
  GtkWidget *list_view = gtk_list_view_new(G_LIST_MODEL(store), NULL);
  GtkListItemFactory *factory = gtk_signal_list_item_factory_new();
  g_signal_connect(factory, "setup", G_CALLBACK(setup_list_item), NULL);
  g_signal_connect(factory, "bind", G_CALLBACK(bind_list_item), NULL);
  gtk_list_view_set_factory(GTK_LIST_VIEW(list_view), factory);

  // 添加滚动容器
  GtkWidget *scrolled_window = gtk_scrolled_window_new();
  gtk_scrolled_window_set_child(GTK_SCROLLED_WINDOW(scrolled_window), list_view);
  gtk_window_set_child(GTK_WINDOW(window), scrolled_window);

  gtk_widget_show(window);
  gtk_main();

  // 清理资源
  g_list_store_remove_all(store);
  g_object_unref(store);
  return 0;
}

关键部分说明 #

• 数据模型：GListStore 是GTK4推荐的列表数据存储容器，这里存储自定义的 ListItemData 结构体，包含可编辑的文本内容
• 列表项工厂：SignalListItemFactory 通过 setup 和 bind 信号分别负责创建列表项Widget和绑定数据，实现了UI和数据的解耦
• 编辑逻辑：通过绑定 GtkEntry 的 changed 信号，实时将输入内容同步到数据模型中，确保UI和数据一致性

编译命令：

gcc -o gtk4-editable-listview gtk4-editable-listview.c `pkg-config --cflags --libs gtk4`

内容的提问来源于stack exchange，提问作者Holger