Lección 12 · 12 de 20
Barra de herramientas con iconos · tkinter
Construya una cinta de botones en tkinter: grupos con LabelFrame y botones con iconos dibujados en código con PhotoImage.
Los iconos no vienen de archivos: icon() crea un PhotoImage de 24 × 24 y le pinta rectángulos de colores con put(color, to=(x1, y1, x2, y2)). Una hoja, una carpeta, un disquete, dos hojas superpuestas y un portapapeles salen de dos o tres rectángulos cada uno.
Se guardan en el diccionario icons, y no es un detalle: si ninguna variable sujeta una imagen de tkinter, Python la libera y el botón se queda sin icono.
La cinta es un ttk.Frame arriba con un ttk.LabelFrame por grupo («File» y «Clipboard»). Cada botón lleva image=, text= y compound="top", que pone el icono encima del texto, y style="Toolbutton", el estilo de ttk para botones de barra de herramientas: más compactos y, en Windows y Linux, planos hasta que pasa el ratón.
Todos los botones comparten una función: lambda n=name: ... guarda el nombre de cada uno (el n=name hace falta para que cada botón recuerde el suyo y no el último del bucle), y la etiqueta hundida de abajo dice cuál se ha pulsado.
En DMarlon Studio está la Cinta de opciones en la paleta: pestañas, grupos y botones grandes con símbolos que se definen en el inspector; el estudio escribe el código de tkinter y cada botón llama a un método con su ruta.
Código · main.py
import tkinter as tkfrom tkinter import ttkroot = tk.Tk()root.title("Ribbon")root.geometry("520x260")def icon(*boxes): # a 24x24 icon from (color, x1, y1, x2, y2) rectangles img = tk.PhotoImage(width=24, height=24) for color, *box in boxes: img.put(color, to=tuple(box)) return imgicons = { # keep them in a dict: an image without references disappears "New": icon(("#868e96", 4, 1, 20, 23), ("white", 5, 2, 19, 22), ("#adb5bd", 8, 8, 16, 9)), "Open": icon(("#e0a526", 1, 5, 11, 9), ("#f2b632", 1, 8, 23, 21)), "Save": icon(("#3b5bdb", 2, 2, 22, 22), ("white", 7, 3, 17, 9), ("#dbe4ff", 5, 13, 19, 20)), "Copy": icon(("#adb5bd", 2, 2, 15, 17), ("#868e96", 9, 7, 22, 22), ("white", 10, 8, 21, 21)), "Paste": icon(("#a9712b", 3, 4, 21, 23), ("white", 6, 8, 18, 21), ("#495057", 8, 1, 16, 6)),}status = ttk.Label(root, text="Clicked: Save", relief="sunken", padding=(6, 2))status.pack(side="bottom", fill="x")# The ribbon: groups (LabelFrame) of toolbar buttons, the icon above the text.ribbon = ttk.Frame(root, padding=6)ribbon.pack(fill="x")for group, names in (("File", "New Open Save"), ("Clipboard", "Copy Paste")): box = ttk.LabelFrame(ribbon, text=group, padding=4) box.pack(side="left", padx=4) for name in names.split(): ttk.Button(box, text=name, image=icons[name], compound="top", style="Toolbutton", command=lambda n=name: status.config(text=f"Clicked: {n}")).pack(side="left", padx=2)tk.Text(root, bd=1, relief="solid").pack(fill="both", expand=True, padx=8, pady=(0, 8))root.mainloop()Para recordar
put(color, to=...)basta para iconos sencillos.- Guarde las imágenes en una variable o un diccionario.
compound="top"pone el icono encima del texto.lambda n=name:fija el valor de cada botón.
Ejercicio
Añada un grupo «Font» con un botón «Bold» cuyo icono sea una B hecha con rectángulos negros.