Construindo sua primeira GUI Python com Tkinter

Introdução Talvez você tenha acabado de começar a aprender Python e tenha criado um ou dois aplicativos simples. Parabéns! Mas, e agora? Bem, que tal construir uma interface gráfica do usuário ("GUI") para interagir com seu novo e brilhante aplicativo Python? Existem várias opções para criar aplicativos GUI com Python, incluindo e . Este guia, no entanto, irá apresentá-lo ao . PyQt wxPython Tkinter , que significa "interface Tk", é o padrão Python para construção de GUIs e está incluído na . É uma ligação ao kit de , uma biblioteca de GUI gratuita e de código aberto que pode ser usada para construir interfaces gráficas em várias linguagens de programação. Tkinter Python Standard Library ferramentas Tk GUI widgets Este tutorial percorre o design de um aplicativo GUI básico que exibe a hora local em um fuso horário selecionado pelo usuário. As etapas constroem o aplicativo progressivamente e descrevem alguns dos principais conceitos ao trabalhar com o , incluindo o layout dos elementos da GUI, a captura da entrada do usuário e a ligação dos elementos da GUI aos métodos de retorno de chamada. Tkinter Pré-requisitos Para completar este guia, você precisará ter: . Python instalado instalado. pip Instalou a biblioteca de fuso horário . A biblioteca pode ser instalada usando . pytz pip pip install pytz Este guia usará a terminologia forma intercambiável. janela raiz e janela principal de Etapa 1 - Criar um novo aplicativo Python e definir as importações necessárias Crie um novo aplicativo Python chamado e adicione as seguintes instruções de para importar os módulos , e . timezone.py import Tkinter datetime pytz import tkinter as tk import datetime import pytz Etapa 2 - Adicionar fusos horários Este guia incorpora o conjunto de fusos horários dos Estados Unidos, que são uma pequena fração dos fusos horários suportados pelo . A funcionalidade do aplicativo pode ser estendida adicionando nomes de fuso horário adicionais. Uma lista completa de fusos horários disponíveis com pode ser gerada executando o seguinte comando: pytz pytz pytz print(pytz.all_timezones) O conjunto de fusos horários dos Estados Unidos disponíveis via é especificado como uma lista. pytz import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"] Passo 3 - Crie uma Instância da Classe Tk A instanciação da classe cria uma que servirá como a janela principal da GUI do aplicativo de fuso horário. Tk janela raiz import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"] root = tk.Tk() Etapa 4 - Configurar a janela principal Esta etapa configura a janela raiz, particularmente seu título, geometria e capacidade de redimensionamento. Etapa 4a - Definindo o título da janela principal O título da janela é definido usando o método . title import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"] root = tk.Tk() root.title("Simple Timezone Application") Etapa 4b - Configurando a largura e a altura da janela principal Os valores de largura e altura da janela, expressos em pixels, podem ser atribuídos a variáveis para facilitar o acompanhamento do código. import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"] root = tk.Tk() root.title("Simple Timezone Application") window_width = 450 window_height = 175 Etapa 4c - Calculando a posição central da janela principal A janela principal pode ser colocada em qualquer lugar na tela, por exemplo, no centro, no canto superior esquerdo, e juntamente com alguns cálculos simples. Esses dois métodos retornam a largura e a altura da tela que são usadas para calcular as coordenadas apropriadas (x,y) para centralizar a janela principal. Assim como a largura e a altura da janela, os valores da posição central também podem ser atribuídos a variáveis para tornar o código mais legível. winfo_screenwidth() winfo_screenheight() import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"] root = tk.Tk() root.title("Simple Timezone Application") window_width = 450 window_height = 175 screen_width = root.winfo_screenwidth() screen_height = root.winfo_screenheight() center_x = int((screen_width - window_width)/2) center_y = int((screen_height - window_height)/2) Observe que os valores e também são expressos em pixels e é usado para garantir que ambos os valores calculados sejam inteiros. center_x center_y int Etapa 4d - Configurando a Geometria da Janela Principal A geometria da janela , que especifica o tamanho e a posição da janela principal, é definida usando o método de da janela raiz. Para tornar as coisas simples, você pode usar um literal sting formatado, ou , que irá interpolar as expressões de variáveis geométricas em tempo de execução. De acordo com o bloco de código a seguir, o literal é passado para o método de como um parâmetro. root geometry f-string f-string geometry import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"] root = tk.Tk() root.title("Simple Timezone Application") window_width = 450 window_height = 175 screen_width = root.winfo_screenwidth() screen_height = root.winfo_screenheight() center_x = int((screen_width - window_width)/2) center_y = int((screen_height - window_height)/2) root.geometry(f"{window_width}x{window_height}+{center_x}+{center_y}") Etapa 4e - Configurando o redimensionamento da janela principal A capacidade de redimensionamento da janela raiz ao longo de seus eixos x e y pode ser definida por meio do método da janela raiz. O método aceita parâmetros de e , nessa ordem. Um valor ou diferente de zero para qualquer parâmetro especifica que a janela principal é redimensionável ao longo do eixo associado. Um valor ou para qualquer parâmetro especifica que a janela principal não é redimensionável ao longo do eixo especificado. O aplicativo de timer usará um valor de para altura e largura para evitar que a janela principal seja redimensionada. resizable resizable height width True False 0 False import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"] root = tk.Tk() root.title("Simple Timezone Application") window_width = 450 window_height = 175 screen_width = root.winfo_screenwidth() screen_height = root.winfo_screenheight() center_x = int((screen_width - window_width)/2) center_y = int((screen_height - window_height)/2) root.geometry(f"{window_width}x{window_height}+{center_x}+{center_y}") root.resizable(False, False) Etapa 5 - Especifique uma grade para o layout do widget Os podem ser organizados na parte superior da janela principal de diferentes maneiras usando . Geralmente, os widgets podem ser organizados de 3 maneiras: widgets gerenciadores de geometria usando o método . O gerenciador de geometria organiza os widgets em blocos antes de serem adicionados a uma janela raiz ou widget pai. Uma maneira imperfeita, mas talvez útil, de pensar sobre a é pensar em adicionar itens de mercearia a uma sacola de compras. Os itens não são necessariamente adicionados a locais pré-definidos na sacola. Em vez disso, eles são um após o outro, usando o espaço disponível até que todos os itens tenham sido colocados na sacola. O gerenciador de geometria funciona de maneira semelhante. Empacotado pack() pack() embalagem embalados pack() usando o método . O gerenciador de geometria os widgets em posições específicas e predefinidas na janela raiz ou no widget pai. Este gerenciador de geometria é obviamente útil ao construir layouts de GUI precisos. Colocado place() place() coloca Organizado como uma usando o método . As grades são tabelas bidimensionais de linha/coluna. Os widgets são adicionados a uma grade especificando a linha e a coluna específicas onde o widget deve ser colocado. As grades são configuradas usando os métodos e da janela raiz. Cada um desses métodos tem um e um atributo de . O atributo especifica a posição da coluna ou linha usando uma base inicial de . O atributo de especifica o tamanho de uma determinada coluna ou linha em relação a outras colunas. Por exemplo, se a tiver peso e a tiver peso , a será 3 vezes maior que a . grade grid() columnconfigure rowconfigure index weight index 0 weight coluna 0 1 coluna 1 3 coluna 1 coluna 0 As grades são úteis ao colocar elementos próximos uns dos outros e são relativamente simples de implementar. O aplicativo de fuso horário usará uma grade da janela principal dividida em 4 colunas iguais. import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"] root = tk.Tk() root.title("Simple Timezone Application") window_width = 450 window_height = 175 screen_width = root.winfo_screenwidth() screen_height = root.winfo_screenheight() center_x = int((screen_width - window_width)/2) center_y = int((screen_height - window_height)/2) root.geometry(f"{window_width}x{window_height}+{center_x}+{center_y}") root.resizable(False, False) root.columnconfigure(0, weight=1) root.columnconfigure(1, weight=1) root.columnconfigure(2, weight=1) root.columnconfigure(3, weight=1) Etapa 6 - Adicionar widgets Nesta etapa, os widgets são adicionados à grade da janela principal definida na Etapa 4. A aplicação de fuso horário utilizará 3 widgets : TKinter Label Listbox Button Os widgets e do Tkinter são exatamente como são nomeados. O widget permite que o programador exiba texto (ou seja, um rótulo) e o widget é usado para exibir botões. O widget é usado para selecionar um valor (ou valores) de uma lista de opções. Label Button Label Button Listbox Claro, existem outros widgets além dos 3 listados acima, como os , e . A é um recurso útil para aprender mais sobre os widgets disponíveis através do kit de ferramentas Tk. SpinBox Entry Message documentação formal dos comandos Tk Etapa 6a - Criar widgets Uma instância de cada classe de widget é criada para um determinado widget usado com o design da GUI. O aplicativo de fuso horário usa 4 instâncias de widget: 2 widgets de , 1 widget de caixa de e 1 widget de . Label Listbox Button import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"] root = tk.Tk() root.title("Simple Timezone Application") window_width = 450 window_height = 175 screen_width = root.winfo_screenwidth() screen_height = root.winfo_screenheight() center_x = int((screen_width - window_width)/2) center_y = int((screen_height - window_height)/2) root.geometry(f"{window_width}x{window_height}+{center_x}+{center_y}") root.resizable(False, False) root.columnconfigure(0, weight=1) root.columnconfigure(1, weight=1) root.columnconfigure(2, weight=1) root.columnconfigure(3, weight=1) # Instance of Label widget class for selection prompt. select_timezone_label = tk.Label(root, text="Please select a timezone.") # Instance of Listbox class for selection of timezone from list. list_var = tk.Variable(value=timezones) select_timezone_listbox = tk.Listbox(root, listvariable=list_var, height=1) # Instance of Button class to get the local time in the selected timezone. select_timezone_button = tk.Button(root, text="Get Time") # Second instance of the Label class to display the local time in the selected timezone. time_label = tk.Label(root, text="") Conforme visto no bloco de código acima, cada instância do widget é "anexada" à janela . O widget também requer a instanciação de uma classe especial Tkinter que é usada para fornecer ao widget a lista de opções de fuso horário que o usuário pode selecionar por meio do atributo . O texto exibido por cada widget pode ser configurado usando o atributo . O valor de texto para é deixado em branco, pois será definido dinamicamente sempre que o usuário "obter" o horário de um fuso horário selecionado. root Listbox Variable() listvariable Listbox Label text time_label Etapa 6b - Colocar widgets na grade As instâncias do widget criadas na Etapa 5a podem ser colocadas na grade definida na Etapa 4 usando o método . O aplicativo de fuso horário usará os seguintes atributos do método para definir o layout: grid() grid() : Especifica a coluna específica onde o widget será colocado usando uma base . column 0 : Especifica a linha específica onde o widget será colocado usando uma base . row 0 : especifica que o widget deve abranger o número especificado de colunas. Por exemplo, um widget com um valor abrangerá 3 colunas, mesmo que o próprio widget seja menor que 3 colunas. columnspan columnspan=3 : O comportamento padrão do Tkinter é colocar um widget no centro horizontal e vertical da célula (ou seja, posição particular de linha/coluna) onde ele é colocado. Esse comportamento padrão pode ser substituído usando o atributo que usa valores semelhantes a bússola, incluindo , , , , , , e , para alinhar o widget em um local específico da célula do widget. Por exemplo, especifica que o widget deve ser alinhado ao canto oeste de sua célula de grade. Analogamente, especifica que o widget deve ser alinhado ao canto leste de sua célula de grade. sticky sticky NW N NE W E SW S SE dentro sticky=tK.W sticky=tK.E , : Os atributos e são usados para adicionar o preenchimento dos eixos x e y, respectivamente, com valores especificados em pixels. Naturalmente, o preenchimento pode fornecer uma GUI com aparência mais profissional, garantindo que os widgets não "se choquem" diretamente contra as bordas da janela raiz ou de outros widgets. padx pady padx pady import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"] root = tk.Tk() root.title("Simple Timezone Application") window_width = 450 window_height = 175 screen_width = root.winfo_screenwidth() screen_height = root.winfo_screenheight() center_x = int((screen_width - window_width)/2) center_y = int((screen_height - window_height)/2) root.geometry(f"{window_width}x{window_height}+{center_x}+{center_y}") root.resizable(False, False) root.columnconfigure(0, weight=1) root.columnconfigure(1, weight=1) root.columnconfigure(2, weight=1) root.columnconfigure(3, weight=1) # Instance of Label widget class for selection prompt. select_timezone_label = tk.Label(root, text="Please select a timezone.") # Instance of Listbox class for selection of timezone from list. list_var = tk.Variable(value=timezones) select_timezone_listbox = tk.Listbox(root, listvariable=list_var, height=1) # Instance of Button class to get the local time in the selected timezone. select_timezone_button = tk.Button(root, text="Get Time") # Second instance of the Label class to display the local time in the selected timezone. time_label = tk.Label(root, text="") # Place widgets on grid. select_timezone_label.grid(column=0, row=0, columnspan=4, sticky=tk.W, padx=10, pady=10) select_timezone_listbox.grid(column=0, row=1, columnspan=3, sticky=tk.EW, padx=10, pady=10) select_timezone_button.grid(column=4, row=1, sticky=tk.E, padx=10, pady=10) time_label.grid(column=0, row=4, columnspan=4, sticky=tk.W, padx=10, pady=10) Etapa 7 - Criar método de retorno de chamada do botão Get Time Um método de retorno de chamada precisa ser definido para manipular eventos quando o usuário clicar no botão criado na Etapa 5. select_timezone_button Etapa 7a - Vinculando o botão Get Time Antes de definir a lógica de retorno de chamada, é útil vincular primeiro o botão ao nome do método que eventualmente abrangerá o código de retorno de chamada. O método pode ser usado em conjunto com uma função para vincular o ao método de retorno de chamada especificado. Além disso, observe que a função é usada para passar referências aos widgets e como parâmetros de retorno de chamada. Na verdade, esses parâmetros de retorno de chamada são necessários, pois e estão dentro do escopo global. No entanto, é indiscutivelmente útil demonstrar como os argumentos podem ser passados para a função de retorno de chamada. bind() lambda select_timezone_button lambda select_timezone_listbox time_label não select_timezone_listbox time_label import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"] root = tk.Tk() root.title("Simple Timezone Application") window_width = 450 window_height = 175 screen_width = root.winfo_screenwidth() screen_height = root.winfo_screenheight() center_x = int((screen_width - window_width)/2) center_y = int((screen_height - window_height)/2) root.geometry(f"{window_width}x{window_height}+{center_x}+{center_y}") root.resizable(False, False) root.columnconfigure(0, weight=1) root.columnconfigure(1, weight=1) root.columnconfigure(2, weight=1) root.columnconfigure(3, weight=1) # Instance of Label widget class for selection prompt. select_timezone_label = tk.Label(root, text="Please select a timezone.") # Instance of Listbox class for selection of timezone from list. list_var = tk.Variable(value=timezones) select_timezone_listbox = tk.Listbox(root, listvariable=list_var, height=1) # Instance of Button class to get the local time in the selected timezone. select_timezone_button = tk.Button(root, text="Get Time") # Second instance of the Label class to display the local time in the selected timezone. time_label = tk.Label(root, text="") # Place widgets on grid. select_timezone_label.grid(column=0, row=0, columnspan=4, sticky=tk.W, padx=10, pady=10) select_timezone_listbox.grid(column=0, row=1, columnspan=3, sticky=tk.EW, padx=10, pady=10) select_timezone_button.grid(column=4, row=1, sticky=tk.E, padx=10, pady=10) time_label.grid(column=0, row=4, columnspan=4, sticky=tk.W, padx=10, pady=10) select_timezone_button.bind(" ", lambda e, args=[select_timezone_listbox, time_label]: get_timezone_time(e, args)) Etapa 7b - Definindo a lógica de retorno de chamada A lógica de retorno de chamada para lidar com eventos de clique de botão é definida abaixo. def get_timezone_time(e, args): select_timezone_listbox = args[0] time_label = args[1] selection_index = select_timezone_listbox.curselection() selected_timezone = select_timezone_listbox.get(selection_index) now_time = datetime.datetime.now() tz_time = now_time.astimezone(pytz.timezone(selected_timezone)) tz_formatted = tz_time.strftime("%H:%M:%S") time_label.configure({"text": f"The time in {selected_timezone} is {tz_formatted}."}) time_label.update() Os e são usados para recuperar o fuso horário selecionado do usuário a partir da referência ao widget . A hora atual do usuário é então convertida no horário do fuso horário selecionado. Finalmente, o método é usado para alterar o atributo da referência para o com a hora local no fuso horário selecionado. Observe que o método é usado para "forçar" o widget a se atualizar com o novo valor de texto. curselection() get() select_timezone_listbox configure text time_label update() time_label Etapa 8 - Concluir e executar o aplicativo O método da janela raiz é aplicado como a última linha de código. O método executará a GUI em um loop infinito até que o usuário saia. mainloop() mainloop() O código completo é o seguinte: import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"] def get_timezone_time(e, args): select_timezone_listbox = args[0] time_label = args[1] selection_index = select_timezone_listbox.curselection() selected_timezone = select_timezone_listbox.get(selection_index) now_time = datetime.datetime.now() tz_time = now_time.astimezone(pytz.timezone(selected_timezone)) tz_formatted = tz_time.strftime("%H:%M:%S") time_label.configure({"text": f"The time in {selected_timezone} is {tz_formatted}."}) time_label.update() root = tk.Tk() root.title("Simple Timezone Application") window_width = 450 window_height = 175 screen_width = root.winfo_screenwidth() screen_height = root.winfo_screenheight() center_x = int((screen_width - window_width)/2) center_y = int((screen_height - window_height)/2) root.geometry(f"{window_width}x{window_height}+{center_x}+{center_y}") root.resizable(False, False) root.columnconfigure(0, weight=1) root.columnconfigure(1, weight=1) root.columnconfigure(2, weight=1) root.columnconfigure(3, weight=1) # Instance of Label widget class for selection prompt. select_timezone_label = tk.Label(root, text="Please select a timezone.") # Instance of Listbox class for selection of timezone from list. list_var = tk.Variable(value=timezones) select_timezone_listbox = tk.Listbox(root, listvariable=list_var, height=1) # Instance of Button class to get the local time in the selected timezone. select_timezone_button = tk.Button(root, text="Get Time") # Second instance of the Label class to display the local time in the selected timezone. time_label = tk.Label(root, text="") # Place widgets on grid. select_timezone_label.grid(column=0, row=0, columnspan=4, sticky=tk.W, padx=10, pady=10) select_timezone_listbox.grid(column=0, row=1, columnspan=3, sticky=tk.EW, padx=10, pady=10) select_timezone_button.grid(column=4, row=1, sticky=tk.E, padx=10, pady=10) time_label.grid(column=0, row=4, columnspan=4, sticky=tk.W, padx=10, pady=10) # Bind button to callback. select_timezone_button.bind(" ", lambda e, args=[select_timezone_listbox, time_label]: get_timezone_time(e, args)) root.mainloop() Quando o aplicativo é iniciado, a GUI deve se parecer com: Para usar o aplicativo, clique na caixa de listagem e use as teclas de cursor para cima/para baixo do teclado para percorrer as opções de fuso horário. Clique no botão para exibir a hora atual no fuso horário selecionado. Get Time Próximos passos Parabéns por criar seu primeiro aplicativo GUI Python com o ! Conforme mencionado na Introdução, este guia foi elaborado para apresentar a você alguns conceitos básicos. A documentação da e as referências de mencionadas anteriormente são dois recursos fantásticos para ajudá-lo a aprender sobre os recursos e funcionalidades mais avançados do Tkinter. Tkinter Python Standard Library documentação de comandos Tk Os aplicativos Tkinter GUI às vezes são criticados por terem uma aparência não nativa. Isso pode ser verdade. Mas os widgets do kit de ferramentas são altamente configuráveis e os aplicativos Tkinter GUI podem ser construídos com relativa rapidez, sem a necessidade de instalar nenhum pacote Python externo. Além da documentação formal, existem inúmeros tutoriais disponíveis na Internet para aprender a construir aplicativos GUI mais sofisticados com o Tkinter.