I am using a Gtk.TreeView
with a Gtk.TreeStore
as a model for hierarchical data. As an example, let's take a music database organized into three levels: artist/album/title. I would like to filter this tree using a textual search field. For example, typing "Five" into the search field should give a result along the path "Hank Marvin/Heartbeat/Take Five".
My understanding is that I need to create a callback function and register it using Gtk.TreeModelFilter.set_visible_func()
. The problem is that making the line for "Take Five" visible is not enough to make it appear, I also have to set all of its parents visible as well. However, that would require me to traverse the tree up to its root and actively make each node visible along that path, which does not fit into the callback pattern.
One way I see to make this logic work with the callback pattern is to check the whole subtree in the callback function, but that way each leaf node would get checked three times. Even though the performance penalty would be acceptable with such a shallow tree, this hack gives me the goosebumps and I would like to refrain from using it:
def visible_callback(self, model, iter, _data=None):
search_query = self.entry.get_text().lower()
if search_query == "":
return True
text = model.get_value(iter, 0).lower()
if search_query in text:
return True
# Horrible hack
for i in range(model.iter_n_children(iter)):
if self.visible_callback(model, model.iter_nth_child(iter, i)):
return True
return False
What is the intended way to filter a tree view in GTK? (My example is written in Python, but a solution for any language binding of GTK would be fine.)
Finally I came up with a solution and since I haven't found any treeview filtering examples on the internet that uses a TreeStore
and not a ListStore
, I'm posting my solution here as an example:
#! /usr/bin/python
import gi
gi.require_version('Gtk', '3.0')
gi.require_version('Pango', '1.0')
from gi.repository import Gtk
from gi.repository import Pango
from gi.repository import GLib
import signal
HIERARCHICAL_DATA = {
"Queen": {
"A Kind of Magic": [ "Who Wants to Live Forever", "A Kind of Magic" ],
"The Miracle": [ "Breakthru", "Scandal" ]
},
"Five Finger Death Punch": {
"The Way of the Fist": [ "The Way of the Fist", "The Bleeding" ],
},
"Hank Marvin": {
"Heartbeat": [ "Oxygene (Part IV)", "Take Five" ]
}
}
ICONS = [ "stock_people", "media-optical", "sound" ]
class TreeViewFilteringDemo(Gtk.Window):
EXPAND_BY_DEFAULT = True
SPACING = 10
# Controls whether the row should be visible
COL_VISIBLE = 0
# Text to be displayed
COL_TEXT = 1
# Desired weight of the text (bold for matching rows)
COL_WEIGHT = 2
# Icon to be displayed
COL_ICON = 3
def __init__(self):
# Set up window
Gtk.Window.__init__(self, title="TreeView filtering demo")
self.set_size_request(500, 500)
self.set_position(Gtk.WindowPosition.CENTER)
self.set_resizable(True)
self.set_border_width(self.SPACING)
# Set up and populate a tree store
self.tree_store = Gtk.TreeStore(bool, str, Pango.Weight, str)
self.add_nodes(HIERARCHICAL_DATA, None, 0)
# Create some boxes for laying out the different controls
vbox = Gtk.Box(orientation=Gtk.Orientation.VERTICAL, spacing=self.SPACING)
vbox.set_homogeneous(False)
hbox = Gtk.Box(Gtk.Orientation.HORIZONTAL, spacing=self.SPACING)
hbox.set_homogeneous(False)
vbox.pack_start(hbox, False, True, 0)
self.add(vbox)
# A text entry for filtering
self.search_entry = Gtk.Entry()
self.search_entry.set_placeholder_text("Enter text here to filter results")
self.search_entry.connect("changed", self.refresh_results)
hbox.pack_start(self.search_entry, True, True, 0)
# Add a checkbox for controlling subtree display
self.subtree_checkbox = Gtk.CheckButton("Show subtrees of matches")
self.subtree_checkbox.connect("toggled", self.refresh_results)
hbox.pack_start(self.subtree_checkbox, False, False, 0)
# Use an internal column for filtering
self.filter = self.tree_store.filter_new()
self.filter.set_visible_column(self.COL_VISIBLE)
self.treeview = Gtk.TreeView(model=self.filter)
# CellRenderers for icons and texts
icon_renderer = Gtk.CellRendererPixbuf()
text_renderer = Gtk.CellRendererText()
# Put the icon and the text into a single column (otherwise only the
# first column would be indented according to its depth in the tree)
col_combined = Gtk.TreeViewColumn("Icon and Text")
col_combined.pack_start(icon_renderer, False)
col_combined.pack_start(text_renderer, False)
col_combined.add_attribute(text_renderer, "text", self.COL_TEXT)
col_combined.add_attribute(text_renderer, "weight", self.COL_WEIGHT)
col_combined.add_attribute(icon_renderer, "icon_name", self.COL_ICON)
self.treeview.append_column(col_combined)
# Scrolled Window in case results don't fit in the available space
self.sw = Gtk.ScrolledWindow()
self.sw.add(self.treeview)
vbox.pack_start(self.sw, True, True, 0)
# Initialize filtering
self.refresh_results()
def add_nodes(self, data, parent, level):
"Create the tree nodes from a hierarchical data structure"
if isinstance(data, dict):
for key, value in data.items():
child = self.tree_store.append(parent, [True, key, Pango.Weight.NORMAL, ICONS[level]])
self.add_nodes(value, child, level + 1)
else:
for text in data:
self.tree_store.append(parent, [True, text, Pango.Weight.NORMAL, ICONS[level]])
def refresh_results(self, _widget = None):
"Apply filtering to results"
search_query = self.search_entry.get_text().lower()
show_subtrees_of_matches = self.subtree_checkbox.get_active()
if search_query == "":
self.tree_store.foreach(self.reset_row, True)
if self.EXPAND_BY_DEFAULT:
self.treeview.expand_all()
else:
self.treeview.collapse_all()
else:
self.tree_store.foreach(self.reset_row, False)
self.tree_store.foreach(self.show_matches, search_query, show_subtrees_of_matches)
self.treeview.expand_all()
self.filter.refilter()
def reset_row(self, model, path, iter, make_visible):
"Reset some row attributes independent of row hierarchy"
self.tree_store.set_value(iter, self.COL_WEIGHT, Pango.Weight.NORMAL)
self.tree_store.set_value(iter, self.COL_VISIBLE, make_visible)
def make_path_visible(self, model, iter):
"Make a row and its ancestors visible"
while iter:
self.tree_store.set_value(iter, self.COL_VISIBLE, True)
iter = model.iter_parent(iter)
def make_subtree_visible(self, model, iter):
"Make descendants of a row visible"
for i in range(model.iter_n_children(iter)):
subtree = model.iter_nth_child(iter, i)
if model.get_value(subtree, self.COL_VISIBLE):
# Subtree already visible
continue
self.tree_store.set_value(subtree, self.COL_VISIBLE, True)
self.make_subtree_visible(model, subtree)
def show_matches(self, model, path, iter, search_query, show_subtrees_of_matches):
text = model.get_value(iter, self.COL_TEXT).lower()
if search_query in text:
# Highlight direct match with bold
self.tree_store.set_value(iter, self.COL_WEIGHT, Pango.Weight.BOLD)
# Propagate visibility change up
self.make_path_visible(model, iter)
if show_subtrees_of_matches:
# Propagate visibility change down
self.make_subtree_visible(model, iter)
return
win = TreeViewFilteringDemo()
win.connect("delete-event", Gtk.main_quit)
win.show_all()
# Make sure that the application can be stopped from the terminal using Ctrl-C
GLib.unix_signal_add(GLib.PRIORITY_DEFAULT, signal.SIGINT, Gtk.main_quit)
Gtk.main()
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With