Рубрики
Без рубрики

Виджет Tkinter TreeView

Еще раз здравствуйте! В рамках нашей серии учебников по Tkinter сегодняшний пост будет посвящен виджету TreeView.

Автор оригинала: Pankaj Kumar.

Еще раз здравствуйте! В рамках нашей серии учебников по Tkinter сегодняшний пост будет посвящен виджету TreeView.

Виджет TreeView очень полезен, если вы хотите отобразить иерархию элементов со всеми атрибутами, перечисленными рядом.

Например, если вы хотите создать приложение, которое выглядит как проводник файлов Windows, мы можем сделать это с помощью виджета TreeView от Tkinter.

Проводник файлов Windows 1

Итак, TreeView позволяет нам построить древовидную структуру и соответственно вставлять элементы вместе с их атрибутами.

Вы можете динамически добавлять или удалять узлы из дерева, когда захотите, так что это очень полезно для многих приложений с графическим интерфейсом.

Мы можем построить Дерево в соответствии с нашими предпочтениями.

Если вы хотите реплицировать проводник файлов, вы должны создать древовидное представление файлов с их атрибутами и добавить вложенные файлы и папки в качестве дочерних элементов родительских папок!

Хотя мы не будем выполнять это упражнение, я бы посоветовал вам попробовать это самостоятельно, чтобы вы могли хорошо понять, как работает TreeView .

Давайте теперь посмотрим, как мы можем создать виджет TreeView и выполнять над ним операции, такие как вставка и удаление.

Создание виджета TreeView

Виджет TreeView принадлежит модулю tkinter.ttk , поэтому мы должны импортировать его.

import tkinter.tk as ttk

Теперь мы можем ссылаться на виджет как ttk.TreeView() .

Чтобы создать новый виджет TreeView, синтаксис прост.

tree = ttk.Treeview(master, columns)

Здесь дерево соответствует корневому узлу вновь сформированного дерева. Здесь master относится к главному узлу Tkinter application master.

столбцы – это кортеж, который ссылается на имена столбцов.

Например, мы можем создать виджет TreeView, подобный этому, с колонками “Имя” и “ИДЕНТИФИКАТОР”:

tree = ttk.Treeview(master, columns=("Name", "ID"))

Это дерево будет построено с использованием master в качестве базового виджета. Как правило, вы хотите, чтобы он был основным основным объектом вашего приложения:

master = tk.Tk()

Теперь, когда у нас есть виджет TreeView, нет смысла отображать его, так как он пуст.

Давайте сначала вставим некоторые объекты, чтобы мы могли просматривать TreeView в наших реальных приложениях.

Имейте в виду, что строки узла TreeView состоят только из строк, как это:

"Label" , "Hello", "Second Col", "Third Col"

Теперь давайте вставим некоторые узлы в наш недавно построенный TreeView.

Вставка в дерево

Синтаксис вставки очень прост. Мы берем объект TreeView и вставляем некоторые значения , помеченные с помощью текста . Мы также можем указать уникальный идентификатор для узла, используя параметр iid .

tree.insert(parent, index, iid, text, values)

Здесь мы вставляем узел в parent . Если вы хотите, чтобы виджет parent был главным (корневым) узлом, мы можем установить его в пустую строку (“). В противном случае мы должны упомянуть iid существующего родительского узла.

На дочерний номер этого узла ссылаются с помощью index .

Например, если вы хотите вставить в первый дочерний элемент, вы указываете index=0 . Если вы хотите вставить в конце, вы можете указать специальное значение 'end' .

tree.insert(parent='', index='end', iid=0, text="Label", values=("Hello", "Second Col", "Third Col"))

Выше приведен пример вставки в конец корневого узла со значениями в следующей строке:

"Label" , "Hello", "Second Col", "Third Col"

К сожалению, нет простого способа построить TreeView, так как вам нужны другие виджеты, чтобы правильно визуализировать вывод.

