Python GTK: Treeview with rows of different colors

Articles may may have files attached at the end of the post

With a simple example, I am going to illustrated how to build a ListStore TreeView in pygtk (python's gtk binding).

Building a standard ListStore in pygtk is pretty straightforward, however, it can get a bit more difficult to set up a custom TreeView where the rows and columns that are displayed can have different colors.

This tutorial will show how-to create and set up a TreeView, its TreeViewColumn and finally, the CellRenderer.

TreeView with different row and column colorsTreeView with different row and column colors

For the purpose of this tutorial, we are going to create a gtk.Window in which we are going to fit a gtk.TreeView. The TreeView will then be customized so we can feed the text of the 2 column (1st and 2nd parameters to liststore.append() and the color of the foreground and background of the cells (3rd and 4th parameter of liststore.append()).
The second column will only decorate the cells with the supplied colors if it is told to do so (5th parameter of liststore.append()).

Here is the sample code used to generate the screenshot above:

  1. #!/usr/bin/env python
  3. try:
  4.   import gobject, gtk, pango
  5. except:
  6.   print >> sys.stderr, _("You need to install the python bindings for " \
  7.     "gobject, gtk and pango to run this example.")
  8.   sys.exit(1)
  10. DATA = [
  11.         {'col1' : 'row 1/col 1',  'col2' : 'row 1/col 2', 'fg': '#000000', 'bg': '#FF00FF', 'paint_2nd_row' : False},
  12.         {'col1' : 'row 2/col 1',  'col2' : 'row 2/col 2', 'fg': '#FF0F0F', 'bg': '#C9C9C9', 'paint_2nd_row' : False},
  13.         {'col1' : 'row 3/col 1', 'col2' : 'row 3/col 2', 'fg': '#000FFF', 'bg': '#FFF000', 'paint_2nd_row' : True},
  14.       ]
  16. class Window(gtk.Window):
  18.   def __init__(self):
  19.     gtk.Window.__init__(self)
  20.     self.set_title("ListStore Example")
  21.     self.connect("destroy", lambda w: gtk.main_quit())
  22.     self.connect("delete_event", lambda w, e: gtk.main_quit())
  24.     #we create the store and append our elements
  25.     liststore = gtk.ListStore(str, str, str, str, bool)
  26.     for i in DATA:
  27.       liststore.append([i['col1'], i['col2'], i['fg'], i['bg'],i['paint_2nd_row']])
  28.     treeview = gtk.TreeView(liststore)
  30.     #First column's cell
  31.     cell = gtk.CellRendererText()
  32.     col = gtk.TreeViewColumn("Column 1")
  33.     col.pack_start(cell, True)
  34.     #the first column is always painted
  35.     cell.set_property('background-set' , True)
  36.     cell.set_property('foreground-set' , True)
  37.     col.set_attributes(cell,text=0, foreground=2, background=3)
  39.     treeview.append_column(col)
  41.     #Second column's cell
  42.     cell = gtk.CellRendererText()
  43.     col = gtk.TreeViewColumn("Column 2", cell, text=1, foreground=2, background=3, foreground_set=4, background_set = 4)
  45.     treeview.append_column(col)
  47.     self.add(treeview)
  48.     self.show_all()
  50. if __name__ == "__main__":
  51.   #window creation
  52.   win = Window()
  53.   #enter the main loop  
  54.   gtk.main()

Now, we are going to go over the code and details what is being done.

AttachmentSize KB