Introduction

Basic Widgets

Toplevel Widgets

Geometry Management

Binding Functions

Working with Images in Tkinter

Tkinter Advance

Applications and Projects

Treeview scrollbar Widget in Tkinter

The Treeview widget in tkinter is used for displaying tabular data in the form of a tree structure. Often, especially when there are many rows or items, it's beneficial to add a scrollbar to the Treeview for better navigation.

In this tutorial, we'll show you how to add both vertical and horizontal scrollbars to a Treeview widget in tkinter.

Treeview Scrollbar Widget in tkinter Tutorial:

1. Import Required Libraries:

import tkinter as tk
from tkinter import ttk  # ttk module provides access to the Tk themed widget set

2. Initialize Main Application Window:

root = tk.Tk()
root.title("Treeview Scrollbar Tutorial")
root.geometry("500x400")

3. Creating a Treeview with Scrollbars:

First, let's set up the main frame that will hold the Treeview and its scrollbars:

frame = ttk.Frame(root)
frame.pack(pady=20, padx=20, fill=tk.BOTH, expand=True)

Next, create horizontal and vertical scrollbars:

vert_scrollbar = ttk.Scrollbar(frame, orient="vertical")
vert_scrollbar.pack(side=tk.RIGHT, fill=tk.Y)

hor_scrollbar = ttk.Scrollbar(frame, orient="horizontal")
hor_scrollbar.pack(side=tk.BOTTOM, fill=tk.X)

Then, create the Treeview and connect it to the scrollbars:

tree = ttk.Treeview(frame, yscrollcommand=vert_scrollbar.set, xscrollcommand=hor_scrollbar.set)
tree.pack(fill=tk.BOTH, expand=True)

vert_scrollbar.config(command=tree.yview)
hor_scrollbar.config(command=tree.xview)

4. Adding Data to Treeview:

For our example, let's create a basic table structure:

# Define the columns
tree["columns"] = ("Name", "Age", "Address")

# Format the columns
tree.column("#0", width=0, stretch=tk.NO)
tree.column("Name", anchor=tk.W, width=150)
tree.column("Age", anchor=tk.W, width=100)
tree.column("Address", anchor=tk.W, width=250)

# Create the headings
tree.heading("#0", text="", anchor=tk.W)
tree.heading("Name", text="Name", anchor=tk.W)
tree.heading("Age", text="Age", anchor=tk.W)
tree.heading("Address", text="Address", anchor=tk.W)

# Add data
data = [
    ("John Doe", 28, "1234 Elm Street"),
    ("Jane Smith", 34, "2345 Pine Avenue"),
    # ... You can add more data as required
]

for item in data:
    tree.insert(parent='', index=tk.END, values=item)

5. Mainloop to Run the Application:

root.mainloop()

Complete Code:

When you piece together all the above steps, you'll have a complete application that demonstrates a Treeview widget in tkinter with both vertical and horizontal scrollbars. As you add more rows to the Treeview, you'll be able to navigate easily using the scrollbars.

