sábado, 8 de octubre de 2016

Capítulo 76: Gráficos en Python. Parte 2


Diario de un programador.- Día 178

Gráficos en Python


La última vez hicimos un botón que al presionarlo, mostraba un mensaje por el Shell

El código era el siguiente:
from tkinter import *

def mensaje():
    print("Has presionado el botón")

ventana = Tk()
boton = Button(ventana, text = "Pulsame", command = mensaje)
boton.pack()              

Vamos a ver algo más con respecto a este código, específicamente con el método pack(). Si al ejecutar el programa anterior, cambiamos el tamaño de la ventana arrastrando uno de sus bordes con el uso del ratón, podemos ver que el botón queda ubicado en la parte superior central de la ventana.


Esto sucede, debido a que el método pack(), al no recibir argumentos, posiciona el botón por defecto en la ubicación TOP. Esto se puede modificar agregando el argumento side = seguido de una de las siguientes opciones que deben ser escritas en mayúsculas: LEFT, RIGHT, TOP, BOTTOM.
Ejemplo:
from tkinter import *

def mensaje():
    print("Has presionado el botón")

ventana = Tk()
boton = Button(ventana, text = "Pulsame", command = mensaje)
boton.pack(side = BOTTOM)  


Creando etiquetas.

Una etiqueta es como el equivalente al comando print para interfaces gráficas. Su función es mostrar un texto en pantalla.
El procedimiento para ocupar una etiqueta, es similar al utilizado para crear un botón. Ejemplo:

from tkinter import *

ventana = Tk()
etiqueta = Label(ventana, text = "Soy una simple etiqueta")
etiqueta.pack()              


Recordar que modificando el metodo pack() podemos darle otra ubicación a nuestra etiqueta.
Lo que se me ocurre ahora, es crear un programa que muestre un mensaje en la ventana al presionar un botón. Esto me quedó del siguiente modo:

from tkinter import *

def Texto():
  etiqueta = Label(ventana, text = "Botón presionado")
  etiqueta.pack()   

ventana = Tk()
              
boton = Button(ventana, text = "Pulsame", command = Texto)
boton.pack(side = BOTTOM)


Cuadro de texto
Un cuadro de texto se utiliza para recibir datos del usuario, tiene la misma finalidad que la función input(), salvo que ésta es para entorno gráfico.
La forma de crear un cuadro de texto es similar a la forma de crear una etiqueta. Veamos un ejemplo:
from tkinter import *

ventana = Tk()
cuadroTexto = Entry(ventana)
boton = Button(ventana, text = "Enviar")

cuadroTexto.pack()
boton.pack(side = BOTTOM)


En primera instancia, este  cuadro de texto, puede recibir datos pero no puede procesarlos aún. Esto se debe a que falta “asociar” los datos recibidos con algún evento o función. Para poder procesar esa información, se utilizan los llamados "modelos"

Modelos
Un modelo es un dato que se almacena y que está asociado a la interfaz, se podría decir que es una especie de variable pero para interfaces gráficas. Con los modelos podemos por ejemplo, almacenar lo escrito en un cuadro de texto para luego usarlo en lo que queramos.
Tkinter puede manejar distintos tipos de modelos, según el dato que se desee almacenar. En esta ocasión, vamos a presentar el de tipo String.
Para crear un modelo de tipo String, se puede hacer de la siguiente manera:
modelo = StringVar()
De esta forma se crea esta especie de variable, que puede almacenar un dato de tipo String.

Para asignar o establecer un valor al modelo, se usa el método set, el cual se usa de la siguiente manera, separando la palabra metodo y set mediante un punto:
modelo.set("soy un simple texto")
De esta forma una cadena de texto es asignada al modelo. Vamos a usarla en el siguiente programa:
from tkinter import *

ventana = Tk()

modelo = StringVar()
modelo.set("Soy un simple texto")

etiqueta = Label(ventana, textvariable = modelo)
etiqueta.pack()


Para poder asociar el modelo a la etiqueta, se utilizó el parámetro "textvariable = modelo". Asignar de esta manera es útil si por ejemplo necesitamos que una cadena de texto se modifique en algún momento.
También es posible recuperar los datos o información que tiene un modelo. Para esto se utiliza el método get, de la siguiente manera:
cadena = modelo.get()
En este caso, el método get no lleva argumentos y su contenido es asignado a una variable llamada "cadena".
Por ejemplo, si quisiera imprimir lo que contiene el modelo, podría usar una instrucción print. Ejemplo:
from tkinter import *

ventana = Tk()

modelo = StringVar()
modelo.set("Soy un simple texto")

etiqueta = Label(ventana, textvariable = modelo)
etiqueta.pack()

cadena = modelo.get()
print (cadena)


