Question

如何使用CSS为Gtk3在GtkTreeView中使每一行都变成不同的颜色？我尝试过使用：even-row-color，-GtkWidget-even-row-color和GtkTreeView row：nth-child（even）。我在Ubuntu natty上使用gtk + -3.2.3。

/* COMPILE WITH: gcc -Wall -o tree1 `pkg-config --cflags --libs gtk+-3.0` tree1.c */

#include <gtk/gtk.h>
enum
{
  LIST_ITEM = 0,
  N_COLUMNS
};

static void
init_list(GtkWidget *list)
{
  GtkCellRenderer *renderer;
  GtkTreeViewColumn *column;
  GtkListStore *store;

/********************  CSS  *****************************************************/

  GtkCssProvider *provider = gtk_css_provider_new ();

  gtk_css_provider_load_from_data (provider, "GtkTreeView {\n"
                                             "  -GtkWidget-even-row-color: green;\n"
                                             "  color: white;\n"
                                             "}\n", -1, NULL);

  GdkDisplay *display = gdk_display_get_default ();
  GdkScreen *screen = gdk_display_get_default_screen (display);
  gtk_style_context_add_provider_for_screen (screen,
                                             GTK_STYLE_PROVIDER (provider),
                                             GTK_STYLE_PROVIDER_PRIORITY_APPLICATION);
  g_object_unref (provider);

/*********************************************************************************/
  renderer = gtk_cell_renderer_text_new();
  column = gtk_tree_view_column_new_with_attributes("List Items",
           renderer, "text", LIST_ITEM, NULL);
  gtk_tree_view_append_column(GTK_TREE_VIEW(list), column);

  store = gtk_list_store_new(N_COLUMNS, G_TYPE_STRING);

  gtk_tree_view_set_model(GTK_TREE_VIEW(list),  GTK_TREE_MODEL(store));

  g_object_unref(store);
}

 static void
 add_to_list(GtkWidget *list, const gchar *str)
{
  GtkListStore *store;
   GtkTreeIter iter;

   store = GTK_LIST_STORE(gtk_tree_view_get_model
       (GTK_TREE_VIEW(list)));

   gtk_list_store_append(store, &iter);
   gtk_list_store_set(store, &iter, LIST_ITEM, str, -1);
}

void  on_changed(GtkWidget *widget, gpointer label)
{
  GtkTreeIter iter;
  GtkTreeModel *model;
  char *value;

  if (gtk_tree_selection_get_selected(
      GTK_TREE_SELECTION(widget), &model, &iter)) {

    gtk_tree_model_get(model, &iter, LIST_ITEM, &value,  -1);
    gtk_label_set_text(GTK_LABEL(label), value);
    g_free(value);
  }
}

int main (int argc, char *argv[])
{
  GtkWidget *window;
  GtkWidget *list;
  GtkWidget *vbox;
  GtkWidget *label;
  GtkTreeSelection *selection;

  gtk_init(&argc, &argv);

  window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
  gtk_window_set_position(GTK_WINDOW(window), GTK_WIN_POS_CENTER);
  gtk_container_set_border_width(GTK_CONTAINER(window), 10);
  gtk_widget_set_size_request(window, 270, 250);
  gtk_window_set_title(GTK_WINDOW(window), "List View");

  list = gtk_tree_view_new();
  gtk_tree_view_set_headers_visible(GTK_TREE_VIEW(list), FALSE);

  vbox = gtk_vbox_new(FALSE, 0);
  gtk_box_pack_start(GTK_BOX(vbox), list, TRUE, TRUE, 5);

  label = gtk_label_new("");
 gtk_label_set_justify(GTK_LABEL(label), GTK_JUSTIFY_CENTER);
  gtk_box_pack_start(GTK_BOX(vbox), label, FALSE, FALSE, 5);

  gtk_container_add(GTK_CONTAINER(window), vbox);

  init_list(list);
  add_to_list(list, "First");
  add_to_list(list, "Second");
  add_to_list(list, "Third");
  add_to_list(list, "Fourth");
  add_to_list(list, "Fifth");

  selection = gtk_tree_view_get_selection(GTK_TREE_VIEW(list));

  g_signal_connect(selection, "changed",
      G_CALLBACK(on_changed), label);

  g_signal_connect(G_OBJECT (window), "destroy",
      G_CALLBACK(gtk_main_quit), NULL);

  gtk_widget_show_all(window);
  gtk_main ();
  return 0;
}

Answer 1

您可能必须首先启用交替颜色，使用：

gtk_tree_view_set_rules_hint(GTK_TREE_VIEW(list), TRUE);

我不确定这一点，因为我还没有使用过GTK 3 CSS。

Answer 2

列标题实际上是一个按钮。它现在可以进行以下更改：

gtk_css_provider_load_from_data (provider, "column-header .button {\n"
                                         "  background-color: green;\n"
                                         "  color: red;\n"
                                         "}\n", -1, NULL);

gtk_tree_view_set_headers_visible(GTK_TREE_VIEW(list), TRUE);

我在这里找到了它：http://gnomejournal.org/article/107/styling-gtk-with-css

在Gtk3中使用CSS的GtkTreeView

2 个答案: