Question

配置是Ubunutu Server 18.04 LTS / Xorg / openbox / GTK3

我一直在努力弄清楚为什么我不能让GtkCssProvider在最基本的项目上工作。如果一直在使用不同的例子，但这里有一个类似于另一个帖子。

以下是显示标签的应用代码。

#include <gtk/gtk.h>

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

GtkWidget *         window          = gtk_window_new(GTK_WINDOW_TOPLEVEL);
GtkWidget *         label           = gtk_label_new("Label 0123456789");
GtkCssProvider *    cssProvider     = gtk_css_provider_new();

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

if( gtk_css_provider_load_from_path(cssProvider, "csstest.css", NULL) )
{
     gtk_style_context_add_provider(gtk_widget_get_style_context(label),
                                        GTK_STYLE_PROVIDER(cssProvider),
                                        GTK_STYLE_PROVIDER_PRIORITY_USER);

    gtk_container_add(GTK_CONTAINER(window), label);
    gtk_widget_show_all(window);

    gtk_main();
}

return 0;
}

.CSS文件很简单：

GtkLabel {
    color: green;
}

一篇帖子表示应该用gtk_style_context_add_provider_for_screen（）调用替换gtk_style_context_add_provider（）。似乎都没有任何效果。标签显示为灰色的默认黑色样式。那么将Css样式应用于窗口小部件的技巧是什么呢。

我的要求是设置不同的样式，我可以设置不同的小部件。我假设我可以在Css中创建某种类型的类构造，这将允许我通过gtk_style_context_add_provider（）调用将不同的主题应用于同一个小部件。但是，我也无法弄明白。我看到如何在Css中为特定的命名小部件（通过ID）设置样式，但这似乎只是一个预定义的statc定义。对此提出任何建议都会有所帮助。

Answer 1

标签的CSS选择器为label，而不是GtkLabel：

label {
    color: green;
}

请参阅列出有效选择器的GtkLabel API reference。

您还应该使用GTK Inspector来测试CSS片段。

您可能还想阅读API reference以获取GTK中的CSS处理以及GtkStyleContext文档。

Answer 2

感谢ebassi澄清对css的更改。我不应该从一个较老的例子开始。以下是在GTK 3.22中使用的完整示例我最终使用CSS样式演示了外观的动态变化：

#include <gtk/gtk.h>

GtkWidget *         label1;
GtkWidget *         label2;
GtkWidget *         label3;

// Handler to change the appearance of the widgets from their original
void button_clicked (GtkButton * button, gpointer   user_data)
{

    // names are defined in the .CSS
    gtk_widget_set_name( GTK_WIDGET(label1) , "" );
    gtk_widget_set_name( GTK_WIDGET(label2) , "white-widget" );
    gtk_widget_set_name( GTK_WIDGET(label3) , "red-widget" );
}

// Set the style provider for the widgets
static void apply_css_provider (GtkWidget * widget, GtkCssProvider * cssstyleProvider)
{
    gtk_style_context_add_provider ( gtk_widget_get_style_context(widget), GTK_STYLE_PROVIDER(cssstyleProvider) , GTK_STYLE_PROVIDER_PRIORITY_USER );

    // For container widgets, apply to every child widget on the container
    if (GTK_IS_CONTAINER (widget))
    {
        gtk_container_forall( GTK_CONTAINER (widget), (GtkCallback)apply_css_provider , cssstyleProvider);
    }
}

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

    GtkWidget *         window          = gtk_window_new(GTK_WINDOW_TOPLEVEL);
    GtkCssProvider *    cssProvider     = gtk_css_provider_new();
    GtkWidget *         fixed           = gtk_fixed_new();
    GtkWidget *         button          = gtk_button_new_with_label ("Change");

    //create the labels for this test
    label1  = gtk_label_new("Label 0001");
    label2  = gtk_label_new("Label 23456789");
    label3  = gtk_label_new("Label 3");

    //setup container and add widgets
    gtk_container_add (GTK_CONTAINER (window), fixed);

    gtk_fixed_put( GTK_FIXED(fixed), label1 , 30 , 30 );
    gtk_fixed_put( GTK_FIXED(fixed), label2 , 30 , 50 );
    gtk_fixed_put( GTK_FIXED(fixed), label3 , 30 , 70 );
    gtk_fixed_put( GTK_FIXED(fixed), button , 30 , 110 );

    //register the handlers
    g_signal_connect(window, "destroy", G_CALLBACK(gtk_main_quit), NULL);
    g_signal_connect(button, "clicked", G_CALLBACK(button_clicked), NULL );


    if( gtk_css_provider_load_from_path(cssProvider, "csstest.css", NULL) )
    {
        apply_css_provider( window , cssProvider );

        // set a default style - name is defined in .CSS file
        gtk_widget_set_name( GTK_WIDGET(label1) , "red-widget" );

        gtk_widget_show_all(window);

        gtk_main();
    }

    return 0;
}

csstest.css：

/* default coloring of widgets */
* {
    background-color: #00ee00;    
}

#red-widget {
    color: white;
    background-color: red;
}

#white-widget {
    color: red;
    background-color: white;
}

button {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    background-image: none;
}

GTK3 GtkCssProvider无法正常工作

2 个答案: