Gtk progressbar setting CSS min-width has no effect

Question

I try to use a smaller horizontal Gtk::ProgressBar in my project.

The standard minimum width as defined in /usr/share/themes/Adwaita-maia/gtk-4.0/gtk.css is 150px :

progressbar.horizontal > trough {
    min-width: 150px;
}

When I change the 150px to 50px in this file I can squeeze the Gtk::ProgressBar smaller than 150px in the application.

So I tried to override this. In the header file, there are the class members

Gtk::ProgressBar **progressBar_channel_buffers;
Glib::RefPtr<Gtk::CssProvider> m_refCssProvider;

In the constructor, I tried

m_refCssProvider = Gtk::CssProvider::create();
m_refCssProvider->load_from_data("progressbar.horizontal  {"
                                 "min-width: 50px;"
                               "}");

progressBar_channel_buffers = new Gtk::ProgressBar*[num_channels];
for (int i = 0; i < num_channels; i++){
    progressBar_channel_buffers[i] = new Gtk::ProgressBar;
    progressBar_channel_buffers[i]->get_style_context()->add_provider(m_refCssProvider, 1000);
}

This has no effect and I wonder why. When I change for example another CSS property I can see an effect. As an example

m_refCssProvider->load_from_data("progressbar.horizontal > trough, progressbar.horizontal > trough > progress  {"
                                 "min-height: 50px;"
                               "}");

shows the expected effect.

Can you please help me? What am I doing wrong? I started programming Gtk(mm) this week and now I am at a point where I have no idea.

Answer 1

If I am reading your code correctly above, I think the only thing you did incorrectly was mistype the style attribute you were wanting to modify (height instead of width). In your code snippet, it states:

m_refCssProvider->load_from_data("progressbar.horizontal  {"
                             "min-height: 50px;"
                           "}");

Whereas, I think you meant to type:

m_refCssProvider->load_from_data("progressbar.horizontal  {"
                             "min-width: 50px;"
                           "}");

Also, having poked around in the source code for GTK4, I did see that the progressbar widget is actually comprised of a child "trough" widget and a child "progress" widget. That leads me to deduce that the ultimate minimum width of the progress bar that is displayed would be limited to the largest value for minimum width for either the progress bar widget or its children widgets. Therefore, you would need to utilize the "load_from_data" statement where you not only apply the minimum width value to the progress bar node, but also to the trough node and the progress node.

I hope that makes sense.

Regards.