De forma similar se puede recuperar lo escrito en un cuadro de texto. Veamos el programa que se mostró cuando se presentaron los cuadros de  textos.
from tkinter import *

ventana = Tk()
cuadroTexto = Entry(ventana)
boton = Button(ventana, text = "Enviar")

cuadroTexto.pack()
boton.pack(side = BOTTOM)


Este programa mostraba un simple cuadro de texto con un botón, pero no hacía nada más. Vamos a modificarlo.

Lo primero que voy a agregar será un modelo para poder luego almacenar lo escrito en el cuadro de texto.

from tkinter import *

ventana = Tk()
modelo = StringVar()
cuadroTexto = Entry(ventana)
boton = Button(ventana, text = "Enviar")

cuadroTexto.pack()
boton.pack(side = BOTTOM)

Lo siguiente será asignar el modelo al cuadro de texto:

from tkinter import *

ventana = Tk()
modelo = StringVar()
cuadroTexto = Entry(ventana, textvariable = modelo)
boton = Button(ventana, text = "Enviar")

cuadroTexto.pack()
boton.pack(side = BOTTOM)

La idea de este programa es que al presionar el botón, se pueda recuperar lo escrito en el cuadro de texto y mostrarlo en otro lado, como puede ser utilizando la instrucción print. Como recordaremos, para utilizar un botón, hay que crear una función. Así que lo siguiente será crear la siguiente función:


from tkinter import *

def mensaje():
    cadena = modelo.get()
    print("Has escrito: ",cadena)

ventana = Tk()
modelo = StringVar()
cuadroTexto = Entry(ventana, textvariable = modelo)
boton = Button(ventana, text = "Enviar")

cuadroTexto.pack()
boton.pack(side = BOTTOM)

Creamos una función llamada "mensaje" y dentro de ella creamos una variable llamada "cadena" a la cual le asignamos el contenido del modelo utilizando el método get. Lo siguiente que hace la función es imprimir el mensaje "Has escrito" seguido del valor almacenado en la variable "cadena".
Ya por último, nos queda asignar la función al botón, utilizando el argumento command
from tkinter import *

def mensaje():
    cadena = modelo.get()
    print("Has escrito: ",cadena)

ventana = Tk()
modelo = StringVar()
cuadroTexto = Entry(ventana, textvariable = modelo)
boton = Button(ventana, text = "Enviar", command = mensaje)

cuadroTexto.pack()
boton.pack(side = BOTTOM)


También el resultado puede ser mostrado en la misma ventana utilizado una etiqueta. Modificaré el programa para poder hacer esto:
from tkinter import *

def mensaje():
    cadena = modelo.get()
    etiqueta = Label(ventana, textvariable = modelo)
    etiqueta.pack()
   
ventana = Tk()
modelo = StringVar()
cuadroTexto = Entry(ventana, textvariable = modelo)
boton = Button(ventana, text = "Enviar", command = mensaje)

cuadroTexto.pack()
boton.pack(side = BOTTOM)


Una alternativa a este programa, es cambiar la ubicación de las últimas dos líneas de la función y dejarlas fuera de esta. Esto provocará que el texto sea mostrado en pantalla al mismo tiempo que se escribe.
from tkinter import *

def mensaje():
    cadena = modelo.get()
  
   
ventana = Tk()
modelo = StringVar()
cuadroTexto = Entry(ventana, textvariable = modelo)
boton = Button(ventana, text = "Enviar", command = mensaje)

etiqueta = Label(ventana, textvariable = modelo)
cuadroTexto.pack()
etiqueta.pack()
boton.pack(side = BOTTOM)


Para ir aumentando una variable de uno en uno e imprimirlo en pantalla, se me ocurre el siguiente código:

from tkinter import *

def color():
    cadena = int(modelo.get())
    print(cadena)
    cadena = cadena + 1
    model(cadena)

def model(valor):
    modelo.set(valor)
   
   
ventana = Tk()
lienzo = Canvas(ventana, width = 150, height = 150)
modelo = StringVar()
modelo.set(1)

boton = Button(ventana, text = "Enviar", command = color)

lienzo.pack()
boton.pack(side = BOTTOM)

La segunda función(def model(valor)), es la encargada de ir actualizando y estableciendo el valor del modelo.  Con esto, cada vez que presiono el botón, se sumará +1 al valor establecido.


Este programa será muy útil sobre todo para cuando empiece a manejar gráficos, ya que necesitamos que ciertos valores vayan actualizándose a medida que presiono un botón o una tecla del teclado.
Esto es todo por ahora. Saludos

Gustavo J. Cerda Nilo
Julio 2016, Octubre 2016





No hay comentarios:

Publicar un comentario

C++ El apuntador This

El apuntador This En C++, cada objeto tiene acceso a su propia dirección a través de un puntero o apuntador denominado This. Lo...