TUTORIAL 5
Lenguaje de programación: Python
Autor: José Gerardo Carrillo González
Contenido:
Tkinter..............................................................................................................................................2
Ventana principal.........................................................................................................................2
Widgets........................................................................................................................................4
Button......................................................................................................................................5
Checkbutton.............................................................................................................................6
Entry........................................................................................................................................7
Label........................................................................................................................................7
Funciones a llamar con los widgets.........................................................................................8
Referencias....................................................................................................................................12
Tkinter
Tkinter es la interfaz de Python con Tk, este es un kit de herramientas de widgets (código abierto
y multiplataforma) para crear una interfaz gráfica de usuario (GUI). Para probar si Tkinter
funciona escribimos en la pantalla IDLE:
import tkinter
tkinter._test()
Importamos tkinter y con la instrucción tkinter._test() se debe desplegar una ventana, la cual
muestra la versión que está instalada.
Ventana principal
A continuación, las instrucciones para generar y manipular una ventana.
root = [Link]()
Con esta instrucción creamos un objeto de clase Tk, este objeto genera la ventana que funciona
como la raíz o base de la interfaz, en esta estarán contenidos los widgets. Ejemplos de widgets
(los objetos que podemos encontrar en una ventana) son: botón, etiqueta, entrada, menú,
mensaje, barra de desplazamiento, texto. Con el método title le ponemos título a la ventana:
[Link]("Título de la ventana principal")
Con el método attributes establecemos el nivel de transparencia de la ventana, con 0.0 indicamos
que es totalmente transparente, y con 1.0 totalmente opaca:
[Link]('-alpha',1)
Con el método iconbitmap podemos reemplazar la figura que aparece en la esquina superior
izquierda de la ventana por el icono de nuestra preferencia. El icono debe estar en formato .ico y
debemos escribir la ruta donde se encuentra:
[Link]('/la/ruta/a/[Link]')
Con el método resizable indicamos si el ancho (width) y el alto (height) de la ventana se pueden
reajustar o no. Con True indicamos que es reajustable, con False indicamos que no lo es.
[Link](width = True, height = True)
Con minsize podemos establecer las medidas mínimas (unidades en pixeles) del ancho
(min_width) y del alto (min_height). Con maxsize podemos establecer las medidas máximas
(unidades en pixeles) del ancho (max_width) y del alto (max_height); 1 cm = 37.795 pixeles
[Link](min_width, min_height)
[Link](max_width, max_height)
Con geometry establecemos el ancho y el alto de la ventana, y la posicionamos con respecto a la
pantalla.
[Link](f'{window_width}x{window_height}± { x } ± { y }')
Tenemos que window_widht es el ancho de la ventana en pixeles, window_height es la altura de
la ventana en pixeles. Con x=+37, indicamos que el margen izquierdo de la ventana se encuentre
a 1 cm del margen izquierdo de la pantalla, con x=-37 indicamos que el margen
derecho de la ventana se encuentre a 1 cm del margen derecho de la pantalla. Con
y=+37, indicamos que el margen superior de la ventana se encuentre a 1 cm del
margen superior de la pantalla, con y=-37 indicamos que el margen inferior de la ventana se
encuentre a 1 cm del margen inferior de la pantalla. Los valores window_width,
window_height, x, y, deben ser tipo int. Una manera de centrar la ventana es obteniendo las
medidas actuales de la pantalla:
screen_width = root.winfo_screenwidth()
screen_height = root.winfo_screenheight()
Luego establecemos el ancho (window_width) y alto (window_height) de la ventana y
calculamos las coordenadas donde la ubicaremos:
window_width = 378
window_height = 378
x = round( (screen_width/2) - (window_width/2))
y = round( (screen_height/2) - (window_height/2))
Ejemplo: En Código 1 se genera una ventana personalizada con los métodos presentados
anteriormente y adicionalmente se incluye una función para convertir centímetros a pixeles.
Código 1.
Salida:
Widgets
Los controles en una aplicación GUI se conocen comúnmente como widgets. Con el módulo
tkinter tendremos a nuestra disposición los siguientes widgets: Button, Checkbutton, Entry,
Frame, Label, LabelFrame, Menubutton, PanedWindow, Radiobutton, Scale, Scrollbar, Spinbox,
Combobox, Notebook, Progressbar, Separator, Sizegrip y Treeview. A continuación, los widgets
para la GUI de una calculadora sencilla.
Button
Para crear un botón, lo haremos de la siguiente manera:
NOMBRE_B=[Link](container, text='algo de texto', command=nombre_función,
state="normal")
Para conocer todas las opciones de un botón, ver referencia [1]. De acuerdo con la sintaxis
anterior, NOMBRE_B hace referencia al widget button, container es el nombre del componente
principal (la ventana base) donde se colocará el botón, text es igual al texto que se desplegará en
el botón, command es igual a un objeto de clase function por lo que aquí escribimos el nombre
de la función (sin paréntesis, para evitar llamarla) que se llamará al darle clic al botón, state es
igual a "normal" para tener el botón habilitado (que es el valor por default) y es igual a
"disabled" para que no esté habilitado. Diseñaremos cuatro botones: el de sumar, restar,
multiplicar, y dividir. A continuación, el botón de sumar como ejemplo.
b_sumar=[Link](root, text='+', command=f_sum, state="normal")
b_sumar.place(x=37, y=37, width=37, height=37)
El nombre del botón es b_sumar, colocaremos el botón en la ventana base root, el texto que
aparecerá en el botón es '+', al presionar el botón se hace una llamada a la función f_sum la cual
no tiene parámetros, por lo tanto, es llamada sin argumentos. En caso de que al llamar f_sum
tuviéramos que pasarle argumentos, y ya que command debe ser igual a una referencia a la
función, podemos usar una función intermedia que sería la que, al presionar el botón, llame la
función con argumentos. Ejemplo:
b_sumar=[Link](root, text='+', command=f1)
Definiendo f1 de la siguiente manera:
def f1():
f_sum(p1,p2)
Lo anterior para el caso en que al llamar f_sum se le tuvieran que pasar los argumentos p1 y p2.
Otra manera de resolver esto sería:
b_sumar=[Link](root, text='+', command=lambda : f_sum(p1,p2))
Al dar clic al botón la función anónima se manda a llamar, la cual a su vez lo que hace es llamar
la funcion f_sum(p1,p2). Para una explicación detallada ver referencia [2].
Con el método b_sumar.place(x, y, width, height) posicionamos b_sumar (con respecto a la
ventana donde está contenido, es decir root) en las coordenadas (x,y), y le damos dimensiones a
lo ancho (width) y a lo alto (height). Las unidades para posicionarlo, como para darle dimensión,
son en pixeles. Los botones para hacer el resto de las operaciones son:
b_restar=[Link](root,text='-',command=f_res)
b_restar.place(x=37, y=37*3,width=37,height=37)
b_multiplicar=[Link](root,text='*',command=f_mul)
b_multiplicar.place(x=37, y=37*5,width=37,height=37)
b_dividir=[Link](root,text='/',command=f_div)
b_dividir.place(x=37, y=37*7,width=37,height=37)
Adicionalmente, necesitaremos un botón para que al presionarlo elimine lo que actualmente
muestran los widgets entry, que usaremos como entradas y salidas de información. El botón
queda así:
b_limpiar=[Link](root,text='Borrar',command=limpiar)
b_limpiar.place(x=37*5, y=37*5)
Checkbutton
Con un botón de verificación podemos llamar una función cuando se le dé clic, en este caso lo
usaremos para habilitar (deshabilitar) un botón. Para crear un checkbutton escribimos:
NOMBRE_BV=[Link](container, text='algo de texto', command=nombre_función,
variable=nombre_variable, onvalue=1, offvalue=0)
Para conocer las demás opciones de un checkbutton, ver [3]. De acuerdo con la sintaxis
presentada, NOMBRE_BV hace referencia al widget checkbutton, container es el nombre de la
ventana donde se colocará el checkbutton, text es igual al texto que se desplegara, command es
igual a la referencia de la función que se desea llamar, variable es igual al estado del checkbutton
(un valor asignado en nombre_variable). El checkbutton puede estar palomeado (onvalue=1), o
no palomeado (offvalue=0); por defecto se manejan estos valores pero se pueden cambiar. De
acuerdo con los valores de onvalue y offvalue, si de entrada se requiere que el checkbutton este
palomeado, entonces nombre_variable=1. Para habilitar y deshabilitar los botones b_sumar y
b_restar usaremos los siguientes checkbuttons:
m1 = IntVar(); [Link](1)
m2 = IntVar(); [Link](1)
c_sumar=[Link](root, text='Sumar', variable=m1, command=h_sumar)
c_sumar.place(x=37*3, y=37)
c_restar=[Link](root, text='Restar', variable=m2, command=h_restar)
c_restar.place(x=37*5, y=37)
Las variables de control, que se utilizan para manipular valores de los widgets, pueden ser de
tipo numérico, cadena, y booleano. Para declarar una variable de control, asignarle un valor, y
leer el valor que tiene, ver referencia [4]. En el ejemplo se han declarado m1 y m2 de tipo entero
y hacen referencia a un 1.
Entry
Entry es el widget que usaremos para mostrar y leer información. Para crearlo:
NOMBRE_E=[Link](container, textvariable=nombre_dato)
Las demás opciones de este widget en [5]. NOMBRE_E hace referencia al widget entry,
container es el nombre de la ventana donde se colocará el widget, y textvariable es igual a una
variable que tiene por valor lo que va a desplegar el widget. Además de desplegar información,
en el widget entry se puede introducir información, esta será referenciada con nombre_dato. Para
nuestro ejemplo tenemos:
e1=DoubleVar();e2=DoubleVar();s=DoubleVar()
limpiar()
entrada1=[Link](root, textvariable=e1)
entrada2=[Link](root, textvariable=e2)
[Link](x=37*3, y=37*3,width=37,height=37)
[Link](x=37*5, y=37*3,width=37,height=37)
salida=[Link](root, textvariable=s)
[Link](x=37*7, y=37*3,width=37,height=37)
Tenemos que entrada1 y entrada2 las usaremos como entradas de información, y que salida será
donde desplegaremos el resultado. Por lo que e1 y e2 harán referencia al valor de los operandos,
y s al resultado de la operación. Las variables e1, e2, y s se han declarado de tipo flotante.
Label
A pesar de no ser usado en el ejemplo de la calculadora, el widget Label se usa para mostrar un
texto. La sintaxis es:
NOMBRE_L=[Link](container, text='algo de texto', font=("fuente", x))
El resto de las opciones para este widget en [6]. NOMBRE_L hace referencia al widget label,
container es el nombre de la ventana donde se colocará la etiqueta, text es igual al texto que se
desplegará (o igual al nombre que hace referencia a un objeto de clase str), font = ("fuente", x),
donde "fuente" es el tipo de fuente del texto desplegado y x es el tamaño de la fuente.
Funciones a llamar con los widgets
Las funciones que mandamos a llamar con los widgets son:
def f_sum():
[Link]([Link]() + [Link]())
def f_res():
[Link]([Link]() - [Link]())
def f_mul():
[Link]([Link]() * [Link]())
def f_div():
if [Link]()==0:
[Link](title='Error', message= 'Zero Division Error')
return
[Link]([Link]() / [Link]())
def h_sumar():
if [Link]()==0:
b_sumar['state'] = 'disabled'
else:
b_sumar['state'] = 'normal'
def h_restar():
if [Link]()==0:
b_restar['state'] = 'disabled'
else:
b_restar['state'] = 'normal'
def limpiar():
[Link](0);[Link](0);[Link](0)
La funcion f_sum() suma e1 y e2, que son las variables de control de los widgets entrada1 y
entrada2, respectivamente, y el resultado es referenciado con s, que es la variable de control del
widget salida. Con la función f_res() se hace el equivalente a s=e1-e2, con f_mul() a s=e1*e2, y
con f_div() a s=e1/e2. Para dividir e1/e2, si e2=0 no será posible hacer la división, por lo que en
f_div si e2=0 desplegamos un mensaje en pantalla y evitamos hacer la división terminando la
función con return. Para desplegar el mensaje lo hacemos con:
[Link](title='Aquí va el título', message= 'Aquí va el mensaje')
La función h_sumar lo que hace es, dependiendo del valor de m1, cambiar el estado del botón
b_sumar. Inicialmente m1=1, por lo que el Checkbutton c_sumar esta palomeado, al darle clic a
c_sumar pasa a estar deseleccionado por lo que ahora m1=0 y se llama la función h_sumar, en
esta tenemos que si m1=0 se deshabilita b_sumar mediante b_sumar['state'] = 'disabled'; luego, al
dar clic a c_sumar pasa a estar palomeado, el valor de m1=1 y se llama la funcion h_sumar, ya
que m=1 entonces se habilita el botón b_sumar mediante b_sumar['state'] = 'normal'. De manera
similar el botón b_restar se puede habilitar o deshabilitar por medio del Checkbutton c_restar.
La función limpiar se puede llamar por medio del botón b_limpiar y lo que hace es establecer
e1=0 y e2=0, por lo que se verá un cero en los widgets entrada1 y entrada2. Además, establece
s=0, que es para desplegar un cero en el widget (entry) que tiene por nombre salida.
Al final del código terminamos con la instrucción [Link](). El método mainloop inicia un
ciclo para mostrar la ventana base, en este caso root, y los widgets que contiene (se tuvieron que
haber definido antes de iniciar este método), así como lo que se tenga que mostrar como
consecuencia del usuario interactuando con los widgets. El ciclo que mantiene mainloop termina
cuando se cierra la ventana principal (root en este caso), por lo que el resto del programa se
ejecutará después de cerrarla. El programa completo en Código 2.
Código 2.
Salida:
Referencias
[1] Tutorialspoint, “Python - Tkinter Button.” [Online]. Available:
[Link] [Accessed: 22-Nov-2021].
[2] Stackoverflow, “Why is the command bound to a Button or event executed when
declared?” [Online]. Available: [Link]
command-bound-to-a-button-or-event-executed-when-declared. [Accessed: 22-Nov-
2021].
[3] Tutorialspoint, “Python - Tkinter Checkbutton.” [Online]. Available:
[Link] [Accessed: 22-Nov-2021].
[4] Python-para-impacientes., “Variables de control en Tkinter.” [Online]. Available:
[Link]
[Link]. [Accessed: 22-Nov-2021].
[5] Tutorialspoint, “Python - Tkinter Entry.” [Online]. Available:
[Link] [Accessed: 22-Nov-2021].
[6] Tutorialspoint, “Python - Tkinter Label.” [Online]. Available:
[Link] [Accessed: 22-Nov-2021].