Question

My latest head-scratcher is to build a silly little app in Python3 using GTK3, with colours other than fog-grey on the buttons. I have spent the last few days googling for how to do this, and so far everything I have tried has failed. Not just failed, but failed silently, with no error messages to give me any clue as to what is going on.

This is my test app:

from gi.repository import Gtk, Gdk

class ButtonWindow(Gtk.Window):

    def __init__(self):
        super().__init__(title="Button Test")
        self.set_border_width(10)
        hbox = Gtk.Box(spacing=10)
        self.add(hbox)
        hbox.set_homogeneous(False)

        # make the button
        button = Gtk.Button('Test Button')
        hbox.pack_start(button, True, True, 0)

        # try to change its colour ....

#        button.modify_base(Gtk.StateType.NORMAL, Gdk.color_parse('green'))
#        button.override_background_color(Gtk.StateType.NORMAL, Gdk.RGBA(0, 1, 0, 1))
#        button.override_background_color(Gtk.StateType.NORMAL, Gdk.RGBA(0x00ff00))
#        button.modify_bg(Gtk.StateType.NORMAL, Gdk.color_parse("green"))
#        button.modify_bg(Gtk.StateType.ACTIVE, Gdk.color_parse("green"))
#        button.modify_bg(Gtk.StateType.SELECTED, Gdk.color_parse("green"))

        # attempt to change the style ....

#        style = button.get_style().copy()
#        style.bg[Gtk.StateType.NORMAL] = Gdk.color_parse('green')
#        style.bg[Gtk.StateType.ACTIVE] = Gdk.color_parse('red')
#        style.bg[Gtk.StateType.SELECTED] = Gdk.color_parse('blue')
#        style.bg[Gtk.StateType.PRELIGHT] = Gdk.color_parse('black')
#        button.set_style(style)

        # ok, let's try changing the box ....

#        hbox.modify_base(Gtk.StateType.NORMAL, Gdk.color_parse('green'))
#        hbox.override_background_color(Gtk.StateType.NORMAL, Gdk.RGBA(0,1,0,1))
#        hbox.override_background_color(Gtk.StateType.NORMAL, Gdk.RGBA(0x00ff00ff))
#        hbox.modify_bg(Gtk.StateType.NORMAL, Gdk.color_parse('green'))

window = ButtonWindow()        
window.connect("delete-event", Gtk.main_quit)
window.show_all()
Gtk.main()

I have left my failed attempts in as comments. As noted above, as far as the application is concerned, it appears to have worked, because none of the above variations generate any error messages. However, none of them seem to work for me, because the buttons remain the colour of stale dishwater.

FYI I am using Python 3.2.3 under Ubuntu 12.04 with python3-gi and python3-gi-cairo installed from the standard repository.

Can someone please point me in the right direction?

EDIT: The following is a re-worked example based on @mike’s answer. This works, but there are some issues with it, possibly to be addressed in some follow-up questions. The issues are:

1. Why does background have to used on Ubuntu instead of background-color, and then only for the button?
2. I still have some problems getting font styling to work, but at least now I have a working example to play with.
3. Can different styles/colours be applied to different buttons, e.g. on the basis of the text or some other attribute?

So, the code:-

from gi.repository import Gtk, Gdk

class ButtonWindow(Gtk.Window):

    def __init__(self):
        super().__init__(title="Button Test")
        self.set_border_width(10)

        hbox = Gtk.Box(spacing=10)
        self.add(hbox)
        hbox.set_homogeneous(False)

        # make the button
        button = Gtk.Button('Test Button')
        hbox.pack_start(button, True, True, 0)

# get the style from the css file and apply it
cssProvider = Gtk.CssProvider()
cssProvider.load_from_path('gtkStyledButtonTest.css')
screen = Gdk.Screen.get_default()
styleContext = Gtk.StyleContext()
styleContext.add_provider_for_screen(screen, cssProvider,
                                     Gtk.STYLE_PROVIDER_PRIORITY_USER)

window = ButtonWindow()        
window.connect("delete-event", Gtk.main_quit)
window.show_all()
Gtk.main()

and the css file looks like this:-

GtkWindow {
    background-color: #0000ff;
}

GtkButton {
    color: #ff0000;
    background: #00ff00;
}

I hope someone finds this useful.

Answer 1

The preferred way in GTK3 is to use CSS for styling. Under Ubuntu 12.04 you may need to use background instead of background-color. But I don’t know Python so I’ll just give a link.

https://thegnomejournal.wordpress.com/2011/03/15/styling-gtk-with-css/