Unable to change the background color of the button gtkmm 3 C++

Platform
, ,
1

I used this Custom Widgets from Gtkmm 3 Documentation

I set the name of the button
demoButton->set_name(Glib::ustring::format("my-widget"));

loading the css from the src

m_refCssProvider = Gtk::CssProvider::create();
  auto refStyleContext = Gtk::Widget::get_style_context();
  // refStyleContext->add_provider(m_refCssProvider,GTK_STYLE_PROVIDER_PRIORITY_APPLICATION);
  // link:https://stackoverflow.com/questions/8952679/gtkmm-3-button-background-color-change
  refStyleContext->add_provider(m_refCssProvider,GTK_STYLE_PROVIDER_PRIORITY_USER);
  m_refCssProvider->signal_parsing_error().connect(
    sigc::mem_fun(*this, &MyClass::on_parsing_error));


  try
  {
    m_refCssProvider->load_from_path("src/gladeFiles/custom_gtk.css");
  }
  catch(const Gtk::CssProviderError& ex)
  {
    std::cerr << "CssProviderError, Gtk::CssProvider::load_from_path() failed: "
              << ex.what() << std::endl;
  }
  catch(const Glib::Error& ex)
  {
    std::cerr << "Error, Gtk::CssProvider::load_from_path() failed: "
              << ex.what() << std::endl;
  }

This is the css file content

/* Example of a CSS style sheet with a custom style property.
 *
 * The name of the style property must have its canonical form, i.e. characters
 * other than ASCII letters, digits, and hyphens must be replaced by hyphens.
*/

* {
  /* -<widget class name>-<style property canonical name>: <value>; */
  -gtkmm__CustomObject_mywidget-example-scale: 920;
}

#my-widget {
  background-color: rgb(255,0,0);
  color:            rgb(0,0,255);
}

I do not get any error on loading the css file. The Button does not change the color to red.

Do not know what is going wrong!

Can help in correcting me If I missed something?

2

Hello @santhoshnumberone! Buttons in GTK3 have a background-image property set by default (assuming the Adwaita theme). Try that:

#my-widget {
  background-image: none;
  background-color: rgb(255,0,0);
  color:            rgb(0,0,255);
}
3

Does not seem to be helping, not working

I found this post Unable to set background color for button

One person said this

Deprecated: 3.16: This function is not useful in the context of CSS-based
rendering. If you wish to change the way a widget renders its background
you should use a custom CSS style, through an application-specific
Gtk::StyleProvider
<https://developer.gnome.org/gtkmm/stable/classGtk_1_1StyleProvider.html> and
a CSS style class. You can also override the default drawing of a widget
through the Gtk::Widget::signal_draw()
<https://developer.gnome.org/gtkmm/stable/classGtk_1_1Widget.html#ab0a7d34fe7ae7a83fdb1e1ddd223e8f4>signal,
and use Cairo
<http://www.cairographics.org/documentation/cairomm/reference/namespaceCairo.html>
to
draw a specific color, regardless of the CSS style.

Can anyone guide me with a working example I can’t seem to find a complete working code anywhere. Trying put stuff ending up no result at all

Please help

4

A button contains a child widget (e.g. a Label) that does the drawing.
I think you must use set_name() on the button’s child widget.

if (demoButton->get_child())
  demoButton->get_child()->set_name("my-widget");

You must do this after you’ve called Button methods such as set_label()
or set_image(). Those methods can set a new child widget.

1 Like
5

I did set the label for the button first.
Then set name.
Still not working
Can you please try out it out from your end and paste a basic small snippet here for my reference so that I can check if it works

6

I’m not sure add_provider always properly works, better use add_provider_for_screen instead.

Here is what I usually do in Python:

def apply_css(self, path):
    cssp = Gtk.CssProvider()
    cssp.load_from_path(path)
    screen = Gdk.Screen.get_default()
    Gtk.StyleContext.add_provider_for_screen(screen, cssp, Gtk.STYLE_PROVIDER_PRIORITY_APPLICATION)
7

Style providers added to a context on a widget do not cascade into their children.

Always add a style provider to the default screen (or display, with GTK4) if you want to apply to any widget in the UI.

Additionally, do not use the widget name for CSS selectors: GTK does not guarantee uniqueness; use a CSS class, instead.

8

I am using gtk3 not gtk4

Can you please try and provide a snippet for a working code of button change color in gtkmm 3?
It’s getting a lot confusing now only for button. custom widget examples works fine but this button is a pain.

9

I don’t use gtkmm myself, I recommend to look at existing apps, like gnome-system-monitor:

10

Sorry, I can’t change the background color of a button. With

  m_refCssProvider = Gtk::CssProvider::create();
  Gtk::StyleContext::add_provider_for_screen(get_screen(), m_refCssProvider,
    GTK_STYLE_PROVIDER_PRIORITY_APPLICATION);
  m_refCssProvider->signal_parsing_error().connect(
    sigc::mem_fun(*this, &MyWidget::on_parsing_error));
  try
  {
    m_refCssProvider->load_from_path("custom_gtk.css");
  }
  ......

I can change the color of the text in the button and the background color of
other widgets. I don’t know why buttons behave differently.

11

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.