Vista em árvore do Tkinter

Resumo : neste tutorial, você aprenderá sobre o widget Tkinter Treeview e como usá-lo para exibir dados tabulares e hierárquicos.

Introdução ao widget Tkinter Treeview

Um widget Treeview permite exibir dados em estruturas tabulares e hierárquicas. Para criar um widget Treeview, você usa a ttk.Treeviewclasse:

tree = ttk.Treeview(container, **options)Linguagem de código:  Python  ( python )

Um widget Treeview contém uma lista de itens. Cada item possui uma ou mais colunas.

A primeira coluna pode conter texto e um ícone que indica se pode ser expansível ou não. As colunas restantes contêm valores de cada linha.

A primeira linha do Treeview consiste em títulos que identificam cada coluna por um nome.

Usando Tkinter Treeview para exibir dados tabulares

O programa a seguir mostra como usar o widget Treeview para exibir dados tabulares:

import tkinter as tk
from tkinter import ttk
from tkinter.messagebox import showinfo

root = tk.Tk()
root.title('Treeview demo')
root.geometry('620x200')

# define columns
columns = ('first_name', 'last_name', 'email')

tree = ttk.Treeview(root, columns=columns, show='headings')

# define headings
tree.heading('first_name', text='First Name')
tree.heading('last_name', text='Last Name')
tree.heading('email', text='Email')

# generate sample data
contacts = []
for n in range(1, 100):
    contacts.append((f'first {n}', f'last {n}', f'email{n}@example.com'))

# add data to the treeview
for contact in contacts:
    tree.insert('', tk.END, values=contact)


def item_selected(event):
    for selected_item in tree.selection():
        item = tree.item(selected_item)
        record = item['values']
        # show a message
        showinfo(title='Information', message=','.join(record))


tree.bind('<<TreeviewSelect>>', item_selected)

tree.grid(row=0, column=0, sticky='nsew')

# add a scrollbar
scrollbar = ttk.Scrollbar(root, orient=tk.VERTICAL, command=tree.yview)
tree.configure(yscroll=scrollbar.set)
scrollbar.grid(row=0, column=1, sticky='ns')

# run the app
root.mainloop()Linguagem de código:  Python  ( python )

Saída:

Como funciona.

Primeiro, importe tkintero módulo, ttko submódulo e o showinfofrom tkinter.messagebox:

import tkinter as tk
from tkinter import ttk
from tkinter.messagebox import showinfoLinguagem de código:  Python  ( python )

Segundo, crie a janela raiz, defina seu título e tamanho:

root = tk.Tk()
root.title('Treeview demo')
root.geometry('620x200')Linguagem de código:  Python  ( python )

Terceiro, defina identificadores para colunas:

columns = ('first_name', 'last_name', 'email')Linguagem de código:  Python  ( python )

Quarto, crie um widget Treeview do Tkinter:

tree = ttk.Treeview(root, columns=columns, show='headings')Linguagem de código:  Python  ( python )

