Python Tkinter Treeview

ttk.Treeview displays a hierarchical collection of items and also displays tabular data. We can add child node so can create a view which can be expanded.

Tkitner Treeview to get Parent Child nodes and display data in hierarchical order

from tkinter import ttk

Here is a basic Treeview with tree.

from tkinter import ttk
import tkinter as tk
# Creating tkinter my_w
my_w = tk.Tk()
my_w.geometry("260x280") 
my_w.title("www.plus2net.com")  
# Using treeview widget
trv = ttk.Treeview(my_w, selectmode ='browse')
trv.grid(row=1,column=1,padx=30,pady=20)

# column identifiers 
trv["columns"] = ("1", "2")
  
# Defining headings, other option is tree
trv['show'] = 'tree' 
# width of columns and alignment 
trv.column("#0", width = 80, anchor ='c')
trv.column("1", width = 10, anchor ='c')
trv.column("2", width = 100, anchor ='c')
  
# Headings  
# respective columns
trv.heading("#0", text ="Label",anchor='c')
trv.heading("1", text ="id")
trv.heading("2", text ="Name",anchor='c')

trv.insert("",'end',iid=1,text='First',values=(1,'n1-Alex'))
trv.insert("",'end',iid=2,text='second',values=(2,'n2-Ravi'))
trv.insert("",'end',iid=3,text='third',values=(3,'n3-Ronn'))

my_w.mainloop()

Watch the column with #0, this column will display in Tree and show the text part given in each row. The line saying trv['show'] = 'tree' can take the value as headings trv['show'] = 'headings' and the column with #0 will be hidden.
Treeview headings

Parent-child node

We can set the parent and child rows or nodes to the Treeview.
Treeview Parent-child nodes

Getting list of data from Treeview

my_list=[]           
for child in trv.get_children():
    my_list.append(trv.item(child)["values"][1])
    #print(trv.item(child)["values"])
    #print(trv.item(child)["values"][1]) # for Name
print(my_list)

On select event of treeview

def data_collect():
    print("hi")
    p_id = trv.selection()[0] # collect selected row id
trv.bind("<<TreeviewSelect>>", data_collect())

Displaying selected item value

def show():
    p_id = trv.selection()[0] # collect selected row id
    print(trv.item(p_id)) # Dictionary of all options
    print(trv.item(p_id)['values']) # List of values
b1=tk.Button(my_w,text='Show',command=show)
b1.grid(row=2,column=1)

Edit and update selected item value

Here only the Name column data we will select and update. We kept one button to show the selected node value and another button to Update the name of the selected node.

def show():
    p_id = trv.selection()[0] # collect selected row id
    print(trv.item(p_id)) # Dictionary of all options
    print(trv.item(p_id)['values']) # List of values
def upd():
    p_id = trv.selection()[0] # collect selected row id
    trv.item(p_id, values=[trv.item(p_id)['values'][0],e1.get()])
b1=tk.Button(my_w,text='Show',command=show)
b1.grid(row=2,column=2)    
e1=tk.Entry(my_w)
e1.grid(row=3,column=1)
b1=tk.Button(my_w,text='Update',command=upd)
b1.grid(row=3,column=2)

Full code to Edit selected item of treeview is here

Reading all rows of Treeview

for line in trv.get_children():
        print(trv.item(line)['values'])

For specific column value we can use like this

print(trv.item(line)['values'][3])

Options of Treeview

Options	Details
columns	Column identifier strings. These are in addition to the icon column
cursor	Shape of the cursor when mouse is over it. A list of available cursor shapes are here.
displaycolumns	Select columns to be displayed and the order
height	Number of rows ( default value is 10 ).
padding	Extra space around the data inside the widget
selectmode	browse \| extend \| none , browse : Select one item only extend : Select more than one item none : No selection
takefocus	True \| False , specify whether the widget is visited during focus traversal

Wrapping text

We have imported textwrap module. Added style to give the rowheight and created one function to wrap the text.

from tkinter import *
from tkinter import ttk
import textwrap

def wrap(string, length=20):
    return '\n'.join(textwrap.wrap(string, length))
my_w = Tk()
trv = ttk.Treeview(my_w, height=3)
trv['show'] = 'headings'
s = ttk.Style()
s.configure('Treeview', rowheight=60)

trv["columns"] = ("1", "2")
trv.column("1", width=100)
trv.column("2", width=100)

trv.heading("1", text="col 1")
trv.heading("2", text="col 2")

item = trv.insert("", "end", values=(wrap("This is long text,i want to wrap"),
                                         wrap("and this text also length is more")))
item = trv.insert("", "end", values=("No wrap","No Wrap"))
trv.grid(row=0, column=0)
my_w.mainloop()

Output is here.
Treeview with text wrpping

Using Google sheets data with Treeview

We can collect data from google sheet and use as data for a Treeview by using pygsheets library and google drive API.
Data of Treeview from Google sheet data

Treeview insert Records of MySQL Pagination of Records of MySQL Delete Records Treeview using data from Google sheet Select -Edit-update MySQL Product table using Treeview
Tkinter

Python Tkinter Dictionary Python- Tutorials

Subscribe to our YouTube Channel here