Пожалуйста , убедитесь , что вы прошли через наши разделы руководства по кнопке Tkinter, менеджеру сетки и виджетам ввода Tkinter, прежде чем продолжить.

Я предоставлю пример приложения для визуализации выходных данных, используя эти виджеты:

import tkinter as tk
import tkinter.ttk as ttk

class Application(tk.Frame):
    def __init__(self, root):
        self.root = root
        self.initialize_user_interface()

    def initialize_user_interface(self):
        # Configure the root object for the Application
        self.root.title("Application")
        self.root.grid_rowconfigure(0, weight=1)
        self.root.grid_columnconfigure(0, weight=1)
        self.root.config(background="green")

        # Define the different GUI widgets
        self.name_label = tk.Label(self.root, text="Name:")
        self.name_entry = tk.Entry(self.root)
        self.name_label.grid(row=0, column=0, sticky=tk.W)
        self.name_entry.grid(row=0, column=1)

        self.idnumber_label = tk.Label(self.root, text="ID")
        self.idnumber_entry = tk.Entry(self.root)
        self.idnumber_label.grid(row=1, column=0, sticky=tk.W)
        self.idnumber_entry.grid(row=1, column=1)

        self.submit_button = tk.Button(self.root, text="Insert", command=self.insert_data)
        self.submit_button.grid(row=2, column=1, sticky=tk.W)

        self.exit_button = tk.Button(self.root, text="Exit", command=self.root.quit)
        self.exit_button.grid(row=0, column=3)

        # Set the treeview
        self.tree = ttk.Treeview(self.root, columns=('Name', 'ID'))

        # Set the heading (Attribute Names)
        self.tree.heading('#0', text='Item')
        self.tree.heading('#1', text='Name')
        self.tree.heading('#2', text='ID')

        # Specify attributes of the columns (We want to stretch it!)
        self.tree.column('#0', stretch=tk.YES)
        self.tree.column('#1', stretch=tk.YES)
        self.tree.column('#2', stretch=tk.YES)

        self.tree.grid(row=4, columnspan=4, sticky='nsew')
        self.treeview = self.tree

        self.id = 0
        self.iid = 0

    def insert_data(self):
        self.treeview.insert('', 'end', iid=self.iid, text="Item_" + str(self.id),
                             values=("Name: " + self.name_entry.get(),
                                     self.idnumber_entry.get()))
        self.iid = self.iid + 1
        self.id = self.id + 1

app = Application(tk.Tk())
app.root.mainloop()

Здесь я создал несколько меток и записей для ввода. Я также создал TreeView, который состоит из двух частей:

  • Заголовки TreeView (Для отображения имен столбцов)
  • Столбцы TreeView и метод insert_data()

Всякий раз, когда мы нажимаем кнопку “Вставить”, метод insert_data() будет вызываться в нашем виджете TreeView.

А теперь хватит болтать. А теперь давайте протестируем нашу программу для вставки!

Пример Treeview 1

Хорошо, это, кажется, работает довольно хорошо! Теперь давайте добавим кнопку удаления, чтобы мы могли удалить выбранную строку.

Удаление строки из TreeView

Существует метод TreeView.delete () , которым мы можем воспользоваться. Это приведет к удалению соответствующего узла (строки, в нашем случае) из нашего виджета TreeView.

tree.delete(iid)

Это просто берет iid идентификационный номер узла и удаляет его из TreeView!

Мы завершим это с помощью метода delete_data() .

Теперь большой вопрос заключается в том, как мы можем получить идентификационный номер нашей строки из виджета TreeView.

Ну, это зависит от того, как вы собираетесь выполнять операцию удаления.

Мы будем удалять строку всякий раз, когда мы выбираем эту строку с помощью мыши. После того, как строка будет выделена, мы можем нажать кнопку удалить, и это удалит ее из виджета TreeView .

