4 may. 2011

GtkBuilder, Glade y Python Parte 2

Si estan leyendo esto es porque ya pasaron por este primer tutorial.

En esta segunda parte vamos a terminar de organizar todos los elementos gráficos para poder concentrarnos únicamente en el código en Python. Lo primero es abrir glade y abrir nuestra interfaz gráfica recién creada, la mía se llama Multiplay.ui.

Lo primero es ponerle nombre a la Ventana en mi caso le puse Multiplay
Después de agregado el titulo y anchura y altura predeterminado vamos a la pestaña de señales y en donde dice delete-event le ponemos la primera opción que aparece en el menú desplegable.
Ahora nos movemos sobre los demás elementos que están dentro de multiplay y nos vamos a la toolbar1 y vamos a configurarlo como se ve en la imagen, muchos siempre recomiendan usar siempre una separación de 4 en nuestras aplicaciones y yo usualmente sigo esta recomendación de las personas que más saben de Gtk.

Vamos a configurar cada uno de los botones que están dentro del toolbar1 de la siguiente forma, vamos a hacerlo de izquierda a derecha, recordemos que el primero es el de añadir o Add.

Al botón de añadir le ponemos on_Add_clicked
A los demás le ponemos:

on_AddFolder_clicked
on_Saved_clicked
on_Clearone_clicked
on_Clearlist_clicked
on_Up_clicked
on_Down_clicked
on_Play_clicked
on_Stop_clicked

Y finalmente el botón de cerrar le ponemos el mismo elemento que le pusimos a la ventana Multiplay
on_Multiplay_delete_event

Después vamos al siguiente que es el GtkTreeView y lo vamos a configurar como se ve en la imagen.
Las cabeceras no queremos que sean visibles, este acumulara básicamente las columnas, si quieren pueden dejarlo activo para poder ver como se ve todo mas adelante. Yo lo he configurado de la siguiente forma.

Ahora con el botón del lápiz vamos a editar el TextView, nos mostrara esta ventana donde vamos a ir a jerarquía y vamos a agregar una columna. Yo e puse de nombre Archivos y de etiqueta use el mismo nombre Archivos.

Después damos click derecho sobre la columna y nos aparece esto:
Después de agregar el hijo Texto nos apareció un nuevo elemento en nuestra lista, donde lo único que cambiaremos sera el valor del texto el cual pondremos en 0.
Una ves terminado este paso vamos a proceder con el siguiente elemento construido en la interfaz gráfica 
que seria el combobox, vamos a dar click en el lápiz para editar y vamos a ir a jerarquía y agregamos un elemento como se ve en la figura, configuramos el valor texto en 0.

Ya casi estamos terminando, vamos a agregar ahora todos los demás Widgets que vamos a utilizar, que son la ventana de abrir, la ventana de guardar, la de abrir carpeta, la ventana acerca de.

Para ello seguimos las siguientes imágenes.
Lo primero es crear el Selector de Archivos, después vamos a volver a usar el mismo botón y creamos el selector de carpetas, pero le cambiamos la acción para que esta sea abrir carpetas como se muestra en la figura.
Creamos finalmente el dialogo de guardar y le ponemos acción guardar, configuramos los elementos con los nombres Add, AddFolder, Save y le ponemos un titulo a cada ventana recién creada como se ve en la siguiente imagen. En este caso como es la de guardar el titulo que le he puesto es Guardar Lista a las demás les puse Abrir Archivos y Abrir Carpeta respectivamente.
Como pudieron ver estas 3 ventanas recién creadas les falta unos cuantos elementos y con eso me refiero a los dos botones de la parte inferior el de Abrir y Cancelar, entonces lo que hacemos es agregarlos y los seleccionamos de Stock, para la ventana de guardar en vez de Abrir buscamos el botón que diga Guardar.

Finalmente a todos los botones cancelar le vamos a poner un ID determinado como se ve en la imagen con un valor de -6 que básicamente le dice por defecto a la ventana que debe cerrarse. 

En el caso de Abrir y de Guardar le vamos a poner al ID de Respuesta un valor de -5 que básicamente envía una señal afirmativa, esto sera importante cuando programemos en Python.
A todos los botones de abrir y guardar les tenemos que configurar algo más antes de terminar. Como se ve en la imagen. Le agregamos Si a puede por omisión.

Finalmente el ultimo paso que vamos a seguir es el acerca de, como se ve en la siguiente figura. Lo  pueden configurar a su gusto.

En el próximo Tutorial espere los últimos elementos básicos en Glade que son las Gtk.Liststore y finalmente la programación en Python.

No hay comentarios:

Publicar un comentario en la entrada