Prográmate tu primera GUI en GNOME/GTK+

Hola a todos chicos, ¿Cómo estais estos días de verano? Hoy os traigo un post que va dirigido a los desarrolladores novatos que quieran animarse a programar aplicaciones para GNU/Linux.

Si bien es cierto que hay aplicaciones por línea de comandos muy útiles tales como el comando find, wget, o uno al que diremos adiós en la próxima versión de Ubuntu (aptitude), la verdad es que el mundo del escritorio está basado en las GUIs o interfaces gráficas de usuario y es en estas últimas donde haremos una incursión en este artículo.

Para esta pequeña y rápida introducción haremos uso del lenguaje Python básicamente por su facilidad de entender/escribir, su amplia disponibilidad en entornos Linux y porque considero que es un lenguaje bastante acertado para empezar con esto de la programación.

También usaremos la herramienta Glade para generar el archivo XML que será nuestra bonita interfaz de usuario. Python ya debería estar instalado en vuestro sistema por defecto, y necesitaremos instalar las librerías de desarrollo para GTK+/PyGTK que encontraremos en nuestro gestor de paquetes preferido, normalmente con los nombres python-gtk2 y python-gtk2-dev. En el mismo gestor de paquete buscaremos también el diseñador de interfaces Glade, con el que generaremos la interfaz. Como veis, los preparativos son casi nulos y muy fáciles de cumplir.

Y ahora vamos al meollo. Como esto pretende ser una introducción bastante por encima, el ejemplo será sencillo y constará de una ventana con dos botones. Uno imprimirá el mensaje “Hola, esto es un ejemplo” en la terminal al ser pulsado, y el segundo cerrará la aplicación.

Empezaremos abriendo Glade, el cual nos recibirá con dos ventanas, la principal donde diseñaremos la interfaz, y un diálogo de preferencias sobre el proyecto que para nuestro objetivo podremos dejar tal y como vemos en la imagen de más abajo. Ahora si que si empezamos, seleccionando el widget Ventana en la categoría Niveles superiores en la “barra de herramientas” de la izquierda.

Esto creará un contenedor que será el padre de todos los demás widgets que usemos, es decir, será nuestra ventana de la aplicación. En las propiedades de la ventana (a la derecha de la aplicación) nos vamos a la pestaña Señales, y desplegando la opción GtkObject uniremos la señal destroy al manipulador gtk_main_quit. Esto lo que hará será que la aplicación sea “cerrable” sin necesidad de cerrar también la terminal que lo ejecute.

Vamos a añadir nuestros botonacos. Seleccionamos el widget Botonera horizontal en la categoría de Contenedores, y hacemos click dentro de nuestra ventana, lo que hará surgir un nuevo diálogo que nos pregunta cuantos elementos queremos mostrar, así que escribimos 2 y aceptamos. Aparecerá, efectivamente, un contenedor con espacio para dos botones, así que sin perder mucho tiempo seleccionamos el widget Botón en la categoría Control y exhibición, y damos un click en cada “agujero” del contenedor.

Seleccionando cada botón haciendo click sobre ellos, nos fijaremos de nuevo en sus propiedades. En la pestaña General yo he modificado la etiqueta o texto que mostrará cada botón pero lo podéis poner a vuestro gusto. Y de nuevo, en la pestaña de señales, conectaremos la señal clicked del primer botón al manipulador on_button1_clicked, aprovechando que ya viene en la lista de opciones predeterminadas.

Luego, en nuestro código, crearemos una función del mismo nombre, que será ejecutada cuando el botón envíe la señal clicked (Estas funciones se llaman retrollamadas). Para el segundo botón, conectaremos la misma señal al manipulador gtk_main_quit al igual que hicimos con la ventana.

Tened en cuenta que cada señal, al enviarse, ejecutará una función o retrollamada que tendrá que tener el nombre del manipulador que habéis especificado. Bueno, una vez hecho esto ya tenemos nuestra modesta interfaz, así que guardaremos el archivo con cualquier nombre que queramos.

Ahora viene el turno de la programación, y es que usando Python y PyGTK lo tenemos muy fácil, tanto que es casi mágico de lo sencillo que resulta. Prefiero pegaros el código “pelado” pues con comentarios y demás anotaciones esto se alargaría en exceso. Nuestro archivo tutorial.py quedaría de la siguiente manera:

#!/usr/bin/env python

import pygtk
pygtk.require('2.0')
import gtk

class HelloWorld:

    def on_button1_clicked(self, widget, data=None):
        print 'Hola MuyLinux, esto es un ejemplo usando Glade y PyGTK'

    def gtk_main_quit(self, widget, data=None):
        gtk.main_quit()
        return False

    def __init__(self):
        builder = gtk.Builder()
        builder.add_from_file("tutorial.glade")
        self.window = builder.get_object("window1")
        builder.connect_signals(self)
        self.window.show()

def main():
    gtk.main()

if __name__=='__main__':
    h = HelloWorld()
    main()

Este archivo lo guardamos en la misma ubicación que nuestro archivo glade y para lanzarlo basta con abrir una terminal, movernos hasta la ubicación de ambos archivos y ejecutar lo siguiente:

python nombre_del_archivo.py

Lo que nos mostrará una pequeña ventana con dos botones, justo como la que hemos creado anteriormente.

Y hasta aquí llega esta pequeña introducción a la programación con GUIs sobre GNOME/GTK+. Espero que os haya gustado/servido y pronto espero hacer algo similar pero usando Qt para desarrollar aplicaciones gráficas sobre KDE ;).

Recordad que si quereis información más avanzada y una descripción completa de cada widget y función, siempre podeis acudir a la web de PyGTK o a la del proyecto GTK+ directamente. Sin mucho más que decir, un saludo y hasta la próxima muchachos.

Ah, por cierto, podeis bajaros tanto el archivo tutorial.glade como tutorial.py que he utilizado yo desde aquí.

Related posts:

1. Tiny Backup: tú también puedes hacerlo
2. Mate y BlueBubble: dos proyectos al rescate de GNOME 2
3. Python 2.7, más aire para la serie 2.x de Python
4. Primera versión de desarrollo de GNOME 3.0
5. GNOME 3 dice adiós a los botones minimizar y maximizar [Actualizado]