This tutorial provides an introduction to using the Treeview widget with scrollbars. You can extend this by adding features like sorting, selecting rows, right-click context menus, and much more.

  1. How to add scrollbar to Tkinter Treeview:

    • Description: To add a scrollbar to a Treeview in Tkinter, you can use the Scrollbar widget along with the yscrollcommand option of the Treeview widget.
    • Code:
      import tkinter as tk
      from tkinter import ttk
      
      root = tk.Tk()
      
      # Create a Treeview
      tree = ttk.Treeview(root, columns=("Name", "Age"))
      
      # Add data to the Treeview
      tree.insert("", "end", values=("John Doe", 30))
      tree.insert("", "end", values=("Jane Smith", 25))
      # ... Add more data ...
      
      # Create a vertical scrollbar
      scrollbar = tk.Scrollbar(root, command=tree.yview)
      
      # Set the Treeview's yscrollcommand to the scrollbar's set method
      tree.configure(yscrollcommand=scrollbar.set)
      
      # Pack the Treeview and scrollbar
      tree.pack(side=tk.LEFT, fill=tk.Y)
      scrollbar.pack(side=tk.RIGHT, fill=tk.Y)
      
      root.mainloop()
      
  2. Customizing Treeview widget in Tkinter:

    • Description: Customize the appearance and behavior of a Treeview widget by adjusting options such as column headings, widths, and styles.
    • Code:
      import tkinter as tk
      from tkinter import ttk
      
      root = tk.Tk()
      
      # Create a Treeview with columns and styles
      tree = ttk.Treeview(root, columns=("Name", "Age"), show="headings")
      tree.heading("Name", text="Name")
      tree.heading("Age", text="Age")
      
      # Add data to the Treeview
      tree.insert("", "end", values=("John Doe", 30))
      tree.insert("", "end", values=("Jane Smith", 25))
      # ... Add more data ...
      
      # Create a vertical scrollbar
      scrollbar = tk.Scrollbar(root, command=tree.yview)
      
      # Set the Treeview's yscrollcommand to the scrollbar's set method
      tree.configure(yscrollcommand=scrollbar.set)
      
      # Pack the Treeview and scrollbar
      tree.pack(side=tk.LEFT, fill=tk.Y)
      scrollbar.pack(side=tk.RIGHT, fill=tk.Y)
      
      root.mainloop()
      
  3. Expandable Treeview items in Tkinter:

    • Description: Make items in a Treeview expandable by using the tree.item method to configure the open option.
    • Code:
      import tkinter as tk
      from tkinter import ttk
      
      def toggle_expand(item_id):
          current_state = tree.item(item_id, "open")
          tree.item(item_id, open=not current_state)
      
      root = tk.Tk()
      
      # Create a Treeview
      tree = ttk.Treeview(root, columns=("Name", "Age"), show="headings")
      
      # Add data to the Treeview with parent-child relationships
      parent_item = tree.insert("", "end", values=("Parent", ""))
      tree.insert(parent_item, "end", values=("Child 1", 10))
      tree.insert(parent_item, "end", values=("Child 2", 15))
      
      # Create a vertical scrollbar
      scrollbar = tk.Scrollbar(root, command=tree.yview)
      
      # Set the Treeview's yscrollcommand to the scrollbar's set method
      tree.configure(yscrollcommand=scrollbar.set)
      
      # Pack the Treeview and scrollbar
      tree.pack(side=tk.LEFT, fill=tk.Y)
      scrollbar.pack(side=tk.RIGHT, fill=tk.Y)
      
      # Create a button to toggle item expansion
      toggle_button = tk.Button(root, text="Toggle Expand", command=lambda: toggle_expand(parent_item))
      toggle_button.pack(pady=10)
      
      root.mainloop()
      
  4. Tkinter Treeview column sorting with scrollbar:

    • Description: Enable column sorting in a Treeview by binding the column heading click event to a sorting function.
    • Code:
      import tkinter as tk
      from tkinter import ttk
      
      def sort_column(col):
          data = [(tree.set(child, col), child) for child in tree.get_children("")]
          data.sort()
          for i, item in enumerate(data):
              tree.move(item[1], "", i)
      
      root = tk.Tk()
      
      # Create a Treeview with columns and column headings
      tree = ttk.Treeview(root, columns=("Name", "Age"), show="headings")
      tree.heading("Name", text="Name", command=lambda: sort_column("Name"))
      tree.heading("Age", text="Age", command=lambda: sort_column("Age"))
      
      # Add data to the Treeview
      tree.insert("", "end", values=("John Doe", 30))
      tree.insert("", "end", values=("Jane Smith", 25))
      # ... Add more data ...
      
      # Create a vertical scrollbar
      scrollbar = tk.Scrollbar(root, command=tree.yview)
      
      # Set the Treeview's yscrollcommand to the scrollbar's set method
      tree.configure(yscrollcommand=scrollbar.set)
      
      # Pack the Treeview and scrollbar
      tree.pack(side=tk.LEFT, fill=tk.Y)
      scrollbar.pack(side=tk.RIGHT, fill=tk.Y)
      
      root.mainloop()