Change default properties of gtk levelbar

Platform
1

I would like to change default background color of level bar which is “grey” yet.I wants to make it
“white”.

image

2

I gave an example for color styling a button with CSS here:

Should be very similar for your GtkLevelBar.

3

For finding the right CSS property names you can use the

Here is a short working GTK4 example:

import gintro/[gtk4, gdk4, glib, gobject, gio]

proc activate(app: gtk4.Application) =
  let window = newApplicationWindow(app)
  let box = newBox(Orientation.horizontal, 10)
  window.setChild( box)
  let b0 = newLevelBarForInterval(0, 10)
  b0.setValue(5)
  b0.setSizeRequest(100, 20)
  
  let cssProvider = newCssProvider()
  let data = "levelbar trough block.empty  {background-color: green;}"
  cssProvider.loadFromData(data)
  #let styleContext = b0.getStyleContext
  #assert styleContext != nil
  #addProvider(styleContext, cssProvider, STYLE_PROVIDER_PRIORITY_USER)
  gtk4.addProviderForDisplay(gdk4.getDefaultDisplay(), cssProvider, STYLE_PROVIDER_PRIORITY_USER.int)
  box.append(b0)
  window.show

proc main =
  let app = newApplication("org.gtk.example")
  app.connect("activate", activate)
  let status = app.run
  quit(status)

main()

With addProviderForDisplay() it works, but I wonder why the commented out solution with addProvider(styleContext, cssProvider, STYLE_PROVIDER_PRIORITY_USER) does not work. When I have a lot free time I will read more about CSS in GTK…

When you use still GTK3 you have to use addProviderForScreen instead. The used CSS string can be tested directly in gtk-inspector. And well, you have to replace “green” by “white”.

1 Like
4

Seems to be a GTK4 bug, with GTK3 following example works fine too:

import gintro/[gtk, gdk, glib, gobject, gio]

proc activate(app: gtk.Application) =
  let window = newApplicationWindow(app)
  let box = newBox(Orientation.horizontal, 10)
  window.add( box)
  let b0 = newLevelBarForInterval(0, 10)
  b0.setValue(5)
  b0.setSizeRequest(100, 20)

  let cssProvider = newCssProvider()
  # let data = "levelbar.continuous  trough block.empty  {background-color: green;}" # works with gtk3
  let data = "levelbar  trough block.empty  {background-color: green;}" # works with gtk3
  discard cssProvider.loadFromData(data)
  let styleContext = b0.getStyleContext
  assert styleContext != nil
  addProvider(styleContext, cssProvider, STYLE_PROVIDER_PRIORITY_USER)
  #gtk4.addProviderForDisplay(gdk4.getDefaultDisplay(), cssProvider, STYLE_PROVIDER_PRIORITY_USER.int)
  box.add(b0)
  window.showAll

proc main =
  let app = newApplication("org.gtk.example")
  app.connect("activate", activate)
  let status = app.run
  quit(status)

main()
1 Like
5

Thanks it’s work for me.

1 Like
6

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