Для этого мы будем использовать метод TreeView.focus () , чтобы получить iid строки (в виде строки). Мы можем использовать это, чтобы удалить эту строку напрямую!

    def delete_data(self):
        row_id = int(self.tree.focus())
        self.treeview.delete(row_id)

Давайте добавим кнопку удаления и будем использовать этот метод в качестве функции обратного вызова!

После его добавления приложение будет выглядеть следующим образом:

import tkinter as tk
import tkinter.ttk as ttk

class Application(tk.Frame):
    def __init__(self, root):
        self.root = root
        self.initialize_user_interface()

    def initialize_user_interface(self):
        # Configure the root object for the Application
        self.root.title("Application")
        self.root.grid_rowconfigure(0, weight=1)
        self.root.grid_columnconfigure(0, weight=1)
        self.root.config(background="green")

        # Define the different GUI widgets
        self.name_label = tk.Label(self.root, text="Name:")
        self.name_entry = tk.Entry(self.root)
        self.name_label.grid(row=0, column=0, sticky=tk.W)
        self.name_entry.grid(row=0, column=1)

        self.idnumber_label = tk.Label(self.root, text="ID:")
        self.idnumber_entry = tk.Entry(self.root)
        self.idnumber_label.grid(row=1, column=0, sticky=tk.W)
        self.idnumber_entry.grid(row=1, column=1)

        self.submit_button = tk.Button(self.root, text="Insert", command=self.insert_data)
        self.submit_button.grid(row=2, column=1, sticky=tk.W)

        self.delete_button = tk.Button(self.root, text="Delete", command=self.delete_data)
        self.delete_button.grid(row=100, column=100)

        self.exit_button = tk.Button(self.root, text="Exit", command=self.root.quit)
        self.exit_button.grid(row=0, column=3)

        # Set the treeview
        self.tree = ttk.Treeview(self.root, columns=('Name', 'ID'))

        # Set the heading (Attribute Names)
        self.tree.heading('#0', text='Item')
        self.tree.heading('#1', text='Name')
        self.tree.heading('#2', text='ID')

        # Specify attributes of the columns (We want to stretch it!)
        self.tree.column('#0', stretch=tk.YES)
        self.tree.column('#1', stretch=tk.YES)
        self.tree.column('#2', stretch=tk.YES)

        self.tree.grid(row=4, columnspan=4, sticky='nsew')
        self.treeview = self.tree

        self.id = 0
        self.iid = 0

    def insert_data(self):
        self.treeview.insert('', 'end', iid=self.iid, text="Item_" + str(self.id),
                             values=("Name: " + self.name_entry.get(),
                                     self.idnumber_entry.get()))
        self.iid = self.iid + 1
        self.id = self.id + 1

    def delete_data(self):
        row_id = int(self.tree.focus())
        self.treeview.delete(row_id)

app = Application(tk.Tk())
app.root.mainloop()

Выход

Удаление Treeview

Теперь мы завершили базовую структуру TreeView, а также реализовали операции вставки и удаления голых костей.

Я бы посоветовал вам добавить больше функциональности в это приложение, выполнив другие операции, такие как обновление некоторых строк. Вы также можете заметить, что номера товаров не упорядочены должным образом после удаления.

Вот простая функция шаблона для update () , которую вы можете использовать в качестве ссылки:

def update(self):
    for idx, node in enumerate(self.treeview.get_children()):
        self.tree.item(node, text="Updated_Item_" + str(idx))

Это обновляет все строки вашего TreeView и изменяет вашу текстовую метку. Вы можете изменить другие атрибуты аналогичным образом.

Это одни из различных улучшений, которые вы могли бы внести в свое приложение.

Вывод

Надеюсь, у вас есть это простое приложение, работающее с помощью TreeView . Мы кратко рассмотрели, как мы могли бы использовать этот виджет для отображения строк и столбцов нашего приложения, структурированных в виде дерева.