如何用CSS改变GTK3(c语言)中孩子的背景颜色

时间:2017-01-13 16:57:35

标签: css c gtk3

就像标题所说,我正在开发一个应用程序,我需要设置所有4个孩子的背景,但我不知道该怎么做。

这是一个示例,它解释了App的外观: enter image description here

我需要改变这样的背景:

  • 一个 - 应该是红色
  • 两个 - 应该是黄色
  • 三 - 应该是绿色
  • 四 - 应该是蓝色

以下是代码:

#include <gtk/gtk.h>

int main(int argc, char *argv[]){
        //---------- CSS -------------
    GtkCssProvider *provider;
    GdkDisplay *display;
    GdkScreen *screen;
    //---------------------------

    GtkWidget *window;
    GtkWidget *child, *child2, *child3, *child4;
    GtkWidget *grid;

    gtk_init(&argc, &argv);

    window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
    gtk_window_set_title(GTK_WINDOW(window), "Equalizer");
    gtk_window_set_default_size(GTK_WINDOW(window), 400, 250);
    gtk_container_set_border_width(GTK_CONTAINER(window), 5);
    g_signal_connect(window, "destroy", G_CALLBACK(gtk_main_quit), NULL);

    // ---------------------------------------------------- CSS -----------------------------------------------------------
    provider = gtk_css_provider_new ();
    display = gdk_display_get_default ();
    screen = gdk_display_get_default_screen (display);
    gtk_style_context_add_provider_for_screen (screen, GTK_STYLE_PROVIDER (provider), GTK_STYLE_PROVIDER_PRIORITY_APPLICATION);

    const gchar *myCssFile = "mystyle.css";
    GError *error = 0;

    gtk_css_provider_load_from_file(provider, g_file_new_for_path(myCssFile), &error);
    g_object_unref (provider);
    // --------------------------------------------------------------------------------------------------------------------

    grid = gtk_grid_new ();
    gtk_container_add (GTK_CONTAINER (window), grid);

    child = gtk_label_new ("One");
    gtk_grid_attach (GTK_GRID (grid), child, 0, 1, 1, 1);

    child2 = gtk_label_new ("Two");
    g_object_set (child, "margin", 55, NULL);
    gtk_grid_attach_next_to (GTK_GRID (grid), child2, child, GTK_POS_RIGHT, 50, 50);


    child3 = gtk_label_new ("Three");
    g_object_set (child3, "margin", 55, NULL);
    gtk_grid_attach_next_to (GTK_GRID (grid), child3, child2, GTK_POS_RIGHT, 50, 50);

    child4 = gtk_label_new ("Four");
    g_object_set (child4, "margin", 0, NULL);
    gtk_grid_attach_next_to (GTK_GRID (grid), child4, child3, GTK_POS_RIGHT, 50, 50);


    gtk_widget_show_all(window);
    gtk_main();
}

和CSS文件:

* {
    background-color: yellow;
}

GtkWindow {
    background-color: green;
    border-width: 3px;
    border-color: blue;
}

如何使用GTK3CSS中执行此操作?

1 个答案:

答案 0 :(得分:6)

您可能需要为每个小部件命名,以便按ID提供样式,例如: #child3

在这种情况下,您需要设置的名称为child3

void
gtk_widget_set_name (GtkWidget *widget,
                     const gchar *name);

https://developer.gnome.org/gtk3/stable/GtkWidget.html#gtk-widget-set-name