Neste código, passamos as colunas para a columnsopção. Oculta show='heading'a primeira coluna (column #0) do Treeview.

A showopção aceita um dos seguintes valores:

  • 'tree'– mostra a coluna #0.
  • 'heading'– mostra a linha do cabeçalho.
  • 'tree headings'– mostra a coluna #0e a linha do cabeçalho. Este é o valor padrão.
  • ''– não mostra a coluna #0ou a linha do cabeçalho.

Quinto, especifique os títulos das colunas:

tree.heading('first_name', text='First Name')
tree.heading('last_name', text='Last Name')
tree.heading('email', text='Email')Linguagem de código:  Python  ( python )

Sexto, gere uma lista de tuplas para exibição no Treeview:

contacts = []
for n in range(1, 100):
    contacts.append((f'first {n}', f'last {n}', f'email{n}@example.com'))Linguagem de código:  Python  ( python )

Sétimo, crie novos itens, um por um, usando o insert()método do widget Treeview:

for contact in contacts:
    tree.insert('', tk.END, values=contact)Linguagem de código:  Python  ( python )

Oito, defina uma função para lidar com o <>evento. Ao selecionar um ou mais itens, o programa mostrará uma caixa de mensagem:

def item_selected(event):
    for selected_item in tree.selection():
        item = tree.item(selected_item)
        record = item['values']
        # show a message
        showinfo(title='Information', message=','.join(record))

tree.bind('<<TreeviewSelect>>', item_selected)Linguagem de código:  Python  ( python )

Nono, coloque o widget Treeview na janela raiz:

tree.grid(row=0, column=0, sticky='nsew')Linguagem de código:  Python  ( python )

Décimo, adicione uma barra de rolagem vertical ao widget Treeview:

# add a scrollbar
scrollbar = ttk.Scrollbar(root, orient=tk.VERTICAL, command=tree.yview)
tree.configure(yscroll=scrollbar.set)
scrollbar.grid(row=0, column=1, sticky='ns')Linguagem de código:  Python  ( python )

Finalmente, exiba a janela raiz:

root.mainloop()Linguagem de código:  Python  ( python )

O programa a seguir também usa o widget Treeview na abordagem de programação orientada a objetos :

import tkinter as tk
from tkinter import ttk
from tkinter.messagebox import showinfo


class App(tk.Tk):
    def __init__(self):
        super().__init__()

        self.title('Treeview demo')
        self.geometry('620x200')

        self.tree = self.create_tree_widget()

    def create_tree_widget(self):
        columns = ('first_name', 'last_name', 'email')
        tree = ttk.Treeview(self, columns=columns, show='headings')

        # define headings
        tree.heading('first_name', text='First Name')
        tree.heading('last_name', text='Last Name')
        tree.heading('email', text='Email')

        tree.bind('<<TreeviewSelect>>', self.item_selected)
        tree.grid(row=0, column=0, sticky=tk.NSEW)

        # add a scrollbar
        scrollbar = ttk.Scrollbar(self, orient=tk.VERTICAL, command=tree.yview)
        tree.configure(yscroll=scrollbar.set)
        scrollbar.grid(row=0, column=1, sticky='ns')

        # generate sample data
        contacts = []
        for n in range(1, 100):
            contacts.append((f'first {n}', f'last {n}', f'email{n}@example.com'))

        # add data to the treeview
        for contact in contacts:
            tree.insert('', tk.END, values=contact)

        return tree

    def item_selected(self, event):
        for selected_item in self.tree.selection():
            item = self.tree.item(selected_item)
            record = item['values']
            # show a message
            showinfo(title='Information', message=','.join(record))


if __name__ == '__main__':
    app = App()
    app.mainloop()
Linguagem de código:  Python  ( python )

Adicionando um item ao widget Treeview

Para adicionar um item (ou uma linha) a um widget Treeview, você usa o insert()método do Treeviewobjeto widget. O exemplo a seguir adiciona um item no final da lista de itens:

tree.insert('', tk.END, values=contact)Linguagem de código:  Python  ( python )

Para adicionar um item no início da lista, você usa zero ( 0) em vez de tk.ENDconstante:

tree.insert('', 0, values=contact)Linguagem de código:  Python  ( python )

O programa a seguir ilustra como adicionar itens ao Treeview:

import tkinter as tk
from tkinter import ttk


class App(tk.Tk):
    def __init__(self):
        super().__init__()

        self.title('Treeview demo')
        self.geometry('620x200')

        self.tree = self.create_tree_widget()

    def create_tree_widget(self):
        columns = ('first_name', 'last_name', 'email')
        tree = ttk.Treeview(self, columns=columns, show='headings')

        # define headings
        tree.heading('first_name', text='First Name')
        tree.heading('last_name', text='Last Name')
        tree.heading('email', text='Email')

        tree.grid(row=0, column=0, sticky=tk.NSEW)

        # adding an item
        tree.insert('', tk.END, values=('John', 'Doe', '[email protected]'))

        # insert a the end
        tree.insert('', tk.END, values=('Jane', 'Miller', '[email protected]'))

        # insert at the beginning
        tree.insert('', 0, values=('Alice', 'Garcia', '[email protected]'))

        return tree


if __name__ == '__main__':
    app = App()
    app.mainloop()Linguagem de código:  Python  ( python )

Excluindo itens de um Treeview

Para excluir um item do Treeview, você usa o método delete() do objeto Treeview. O programa a seguir mostra um Treeview com alguns itens. Clicar em um item irá excluí-lo da árvore:

import tkinter as tk
from tkinter import ttk


class App(tk.Tk):
    def __init__(self):
        super().__init__()

        self.title('Treeview demo')
        self.geometry('620x200')

        self.tree = self.create_tree_widget()

    def create_tree_widget(self):
        columns = ('first_name', 'last_name', 'email')
        tree = ttk.Treeview(self, columns=columns, show='headings')

        # define headings
        tree.heading('first_name', text='First Name')
        tree.heading('last_name', text='Last Name')
        tree.heading('email', text='Email')

        tree.grid(row=0, column=0, sticky=tk.NSEW)

        # adding an item
        tree.insert('', tk.END, values=('John', 'Doe', '[email protected]'))

        # insert a the end
        tree.insert('', tk.END, values=('Jane', 'Miller', '[email protected]'))

        # insert at the beginning
        tree.insert('', 0, values=('Alice', 'Garcia', '[email protected]'))

        tree.bind('<<TreeviewSelect>>', self.item_selected)

        return tree

    def item_selected(self, event):
        for selected_item in self.tree.selection():
            self.tree.delete(selected_item)


if __name__ == '__main__':
    app = App()
    app.mainloop()Linguagem de código:  Python  ( python )

Neste programa.

Primeiro, vincule o evento do item selecionado:

tree.bind('<<TreeviewSelect>>', self.item_selected)Linguagem de código:  Python  ( python )

Segundo, exclua o item selecionado da árvore. Para obter o item selecionado, você usa o selection()método do Treeviewobjeto:

def item_selected(self, event):
    for selected_item in self.tree.selection():
        self.tree.delete(selected_item)Linguagem de código:  Python  ( python )

Personalizando colunas

Para alterar o tamanho de uma coluna e a âncora do item, você pode usar o método column() do objeto Treeview:


tree.column(size, width, anchor)Linguagem de código:  CSS  ( css )

O exemplo a seguir define a largura da coluna de nome e sobrenome como 100 e o e-mail como 200. Ele também define a âncora para o item em cada coluna de acordo:

tree.column('first_name', width=100, anchor=tk.W)
tree.column('last_name', width=100, anchor=tk.W)
tree.column('email', width=200, anchor=tk.CENTER)Linguagem de código:  JavaScript  ( javascript )

Usando Tkinter Treeview para exibir dados hierárquicos

O programa a seguir ilustra como usar o widget TreeView para exibir dados hierárquicos:

import tkinter as tk
from tkinter import ttk
from tkinter.messagebox import showinfo

# create root window
root = tk.Tk()
root.title('Treeview Demo - Hierarchical Data')
root.geometry('400x200')

# configure the grid layout
root.rowconfigure(0, weight=1)
root.columnconfigure(0, weight=1)


# create a treeview
tree = ttk.Treeview(root)
tree.heading('#0', text='Departments', anchor=tk.W)


# adding data
tree.insert('', tk.END, text='Administration', iid=0, open=False)
tree.insert('', tk.END, text='Logistics', iid=1, open=False)
tree.insert('', tk.END, text='Sales', iid=2, open=False)
tree.insert('', tk.END, text='Finance', iid=3, open=False)
tree.insert('', tk.END, text='IT', iid=4, open=False)

# adding children of first node
tree.insert('', tk.END, text='John Doe', iid=5, open=False)
tree.insert('', tk.END, text='Jane Doe', iid=6, open=False)
tree.move(5, 0, 0)
tree.move(6, 0, 1)

# place the Treeview widget on the root window
tree.grid(row=0, column=0, sticky=tk.NSEW)

# run the app
root.mainloop()
Linguagem de código:  Python  ( python )

Saída:

Como funciona.

Vamos nos concentrar na parte do widget Treeview.

Primeiro, crie um widget Treeview e defina seu título.

tree = ttk.Treeview(root)
tree.heading('#0', text='Departments', anchor=tk.W)Linguagem de código:  Python  ( python )

Este widget Treeview possui apenas uma coluna.

Segundo, adicione itens ao widget TreeView:

tree.insert('', tk.END, text='Administration', iid=0, open=False)
tree.insert('', tk.END, text='Logistics', iid=1, open=False)
tree.insert('', tk.END, text='Sales', iid=2, open=False)
tree.insert('', tk.END, text='Finance', iid=3, open=False)
tree.insert('', tk.END, text='IT', iid=4, open=False)Linguagem de código:  Python  ( python )

Cada item é identificado por um iid. Se você pular o iid, o método insert irá gerar um automaticamente. Nesse caso, você precisa ter instruções explícitas iidpara adicionar itens filhos.

Terceiro, adicione dois itens filhos ao item com iid 0 usando os métodos insert() e move():

# adding children of first node
tree.insert('', tk.END, text='John Doe', iid=5, open=False)
tree.insert('', tk.END, text='Jane Doe', iid=6, open=False)
tree.move(5, 0, 0)
tree.move(6, 0, 1)Linguagem de código:  Python  ( python )

Finalmente, coloque o widget Treeview na janela raiz e exiba-o.

# place the Treeview widget on the root window
tree.grid(row=0, column=0, sticky=tk.NSEW)

# run the app
root.mainloop()Linguagem de código:  texto simples  ( texto simples )

Resumo

  • Use um widget Tkinter Treeview para exibir dados tabulares e hierárquicos.
Caderno Tkinter
Anterior
Caderno Tkinter

Próximo
Tela Tkinter

Tela Tkinter

Deixe um comentário

O seu endereço de email não será publicado. Campos obrigatórios marcados com *