Re: Styling labels?

[Mohith Manoj <mohith manoj skanray com>]

Hi Kevin,

Hope you are still looking for a solution, maybe you've already figured this out but I'll share my experience anyway.

Yes, CSS is the way to do it and it is pretty simple. The Gtk documentation is a lot more descriptive than gtkmm when it comes to CSS nodes used by a particular object. See below for GtkLabel.

https://docs.gtk.org/gtk3/class.Label.html

GtkLabel already has several style classes like .title, .sub-title etc which you can use straight away. All you have to do is,

Gtk::Label * pLabel;

Glib::RefPtr<Gtk::StyleContext> refStyleContext;

// Here I create a new object at run-time. You may also have it as a class member or get it from 'builder'.

pLabel = Gtk::manage(new Gtk::Label("Test label"));

// Get the style context from the label object.

refStyleContext = pLabel->get_style_context();

// Add the style class

refStyleContext->add_class("title");

// Add to container

....

You can also create your own style classes in which case the CSS file should have an entry as below.

label.your-style-class-name

{

  font-size: 13px;

  color: red;

  background-color: white;

}

Loading custom style specification is a bit more involved. It is possible to apply custom styles to individual widgets but I prefer an application wide loading. For that this is what you can do. In my case I wanted some changes to the stock themes Adwaita and Mojave-light. Instead of touching the original CSS files (and probably messing it up) I preferred to specify the required changes in a separate file and load it once the application theme has changed.

Glib::RefPtr <Gdk::Screen> refScreen = Gdk::Display::get_default()->get_default_screen();
Glib::RefPtr <Gtk::CssProvider> refProvider = Gtk::CssProvider::create();

//Remove existing provider
if (m_refCurrentCustomStyleProvider)
{
  Gtk::StyleContext::remove_provider_for_screen(refScreen,
                                                m_refCurrentCustomStyleProvider);
}

try
{
  Glib::ustring sPath(Glib::ustring::compose("themes/%1/gtk-3.0/gtk%2.css",
                                             m_oTextComboThemes.get_active_text(),
                                             m_oSwitchDarkMode.get_active()?
                                               "-dark":
                                               ""));

  //Test if a local override is available, otherwise use Adwaita
  if (!Glib::file_test(sPath,
                       Glib::FILE_TEST_EXISTS))
  {
    sPath = Glib::ustring::compose("themes/Adwaita/gtk-3.0/gtk%1.css",
                                   m_oSwitchDarkMode.get_active()?
                                     "-dark":
                                     "");
  }

  refProvider->load_from_path(sPath);

  //Add new provider for screen
  Gtk::StyleContext::add_provider_for_screen(refScreen,
                                             refProvider,
                                             GTK_STYLE_PROVIDER_PRIORITY_APPLICATION);

  m_refCurrentCustomStyleProvider = refProvider;
} catch(Gtk::CssProviderError &e)
{
  LOG4CPLUS_WARN(m_oLogger,
                 "Error loading custom styles. " << e.what());
} catch(Glib::Error &e)
{
  LOG4CPLUS_WARN(m_oLogger,
                 "Error loading custom styles. " << e.what());
}

The best way to test your styles before you create your CSS file is to use gtk-inspector. In my (Ubuntu) system the key CTRL + SHIFT+ D activates it. You first need to enable the key binding. In Linux execute the following in a terminal.

gsettings set org.gtk.Settings.Debug enable-inspector-keybinding true

There you can try out all you want with styling and once you're satisfied you can dump it all into your CSS file.

Please consider the Environment before printing this e-mail.



	
	
	
	The information contained in this message 
(including any attachments) is confidential and may be privileged or 
otherwise protected from disclosure.  If you are not the intended 
recipient, you must not copy this message or attachment or disclose the 
contents to any other person.  If you have received this transmission in
 error, please notify the sender immediately by return e-mail and 
permanently delete this message and any attachments from your system.  
Any dissemination, use, review, distribution, printing or copying of 
this message in whole or in part is strictly prohibited.  Please note 
that e-mails are susceptible to change. 
 
SKANRAY(including
 its group of companies) shall not be liable for any omission or error 
in the message, improper or incomplete transmission of the information 
contained in this communication or for any delay in its receipt or 
damage to your system.  SKANRAY(or
 its group of companies) does not guarantee that the integrity of this 
communication has been maintained or that this communication is free of 
viruses, interceptions or interference.