Python GTK: Treeview with rows of different colors -- page 2

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

Submitted by chantra on Thu, 06/12/2008 - 00:26

In the first part, I briefly described how we were going to manage to set different colors on the different cells of our ListStore. Now, let's break down the script and detail each components.

try:
import gobject, gtk, pango
except:
print >> sys.stderr, _("You need to install the python bindings for " \
"gobject, gtk and pango to run this example.")
sys.exit(1)

Here, we verify that the python-gtk bindings are installed, otherwise we die. pango could be remove, but it came with the copy and paste :) .

Then, we fill up the array of data we are going to give to the TreeView'sTreeModel.

DATA = [
{'col1' : 'row 1/col 1', 'col2' : 'row 1/col 2', 'fg': '#000000', 'bg': '#FF00FF', 'paint_2nd_row' : False},
{'col1' : 'row 2/col 1', 'col2' : 'row 2/col 2', 'fg': '#FF0F0F', 'bg': '#C9C9C9', 'paint_2nd_row' : False},
{'col1' : 'row 3/col 1', 'col2' : 'row 3/col 2', 'fg': '#000FFF', 'bg': '#FFF000', 'paint_2nd_row' : True},
]

Finally, we define a class inheriting gtk.Window where we are going to add our TreeView.

While we initiate our Window, we set the title, and connect to the different signal to close the apps (line 20 to 22).

Then, we create the gtk.ListStore that will hold the data and inform it that there will be 5 colums:

4 of type string:
1. the text content of the first viewable column
2. the text content of the second viewable column
3. the hexadecimal color code of the cell's foreground
4. the hexadecimal color code of the cell's background
A boolean telling if the second column should be painted

Finaly, we append the data we defined earlier on to the ListStore. And create a TreeView that will be using the liststore.

liststore = gtk.ListStore(str, str, str, str, bool)
for i in DATA:
liststore.append([i['col1'], i['col2'], i['fg'], i['bg'],i['paint_2nd_row']])
treeview = gtk.TreeView(liststore)

Now, it is time to define how the data in the liststore is going to be rendered by the treeview, i.e the columns.

We create the first cell renderer. We want to display text so we will be using a gtk.CellRendererText. On the first column, we want the background and foreground color to be rendered all the time (line 35,36).

The column is going to be called "Column 1" and the display will be renderer by cell.
The text, foreground and background attributes will be given by the values of column 0, 2 and 3.

#First column's cell
cell = gtk.CellRendererText()
col = gtk.TreeViewColumn("Column 1")
col.pack_start(cell, True)
#the first column is always painted
cell.set_property('background-set' , True)
cell.set_property('foreground-set' , True)
col.set_attributes(cell,text=0, foreground=2, background=3)
treeview.append_column(col)

Then, we do the same with the second column. Here, the text is given by the first column of the liststore, the foreground and background color are still in column 2 and 3, but this time, the foreground and background color will be modified only if column 4 value is True.

#Second column's cell
cell = gtk.CellRendererText()
col = gtk.TreeViewColumn("Column 2", cell, text=1, foreground=2, background=3, foreground_set=4, background_set = 4)
treeview.append_column(col)