DS & II

capitulo_15_gui

Leitura de 3 min

Capítulo 15: Interface Gráfica Básica (Tkinter) 🕹️🖼️

Neste capítulo, vamos aprender a criar janelas e botões de verdade usando a biblioteca Tkinter, com o tema de Jogos Arcade/Retro!

📖 O que é Tkinter?

O Tkinter é a biblioteca padrão do Python para criação de interfaces gráficas de usuário (GUI). Com ele, podemos criar janelas, botões, campos de texto e muito mais.

Veja a hierarquia visual dos componentes da nossa janela:

graph TD
    A["🪟 Janela Principal: tk.Tk"] --> B["📝 Rótulo: tk.Label"]
    A --> C["🔘 Botão: tk.Button"]

📖 Exemplo Guiado: Menu do Jogo

Vamos criar uma janela simples que representa o menu de um jogo arcade.

  1. Crie o arquivo menu_arcade.py na pasta src/:
import tkinter as tk
from tkinter import messagebox
 
# Função que será chamada quando o botão for clicado
def iniciar_jogo():
    messagebox.showinfo("Arcade", "O jogo está iniciando... Prepare-se!")
 
# Criando a janela principal
janela = tk.Tk()
janela.title("Arcade Retro")
janela.geometry("300x200")
 
# Criando um rótulo (texto)
rotulo = tk.Label(janela, text="BEM-VINDO AO ARCADE!", font=("Arial", 14))
rotulo.pack(pady=20)
 
# Criando um botão
botao = tk.Button(janela, text="PLAY", command=iniciar_jogo, bg="green", fg="white", font=("Arial", 12))
botao.pack(pady=10)
 
# Iniciando o loop da janela
janela.mainloop()

🕹️ Como Executar e Testar no VS Code

  1. Abra o arquivo menu_arcade.py.
  2. Clique no botão Run Python File.

Resultado Esperado: Uma janela gráfica se abrirá no seu computador com o título “Arcade Retro”, um texto e um botão verde escrito “PLAY”. Ao clicar no botão, uma caixinha de mensagem aparecerá!

🛠️ Prática Obrigatória 1: Botão de Créditos

Adicione um segundo botão na janela chamado “Créditos” que, ao ser clicado, exiba uma mensagem com o seu nome (o desenvolvedor).

🛠️ Prática Obrigatória 2: Contador de Moedas (Insert Coin)

Crie uma nova janela onde há um texto dizendo “Moedas: 0” e um botão escrito “Inserir Moeda”. Cada vez que o botão for clicado, o número de moedas deve aumentar! (Dica: use uma variável global ou mude o texto do rótulo).

🔑 Gabarito de Código

Prática 1: creditos.py (Adicionando ao menu)

import tkinter as tk
from tkinter import messagebox
 
def iniciar_jogo():
    messagebox.showinfo("Arcade", "O jogo está iniciando!")
 
def exibir_creditos():
    messagebox.showinfo("Créditos", "Desenvolvido por: Seu Nome")
 
janela = tk.Tk()
janela.title("Arcade Retro")
janela.geometry("300x250")
 
rotulo = tk.Label(janela, text="BEM-VINDO AO ARCADE!", font=("Arial", 14))
rotulo.pack(pady=20)
 
botao_play = tk.Button(janela, text="PLAY", command=iniciar_jogo, bg="green", fg="white")
botao_play.pack(pady=5)
 
botao_creditos = tk.Button(janela, text="Créditos", command=exibir_creditos, bg="blue", fg="white")
botao_creditos.pack(pady=5)
 
janela.mainloop()

Prática 2: contador_moedas.py

import tkinter as tk
 
moedas = 0
 
def inserir_moeda():
    global moedas
    moedas += 1
    rotulo.config(text=f"Moedas: {moedas}")
 
janela = tk.Tk()
janela.title("Insert Coin")
janela.geometry("200x150")
 
rotulo = tk.Label(janela, text="Moedas: 0", font=("Arial", 16))
rotulo.pack(pady=20)
 
botao = tk.Button(janela, text="Inserir Moeda", command=inserir_moeda)
botao.pack(pady=10)
 
janela.mainloop()

📤 Instruções de Entrega (GitHub Desktop + Microsoft Teams)

(Siga o mesmo padrão do Capítulo 01)

← Capitulo Anterior | Proximo Capitulo →

Visão de gráfico

Backlinks