How to make buttons different colours in Python GTK3 (using gi)?

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 h

Answer 1

Even though this is a old question, I'd like to add an answer referring to question 3 just for the reference.

GTK3 adds the concept of style classes. So to get different colored buttons you can address them directly be name or add a style class to its context. All this is explained in the links mike provided in his answer.

Here is a simple example how to use style classes to highlight invalid text in entries:

from gi.repository import Gtk, Gdk

class MainWindow(Gtk.Window):

    def __init__(self):
        super().__init__()
        vbox = Gtk.Box(spacing=10,orientation=Gtk.Orientation.VERTICAL)
        self.add(vbox)

        self.entries = [ Gtk.Entry() for i in range(3) ]
        for e in self.entries:
            vbox.pack_start(e, True, True, 0)
            e.connect("changed", self.on_entry_changed)
            e.set_text('123')

        button=Gtk.Button('ok',name='ok-button')
        vbox.pack_end(button,True,True,0)


    def on_entry_changed(self,entry):
        ctx = entry.get_style_context()
        if not entry.get_text().isnumeric():
            ctx.add_class('invalid')
        else:
            ctx.remove_class('invalid')


cssProvider = Gtk.CssProvider()
cssProvider.load_from_path('style.css')
screen = Gdk.Screen.get_default()
styleContext = Gtk.StyleContext()
styleContext.add_provider_for_screen(screen, cssProvider,
                                     Gtk.STYLE_PROVIDER_PRIORITY_USER)

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

with style.css:

GtkEntry.invalid {
    background-color: #ffaaaa;
    background: #ffaaaa;
}

GtkButton#ok-button {
    background-color: green;
    background: green;
}

Answer 2

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/

Answer 3

Inspired by @boosth, this is the modified code (wrap the button, and apply the colour to the wrapper - see lines commented with # <----).

However, while it changes the colour of the event box, the button itself remains the same. So, this is NOT what I was looking for, but so far this is the best answer.

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')
        buttonWrapper = Gtk.EventBox()                  # <----
        buttonWrapper.add(button)                       # <----
        hbox.pack_start(buttonWrapper, True, True, 0)   # <----

        # change the colour of the wrapper ....
        buttonWrapper.modify_bg(Gtk.StateType.NORMAL, Gdk.color_parse("green"))
        buttonWrapper.modify_bg(Gtk.StateType.ACTIVE, Gdk.color_parse("red"))
        buttonWrapper.modify_bg(Gtk.StateType.SELECTED, Gdk.color_parse("blue"))


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

There must be a way to do this....