Manual de iniciación al entorno Qt (c++) en debian whezzy

Hoy voy a explicar como instalar y configurar QtCreator en debian 6. Pero, ¿qué es Qt?

Qt es un framework de desarrollo rápido de aplicaciones de interfaz gráfica multiplataforma. Inicialmente creado para dispositivos basados en symbian, poco a poco se fue extendiendo a todas las plataformas. Hoy en día es posible compilar el mismo código tanto para una aplicación de escritorio, una tableta con windows o un smartphone android. Por eso es un framework muy interesante que cabe tener en cuenta.

Éste framework está hecho para programar en C++, pero su estilo recuerda a javascript.

Más información sobre Qt aquí.

Vamos ya con el tutorial de iniciación. Para éste tutorial solamente necesitamos unas nociones mínimas de programación en cualquier lenguaje y seguir los pasos uno a uno.

Voy a dar por sentado que tenemos debian 6 o ubuntu 10.04 instalado en el equipo, el mismo proceso puede servir para versiones más modernas, pero no lo he probado.

Primero tendremos que preparar el entorno de trabajo, para ello, instalamos el IDE de Qt, el QtCreator, que será la madre de todos nuestros proyectos.



Para ello iremos al centro de software y buscaremos simplemente QtCreator, dar a instalar. mientras se instala podemos echar un vistazo a ésta introducción en la documentación oficial de Qt.

Si estamos en debian, necesitaremos hacer un paso adicional. Recordamos que en debian sólo se instala lo que es absolutamente imprescindible, así que instalando QtCreator no entiende g++ como dependencia, lo instalamos a mano. Abrimos una terminal de root y ejecutamos:


aptitude install g++

Una vez hecho ésto, ya podemos iniciar el IDE:

Ahora ya casi podemos empezar a programar. Lo primero que haremos será crear un proyecto de ejemplo, para ello, pichar en Archivo->new file or project.


Seleccionamos la ruta que queremos utilizar para el nuevo proyecto y le ponemos nombre.


 

Seleccionamos el tipo de proyecto que vamos a crear, en éste caso Aplicación Qt4 con GUI.


Seleccionamos los módulos adicionales que vamos a usar en nuestra aplicación. Como es el primer proyecto, y además es un "hola mundo" no necesitaremos módulos adicionales. Conforme nuestros proyectos vayan cobrando complejidad iremos usando éstos módulos.



Por último, podemos dar nombre a los diferentes elementos básicos del programa. Hay que decir que el framework tiene separada la capa de vista de la capa controlador, lo que en la práctica significa que cuando diseñemos la interfza de usuario, no veremos código C++. 

La capa de vista se conecta con el controlador mediante "SLOTS". Los elementos que vayamos colocando en el interfaz gráfico generarán "SEÑALES". Un boton al ser pulsado generará una señal "clicked", ésta señal deberá ser recogida por un slot y el slot lo reenviará a un método de la clase del programa.

Al principio puede parecer un poco lío, pero ahora veremos que el IDE nos lo pone muy muy fácil ya que tiene automatizada la parte de creación de señales y slots.

Al hacer click en siguiente se abrirá la vista de diseño:


Haremos click en la izquierda, en "forms" "mainwindow". Ésta es nuestra ventana principal, puede haber más.  Añadiremos dos widgets, un Label, que llamaremos "labelPrueba" y un boton, que llamaremos "btnDecirHola".

Para ajustar las propiedades de los widgets que vayamos añadiendo, en la perte derecha inferior tenemos la lista de propiedades que podemos modificar. 

La jerarquía de objetos de Qt expone que todos los widgets extienden de QWidget y QWidget de QObject. Ésto significa en la práctica que habrá métodos, señales y propiedades comunes a casi todos los widgets, por ejemplo objectName (que desciende de QObject)

una vez añadidos y seteados los widgets, añadiremos las señales. Para ello simplemente seleccionamos el widget con el boton derecho y seleccionamos "goto slot"


Nos hará una lista de todas las señales que el widget es capaz de emitir. Seleccionaremos la señal "clicked". Automáticamente el IDE nos generará el código auxiliar necesario y nos llevará al sitio correcto para poder colocar el código. Añadiremos un código muy muy sencillo para éste ejemplo:


Una vez añadido el código, pulsaremos el boton "Play" en la parte inferior izquierda y ejecutaremos el programa. Si hubiera algún problema el programa no se ejecutaría y al pinchar en la barra de progreso nos llevaría a la lista de errores cometidos.

Por cierto, he añadido un bug en el código. A ver quien lo adivina...

A cuidarse!

1 comentario:

Anónimo dijo...

chingas a tu puta madre con tu bug.
pinche mono payaso.
haz las cosas bien o no las hagas hijo de tu reputa madre.