Definicion de Interfaz Con El Usuario e Interfaz

31
DEFINICION DE INTERFAZ CON EL USUARIO E INTERFAZ GRAFICA. EJEMPLOS

description

Definicion de Interfaz Con El Usuario e Interfaz

Transcript of Definicion de Interfaz Con El Usuario e Interfaz

DEFINICION DE INTERFAZ CON EL USUARIO E INTERFAZ GRAFICA. EJEMPLOS

DEFINICION DE INTERFAZ CON EL USUARIO E INTERFAZ GRAFICA. EJEMPLOS

VentajasWindows,Linux,MacPreinstalado en casi todas las plataformasRelativamente fcil de aprenderDocumentacin completaDesventajasPocos controles graficosLentoApariencia extraaTkinter

VentajasWindows, Linux, Mac OSCompleto conjunto de elementos grficosFlexible control de comportamiento de interfaceRpido y de apariencia nativaSoporta caracteristicas de windows y emula las de Linux/MacFcil de armar componentes personalizados

WxPython

DesventajasNo viene preinstalado con PythonRelativamente mas complejo de aprenderLas caractersticas emuladas no siempre se ven bien.En proyectos medianos o grandes puede ser inestable.

WxPython

VentajasWindows, Linux, Mac OsCompleto conjunto de elementos grficosRpido y de apariencia nativaSe puede separar el diseo de la interface.DesventajasNo viene preinstalado con pythonComplejo de aprenderNo del todo pytonico (cast entre tipos de datos)No hay mucha documentacin

PyQT

VentajasCompleto conjunto de elementos grficosFlexible y potenteEs estable, manejo de mensajes de error.DesventajasNo vienen preinstalado con PythonLento en WindowsMuy poca documentacinPyGTK

Ejemplo Tkinter

WindowsSolo hace falta importar la librera debido a que ya se encuentra instalada

>>> import tkinter as tk

Ubuntu

sudo apt-get install python-tkInstalacin Tkinter

Desarrollar aplicaciones con interfaces graficas en python es algo muy comn pero muchas veces es intimidante para algunos, Tkinter es un modulo de python que nos dota de unas funciones para el desarrollo de Interfaces de usuario. Veremos la facilidad de crear aplicaciones con mucho poder con python.Desarrollo de Interfaces Graficas con Tkinter [Labels,Buttons,Entrys]

En esta parte vamos a aprender a hacer Botones, etiquetas y cajas de texto y vamos a ir entendiendo el funcionamiento para crear aplicaciones ricas en interfaces y funcionalidades. Vamos a usar el ninja-IDE para desarrollar nuestra aplicacin

http://ninja-ide.org/

Lo primero que hacemos para usar Tkinter es agregar el modulo a nuestro script python en la primera lnea de cdigo:

from Tkinter import *Introduccion al El modulo Tkinter

Para la creacion de la ventana principal usamos la funcion ventana = Tk() que es atribuida a una variable en este casoventana, la cual heredara todas funciones de Tkinter , para inicializar la ventana usamos ventana.mainloop() y con esto nuestra ventana ser lanzada.

from Tkinter import * ventana = Tk() ventana.mainloop()La Ventana Principal

La lnea ventana = Tk() inicia el script y la lnea ventana.mainloop() lo finaliza, por lo tanto todo el cdigo para agregar la dems funcionalidades deber ir despus de la primera y antes de la ultima es decir antes de ventana = Tk() y despus de ventana.mainloop().Resultado:

Si queremos ponerle un titulo a la ventana usamos la funcion title() es decir : ventana.title(titulo de mi ventana).Cdigo:from Tkinter import * ventana = Tk() ventana.title('titulo de mi ventana') ventana.mainloop()

Las etiquetas con Tkinter se hacen con la funcin Label(ventana,text) y para posicionarlo en la ventana con la funcin grid(row,column). El primer parmetro de la funcin Label es la instancia de la ventana, es decir el resultado de ventana = Tk(), y a la variable text se le asigna un valor tipo cadena entre 2 comillas.Label : Usando Etiquetas

Para posicionarlo usaremos la funcion grid(row,columns) que seria fila,columns.ejemplo :from Tkinter import * ventana = Tk() ventana.title('Labels') label1=Label(ventana,text="Intro to Tkinter") label1.grid(row=1,column=1) ventana.mainloop()

En el transcurso de el tutorial usaremos la funcin grid para posicionar los elementos en la ventana y todos los elementos que usaremos hasta ahora utilizan esta funcin, por lo tanto entender la forma de posicionarlos es importante.Trabajando con la Funcion Grid

row =1 , column=1row =1 , column=2row =1 , column=3row =1 , column=4row =1 , column=5row =2 , column=1row =2 , column=2row =2 , column=3row =2 , column=4row =2 , column=5row =3 , column=1row =3 , column=2row =3 , column=3row =3 , column=4row =3 , column=5row =4 , column=1row =4 , column=2row =4 , column=3row =4 , column=4row =4 , column=5

