Gtk Progress Bar Color

Question

I am trying (and failing) to set the color of a progress bar using Python 3 and Gtk. I've tried on both Ubuntu 16.04 (Python 3.5 and Gtk 3.18.9) and 18.04 (Python 3.6 and Gtk 3.22.30). The code below is lifted directly from the Gtk Tutorial with a small snippet of css added from GtkProgressBar with CSS for progress colour not functioning.

The two images below show what I mean. These are 2 screen shots of the same running program. All I am doing is clicking between the terminal window and gtk window.

On Ubuntu 18.04, the progress bar color does not change to green unless I set focus away from the Gtk Window. The image below shows what I mean - the focus is on the terminal window.

In the image below, the focus is on the Gtk window, and the progress bar color remains the default color - orange.

On Ubuntu 16.04, the progress bar color does not change to green, ever.

Is this a bug in Gtk, or am I missing something?

'''example from https://python-gtk-3-tutorial.readthedocs.io/en/latest/progressbar.html'''

import gi
gi.require_version('Gtk', '3.0')
from gi.repository import Gtk, GLib, Gdk

print("Gtk Version Information: major:{0}, minor:{1}, micro: {2}".format(Gtk.MAJOR_VERSION, Gtk.MINOR_VERSION, Gtk.MICRO_VERSION))

class ProgressBarWindow(Gtk.Window):

    def __init__(self):
        Gtk.Window.__init__(self, title="ProgressBar Demo")
        self.set_border_width(10)

        vbox = Gtk.Box(orientation=Gtk.Orientation.VERTICAL, spacing=6)
        self.add(vbox)

        self.progressbar = Gtk.ProgressBar()
        vbox.pack_start(self.progressbar, True, True, 0)

        button = Gtk.CheckButton("Show text")
        button.connect("toggled", self.on_show_text_toggled)
        vbox.pack_start(button, True, True, 0)

        button = Gtk.CheckButton("Activity mode")
        button.connect("toggled", self.on_activity_mode_toggled)
        vbox.pack_start(button, True, True, 0)

        button = Gtk.CheckButton("Right to Left")
        button.connect("toggled", self.on_right_to_left_toggled)
        vbox.pack_start(button, True, True, 0)

        self.timeout_id = GLib.timeout_add(50, self.on_timeout, None)
        self.activity_mode = False

        #css code from https://stackoverflow.com/questions/48097764/gtkprogressbar-with-css-for-progress-colour-not-functioning
        css = b'''
                progressbar > trough > progress {
                background-color: green;
                }
        '''
        css_provider = Gtk.CssProvider()
        css_provider.load_from_data(css)
        context = Gtk.StyleContext()
        screen = Gdk.Screen.get_default()
        context.add_provider_for_screen(screen, css_provider, Gtk.STYLE_PROVIDER_PRIORITY_APPLICATION)

    def on_show_text_toggled(self, button):
        show_text = button.get_active()
        if show_text:
            text = "some text"
        else:
            text = None
        self.progressbar.set_text(text)
        self.progressbar.set_show_text(show_text)

    def on_activity_mode_toggled(self, button):
        self.activity_mode = button.get_active()
        if self.activity_mode:
            self.progressbar.pulse()
        else:
            self.progressbar.set_fraction(0.0)

    def on_right_to_left_toggled(self, button):
        value = button.get_active()
        self.progressbar.set_inverted(value)

    def on_timeout(self, user_data):
        """
        Update value on the progress bar
        """
        if self.activity_mode:
            self.progressbar.pulse()
        else:
            new_value = self.progressbar.get_fraction() + 0.01

            if new_value > 1:
                new_value = 0

            self.progressbar.set_fraction(new_value)

        # As this is a timeout function, return True so that it
        # continues to get called
        return True

win = ProgressBarWindow()
win.connect("destroy", Gtk.main_quit)
win.show_all()
Gtk.main()

Answer 1

Your example is OK, just change the CSS snippet to:

'''
progressbar > trough > progress {
  background-image: none;
  background-color: green;
}
'''

Probably the Ubuntu Ambience theme uses a background-image: linear-gradient() for styling the progressbar.