Para usar un boton usamos los mismos parametros que para agregar una etiqueta : la instancia de la ventana y el valor de texto del boton , aparte el boton tiene 3 parametros extras ,2 para modificar la apariecia del boton : bg y relief, y un parametro para modificar el comportamiento del boton al ser precionado : command.Button : Usando Botones

from Tkinter import *ventana = Tk()ventana.title('usando Botones') boton1 = Button(ventana,text="Boton 1") boton1.grid(row=1,column=1) ventana.mainloop()

Podemos cambiar el fondo del botn, e incluso agregar otro botn, para cambiar el color de botn usaremos el parametro bg=color donde color puede sustituirse por un color del ingles : red, blue,green,lime etc .Y para agregar otro botn usamos otra variable para diferenciarlo del primero. y para poner una nueva posicin usaremos la posicion row=1, column=2

from Tkinter import * ventana = Tk() ventana.title('usando Botones')boton1 = Button(ventana,text="Boton 1",bg='red') boton1.grid(row=1,column=1) boton2 = Button(ventana,text="Boton 2",bg='blue') boton2.grid(row=1,column=2) ventana.mainloop()

Existen varias formas ver un boton, o el relieve del boton , se usa el parametro relief y puede tomar valores constantes ya definidos los cuales son : RAISED , SUNKEN,RIDGE,SOLID,FLAT,GROOVE , un ejemplo a continuacin :

from Tkinter import * ventana = Tk() ventana.title('usando Botones') boton1 = Button(ventana,text="Boton NORMAL") boton1.grid(row=1,column=1) boton2 = Button(ventana,text="Boton FLAT",relief=FLAT) boton2.grid(row=1,column=2) boton3 = Button(ventana,text="Boton SUNKEN",relief=SUNKEN) boton3.grid(row=1,column=3) boton4 = Button(ventana,text="Boton RIDGE",relief=RIDGE) boton4.grid(row=1,column=4) boton5 = Button(ventana,text="Boton SOLID",relief=SOLID) boton5.grid(row=1,column=5) ventana.mainloop()

Las cajas de texto suelen ser la forma de entrada de datos mas bsicas cuando se trabaja con interfaces graficas, con Tkinter usamos la funcin Entry, aunque con una diferencia en cuanto a los parmetros que usa la funcin Entry.Los parmetros son Entry(ventana,textvariable), la variable ventana es la variable de instancia recibida al llamar a la funcin Tk() y el valor que lleva textvariable es una variable que es instancia de StringVar(), la cual tendra el valor de lo escrito en la caja de texto

Entry : Usando Cajas de Texto

from Tkinter import * ventana=Tk() ventana.title('Usando Entry') variable_string = StringVar() caja = Entry(ventana,textvariable=variable_string) caja.grid(row=1,column=1) ventana.mainloop()

from Tkinter import * ventana=Tk() ventana.title('Usando Entry') label1=Label(ventana,text="Usuario : ") label1.grid(row=1,column=1) variable_string = StringVar() caja = Entry(ventana,textvariable=variable_string) caja.grid(row=1,column=2) ventana.mainloop()

Con estos elemento graficos basicos podemos hacer muchas aplicaciones y para iniciar el desarrollo vamos a terminar con un formulario que pida nombre , apellidos y correo, aunque aun no har ninguna funcin en especial, quedara pendiente para el futuro.Finalizando

from Tkinter import * root = Tk() root.title('formulario 1') # row 1 : the name nombre_label = Label(root,text="Nombre :") nombre_label.grid(row=1,column=1) nombre_str = StringVar() nombre_entry = Entry(root,textvariable=nombre_str) nombre_entry.grid(row=1,column=2) #row 2 : the last name last_label= Label(root,text="Apellido : ") last_label.grid(row=2,column=1) last_str = StringVar() last_entry = Entry(root,textvariable=last_str) last_entry.grid(row=2,column=2) #row 3 : the email mail_label = Label(root,text="Email : ") mail_label.grid(row=3,column=1) mail_str = StringVar() mail_entry = Entry(root,textvariable=mail_str) mail_entry.grid(row=3,column=2) #row 4 : end finish = Button(root,text="finalizar",relief=FLAT) finish.grid(row=4,column=2) root.mainloop()

http://gmendezm.blogspot.mx/2012/12/tutorial-tkinter-python-gui.htmlhttp://pharalax.com/blog/python-desarrollo-de-interfaces-graficas-con-tkinter-labelsbuttonsentrys/http://pharalax.com/blog/python-integracion-de-python-en-el-visual-studio-2010/http://python.org.ar/InterfacesGraficasBibliografia