Programacion QT4 facil

Luis Tomas Wayar October 31, 2010

A mi esposa Elisa, mi compaera de toda la vida. n

Sobre este documento

Motivacin o
Para aprender a programar en C++ usando las librer QT recurr a varios as libros que me resultaron de gran utilidad, lamentablemente todos ellos en ingles, todos muy completos y abundantes en explicaciones lo que resulta un poco tedioso de leer cuando uno lo que quiere es obtener los conocimientos y los resultados rpido. Por eso he decidido escribir este documento, donde voy a a intentar escribirlo pensando en como me gustar a mi encontrar un documento a que me introduzca en un tema de programacin en particular, yendo a los temas o directamente y ponindolos en practica en un ejemplo sin entrar en muchos e detalles que confundan y dilaten el proceso de aprendizaje. Es raro encontrar documentacin donde se muestre y explique la metodolog para el uso, por eso o a este documento va a proveer una gu incremental donde en ejemplos simples a y sencillos vamos a ver como usar esta fantstica librer de programacin de a a o interfaces grcas de usuario. a Como es sabido la mejor forma de aprender algo es hacindolo, por eso, luego e de explicado el ejemplo para cada tema, se proponen al nal de cada capitulo unos ejercicios para que el lector los desarrolle y adquiera las destrezas necesarias para aplicar lo aprendido. Mi idea es leer todo lo que encuentre sobre cada tema, mas la experiencia propia y escribir lo mas simple y conciso posible.

Audiencia
Este documento esta destinado a todos aquellos que quieran aprender a usar y sacar el mximo provecho a la programacin de interfaces grcas de usuario a o a usando el lenguaje de programacin C++ y las librer QT4. Se requieren o as conocimientos previos de programacin C++ y de la terminolog y conceptos o a propios de la programacin de GUIs. o Se usa como plataforma de desarrollo GNU/Linux pero tambin se pueden e aplicar a otras plataformas con los cambios m nimos propios de cada sistema operativo.

Herramientas
Para la realizacin de las practicas se usara un editor o ide de programador o y el correspondiente compilador de C++, se recomienda como editores VIM o Kdevelop que son mis favoritos, sin embargo se puede optar por otros editores o ides segn sea su eleccin. Para la compilacin y pruebas se necesita acceso a u o o un emulador de terminal.

Bibliograf a
[1] C++ GUI Programming with Qt 4, Second Edition [2] The Art of Building Qt Applications [3] Introduction to Design Patterns in C++ with Qt 4

 Indice general
I Introduccin a QT o
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

7
8 9 9 9 10 10 10 12 12 13 14 14 16 17 17 18 18 19

1. Comenzando 1.1. Algunas convenciones iniciales . . . . . . . 1.2. Nuestro primer programa . . . . . . . . . 1.2.1. Hola mundo . . . . . . . . . . . . . 1.2.2. Crear el proyecto . . . . . . . . . . 1.2.3. Compilar y ejecutar el programa . 1.2.4. Entendiendo el programa . . . . . 1.3. Disposicin de widgets . . . . . . . . . . . o 1.3.1. Planicando la apariencia . . . . . 1.3.2. Entendiendo el programa . . . . . 1.4. Disposiciones mas complejas . . . . . . . . 1.4.1. Anidando Layouts . . . . . . . . . 1.4.2. Entendiendo el cdigo . . . . . . . o 1.5. Conectando eventos con acciones . . . . . 1.5.1. Seales y slots . . . . . . . . . . . n 1.5.2. Entendiendo el cdigo . . . . . . . o 1.5.3. Un poco mas sobre slots y seales n 1.5.4. Entendiendo el cdigo . . . . . . . o

 Indice de guras
1.1. 1.2. 1.3. 1.4. 1.5. 1.6. Ventana de ejemplo1 . . . . . Ventana de ejemplo2 . . . . . Diagrama de ejemplo 3 . . . . Ventana de ejemplo3 . . . . . Diagrama de interconexin de o Ventana del ejemplo 5 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . seales y slots n . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11 13 16 17 20 21

Parte I

Introduccin a QT o

Cap tulo 1

Comenzando
Hay slo dos clases de lenguajes de programacin: aquellos de o o los que la gente est siempre quejndose y aquellos que nadie usa. a a Bjarne Stroustrup En este capitulo vamos aprender los siguientes temas: Nuestro primer programa Como crear un proyecto Como organizar los widgets en la ventana

CAP ITULO 1. COMENZANDO

1.1.

Algunas convenciones iniciales

Vamos a ponernos de acuerdo en algunas convenciones bsicas sobre como a escribir Los nombres de clase comienza con una letra mayscula u Los nombres de las funciones comienzan con una letra minscula. u Aunque son permitidos por el compilador los puntos, guiones, subrayado y otros caracteres especiales deben evitarse siempre que sea posible (excepto donde se indica a continuacin). o En los nombres compuestos por varias palabras se escriben la iniciales con maysculas. u Las constantes se escriben con la inicial en mayscula, constantes globales u y macros todo con maysculas. u Cada nombre de clase debe ser un sustantivo. Cada nombre de la funcin debe ser un verbo. o Cada nombre de variable bool debe producir una aproximacin razonable o a su funcin. o

1.2.
1.2.1.

Nuestro primer programa

Hola mundo

Vamos a comenzar haciendo un primer programa, se trata como es de esperar del clsico Hola mundo, esta vez pensado para desplegarse en una simple a ventana sin ningn tipo de control. Cree un directorio llamado ejmeplo1 y dentro u de el escriba un archivo con el siguiente cdigo, nombrelo ejemplo1.cpp o

1 2 3 4 5 6 7 8 9

# include < QApplication > # include < QLabel > int main ( int argc , char * argv []) { QApplication app ( argc , argv ) ; QLabel * label = new QLabel (" Hola Mundo ") ; label - > show () ; return app . exec () ; }

CAP ITULO 1. COMENZANDO

10

1.2.2.

Crear el proyecto

Ahora vamos crear el proyecto para nuestro primer ejemplo, para ello vamos a utilizar la herramienta qmake1 , se trata de una herramienta desarrollada por los creadores de las librer QT2 para la simplicacin del proceso de creacin as o o de proyectos, bsicamente su funcionalidad consiste en la automatizacin de la a o creacin de los archivos Makele para la compilacin. o o Desde una terminal ejecute el siguiente comando para crear un nuevo proyecto basado en nuestro cdigo fuente. o

La empresa Nokia compro a la empresa Trolltech creadora de la librer QT a

$ qmake - project

Observe que ahora tiene un nuevo archivo llamado ejemplo1.pro, este es su archivo de conguracin del nuevo proyecto. o Ahora vamos a crear nuestro archivo Makele a partir de ejemplo1.pro, para ello ejecute el siguiente comando en una terminal.

$ qmake ejemplo1 . pro

1.2.3.

Compilar y ejecutar el programa

Tenemos ahora un nuevo archivo en nuestro directorio llamado Makele, este es el que se encargara de automatizar la compilacin y enlazado de nuestro o cdigo fuente, para ello ejecutamos el siguiente comando en una terminal. o

$ make

Tenemos ya un archivo ejecutable al que podemos invocar simplemente llamna dolo desde linea de comando.

$ ./ ejemplo1

Con lo que podremos ver en la Figura 1.1 en la pgina siguiente a

1.2.4.

Entendiendo el programa

Analicemos este breve programa para comprender la funcionalidad de cada una de sus partes. En esta linea (1) incluimos la clase QApplication. QApplication es la clase Cada clase existente en QT 1 Podemos encontrar el manual de qmake en http://doc.trolltech.com/4.5/qmaketiene un include manual.html 2 La pagina ocial de la librer QT es http://qt.nokia.com/ con el mismo a nombre que la clase

CAP ITULO 1. COMENZANDO

11

Figura 1.1: Ventana de ejemplo1 que contiene a toda aplicacin que use esta librer recibe argc que contiene el o a, nmero de argumentos recibidos por el programa, debemos considerar que siemu pre ser el nmero de argumentos pasados ms 1, ya que el primer argumento a u a se reserva para contener el nombre del programa. El segundo es un puntero a un array de chars que contiene los parmetros pasados en el mismo orden en a que fueron escritos.

# include < QApplication >

En la linea 2 incluimos la clase QLabel la que sirve para mostrar un texto o una imagen, no provee ningn tipo de interaccin con el usuario. u o

# include < QLabel >

En la linea 6 creamos un objeto de la clase QApplication llamado app que recibe como argumentos los provistos desde linea de comandos, en este caso no vamos a proveerle ninguno cuando lo ejecutemos.

QApplication app ( argc , argv ) ;

En la linea 7 creamos un puntero de tipo QLabel llamado etiqueta que apunta a un nuevo objeto que recibe como parmetro una cadena Hola mundo. a

QLabel * label = new QLabel (" Hola Mundo ") ;

En la linea 8 llamamos al mtodo show del objeto label que tiene como funcin e o hacer visible el objeto, por defecto los widgets al ser instanciados no se despliegan en pantalla.

CAP ITULO 1. COMENZANDO

12

label - > show () ;

Finalmente en la linea 9 llamamos a nuestro objeto principal (app) el cual devolver el valor de retorno del programa. a

return app . exec () ;

1.3.
1.3.1.

Disposicin de widgets o
Planicando la apariencia

La librer QT cuenta con una serie de contenedores que permiten ordenar a la disposicin de los widgets en nuestras ventanas, se conocen como Layouts, y o todos derivan de una clase padre llamada QLayout, mediante estos elementos es posible controla la geometr de los elementos grcos a ser desplegados. Para a a entenderlo mejor pensemos en ellos como si se tratara de celdas donde meter los widgets o incluso otros Layouts. Los widgets Segn nuestras necesidades disponemos de los siguientes, QBoxLayout, QGrid- son los eleu Layout, QFormLayout, y QStackedLayout. A su vez estos heredan en nuevas mentos que clases que agregan funcionalidades o caracter sticas a los manejadores de dis- conforman posicin, por ejemplo, QBoxLayout tiene dos clases heredadas, QVBoxLayout las o interfaces que organiza la disposicin verticalmente y QHBoxLayout que lo hace de man- grcas o a de era horizontal. En el ejemplo siguiente aplicaremos ambos para demostrar y usuarios comprender su funcionamiento. En un nuevo archivo llamado ejemplo2.cpp escriba el siguiente cdigo. o

1 2 3 4 5 6 7 8 9 10 11 12 13 14

# include < QApplication > # include < QVBoxLayout > # include < QLabel > int main ( int argc , char * argv []) { QApplication app ( argc , argv ) ; QWidget ventana ; QVBoxLayout * p rinc ipal Lay out = new QVBoxLayout (& ventana ) ; QLabel * label1 = new QLabel (" Hola ") ; QLabel * label2 = new QLabel (" Mundo ") ; principalLayout - > addWidget ( label1 ) ; principalLayout - > addWidget ( label2 ) ; ventana . show () ; return app . exec () ; }

Siga los pasos descriptos en el ejemplo1 para crear el proyecto y compilar el programa. Como resultado de la ejecucin del programa obtendremos la ventan o de la Figura 1.2

CAP ITULO 1. COMENZANDO

13

Figura 1.2: Ventana de ejemplo2

1.3.2.

Entendiendo el programa

Analicemos ahora el cdigo. Como pueden ver se agrego una nueva inclusin, o o esta incorpora la clase QVBoxLayout, es un contenedor que ordena sus elementos contenidos de manera vertical, uno debajo de otro.

# include < QVBoxLayout >

Luego, para utilizarlo, instanciamos un nuevo objeto llamado principalLayout, observe que recibe como argumento el objeto padre, de esta manera se convierte en el contenedor de nivel superior del widget ventana. Otra cosa importante a tener en cuenta en esta linea es la forma en que instanciamos, teniendo en cuenta que C++ no provee mecanismos de manejo automtico de memoria es a el programador quien tiene que tomar los recaudos necesarios para gestionar inteligentemente la misma, esa es la razn por la cual creamos el objeto mediante o new ya que de esta manera nos referimos al objeto mediante un puntero que lo ubica en el heap, de no hacerlo as el objeto y todos sus elementos derivados se crear en el stack y permanecer en memoria durante todo el tiempo El Stack o an an de vida del proceso, hacindolo con new una vez que se llama a su destructor Pila es el rea e a se libera del heap la memoria utilizada. de memoria esttica donde a se almacenan por ejemplo 1 udaQVBoxLayout * p rinc ipal Lay out = new QVBoxLayout (& ventana ) ; las variables locales El Heap o La manera incorrecta de instanciarlo seria. Montn es una o a rea de memoria dinmica a 1 QVBoxLayout p rinc ipa lLay out (& ventana ) ; que se usa por ejemplo para ubicar objetos De igual manera instanciamos los dos objetos QLabel, recurriendo a punteros. creados con new

CAP ITULO 1. COMENZANDO

14

1 2

QLabel * label1 = new QLabel (" Hola ") ; QLabel * label2 = new QLabel (" Mundo ") ;

Ahora debemos embeber los dos nuevos QLabel (label1 y label2) dentro del contenedor QVBoxLayout (principalLayout), para ello usamos el mtodo ade dWidget de la clase QVBoxLayout que tiene como funcin insertar el widget al o nal del contenedor.

1 2

principalLayout - > addWidget ( label1 ) ; principalLayout - > addWidget ( label2 ) ;

En este ejemplo se muestra la forma bsica en que se disponen los elementos a dentro de una ventana, lo importante a aprender es la forma en que se organiza la disposicin de elementos, en resumen se trata de usar contenedores (Layouts) o para insertar elementos (widgets) dentro de sus celdas.

1.4.
1.4.1.

Disposiciones mas complejas

Anidando Layouts

En el ejemplo anterior vimos como usar los Layouts para disponer de manera ordenada los widgets dentro de la ventana, este mtodo nos ofrece un sinf e n de opciones al momento de disear nuestras interfaces de usuario, es imporn tante considerara que se pueden anidar y tienen varios atributos y mtodos que e permiten controlar su posicionamiento y comportamiento. En el siguiente ejemplo se introducen varios nuevos widgets, QLineEdit, QRadioButton, QCheckBox, QTextEdit, QPushButton, es fcil deducir la funa cin y el funcionamiento de cada uno de ellos, no hace falta entrar en explio caciones al respecto. Tambin introducimos en este ejemplo el nuevo Layout e QHBoxLayout cuyo comportamiento es similar al QVBoxLayout con la sola diferencia que dispone de los widgets de manera horizontal. Veamos el ejemplo.

1 2 3 4 5 6 7 8 9 10 11 12

# include # include # include # include # include # include # include # include # include # include # include

< QtGui / QApplication > < QtGui / QCheckBox > < QtGui / QFrame > < QtGui / QHBoxLayout > < QtGui / QLabel > < QtGui / QLineEdit > < QtGui / QPushButton > < QtGui / QRadioButton > < QtGui / QSpacerItem > < QtGui / QTextEdit > < QtGui / QVBoxLayout >

CAP ITULO 1. COMENZANDO

13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77

15

int main ( int argc , char * argv []) { QApplication app ( argc , argv ) ; // Creamos el widget principal QWidget ventana ; // Creamos el Layout principal que sera de tipo Horizontal QHBoxLayout * p rinc ipal Lay out = new QHBoxLayout (& ventana ) ; // Creamos dos layouts verticales para ponerlos en el principal QVBoxLayout * iz q ui e rd o VL a yo u t = new QVBoxLayout () ; QVBoxLayout * derechoVLayout = new QVBoxLayout () ; // Creamos un layouts que se agregara a layout i z qu i er d oV L ay o ut QVBoxLayout * izqsupVLayout = new QVBoxLayout () ; // Creamos los layouts que se agregaran en izqsupVLayout QHBoxLayout * ltHLayout = new QHBoxLayout () ; QLabel * label = new QLabel (" Etiqueta ") ; QLineEdit * lineEdit = new QLineEdit (" Ingrese un texto ") ; ltHLayout - > addWidget ( label ) ; ltHLayout - > addWidget ( lineEdit ) ; QHBoxLayout * rbHLayout = new QHBoxLayout () ; QRadioButton * radioButton1 = new QRadioButton (" RB1 ") ; QRadioButton * radioButton2 = new QRadioButton (" RB2 ") ; rbHLayout - > addWidget ( radioButton1 ) ; rbHLayout - > addWidget ( radioButton2 ) ; QHBoxLayout * cbHLayout = new QHBoxLayout () ; QCheckBox * checkBox1 = new QCheckBox (" CB1 ") ; QCheckBox * checkBox2 = new QCheckBox (" CB2 ") ; cbHLayout - > addWidget ( checkBox1 ) ; cbHLayout - > addWidget ( checkBox2 ) ; // Agregamos los Layouts creados a izqsupVLayout izqsupVLayout - > addLayout ( ltHLayout ) ; izqsupVLayout - > addLayout ( rbHLayout ) ; izqsupVLayout - > addLayout ( cbHLayout ) ; // Creamos un nuevo widget de edicion de texto . QTextEdit * textEdit = new QTextEdit (" Editor de texto simple ") ; // Agregamos el layout izqsupVLayout y el widget de edicion de texto a izq uier doL ayou t izquierdoVLayout - > addLayout ( izqsupVLayout ) ; izquierdoVLayout - > addWidget ( textEdit ) ; // Creamos un Layout para los botones del tipo QVBoxLayout QVBoxLayout * botonesVLayout = new QVBoxLayout () ; QPushButton * pushButton1 = new QPushButton (" Boton1 ") ; QPushButton * pushButton2 = new QPushButton (" Boton2 ") ; QPushButton * pushButton3 = new QPushButton (" Boton2 ") ; // Agregamos los botones al layout botonesVLayout - > addWidget ( pushButton1 ) ; botonesVLayout - > addWidget ( pushButton2 ) ; botonesVLayout - > addWidget ( pushButton3 ) ; // Creamos un Spacer para mejor disposicion QSpacerItem * verticalSpacer = new QSpacerItem (20 , 188 , QSizePolicy :: Minimum , QSizePolicy :: Expanding ) ; // Agregamos a derechoVLayout el layout de botones y el spacer derechoVLayout - > addLayout ( botonesVLayout ) ; derechoVLayout - > addItem ( verticalSpacer ) ; // Finalmente agregamos al layout principal los layouts izquierdo y derecho

CAP ITULO 1. COMENZANDO

78 79 80 81 82 83

16

principalLayout - > addLayout ( iz q ui e rd o VL a yo u t ) ; principalLayout - > addLayout ( derechoVLayout ) ; ventana . show () ; return app . exec () ; }

El diagrama que usamos corresponde a una ventana que contiene varios widgets organizados a su vez en varios layouts, en la Figura 1.3 se puede ver el modelo de diagrama.

Figura 1.3: Diagrama de ejemplo 3 Una vez compilado el ejemplo siguiendo el mismo procedimiento de los ejemplos anteriores obtenemos la ventana de la Figura 1.4

1.4.2.

Entendiendo el cdigo o

En este nuevo ejemplo incorporamos nuevos layouts y los organizamos anidna dolos, podemos ver que adems de agregar widgets a un layout como lo hicia mos en el ejemplo anterior tambin podemos agregarles nuevos layouts, en las e lineas de abajo vemos una combinacin de ambos que se agregan a izquiero doVLayout tanto un layout izqsupVLayout como un widget textEdit, a su vez izqsupVLayout es un layout que anida a otros tres layouts horizontales.

1 2

izquierdoVLayout - > addLayout ( izqsupVLayout ) ; izquierdoVLayout - > addWidget ( textEdit ) ;

CAP ITULO 1. COMENZANDO

17

Figura 1.4: Ventana de ejemplo3

1.5.
1.5.1.

Conectando eventos con acciones

Se ales y slots n

Hasta ahora los ejemplos que vimos no tienen ningn tipo de interaccin con u o el usuario, solo despliegan ventanas y en ellas los widgets, en este nuevo ejemplo usaremos un botn el cual sera capaz de responder a un evento. o La mayor de las librer de diseo de interfaces de usuario usan callbacks a as n o simplemente entran en un bucle a la escucha de eventos para disparar mtoe dos internos, en el caso de QT la cosa es un poco diferente, entramos ac al a concepto de Seal-SLOT, la ventaja principal de esta implementacin es que n o una seal puede conectarse a tantos slots como sea necesario, as un solo evento n puede disparar varias acciones de manera mas simple para el programador. Mas adelante veremos con mayo detalle el tema de los slots, por ahora veamos un ejemplo sencillo.

1 2 3 4 5 6 7 8

# include # include # include # include

< QApplication > < QVBoxLayout > < QLabel > < QPushButton >

int main ( int argc , char * argv []) { QApplication app ( argc , argv ) ;

CAP ITULO 1. COMENZANDO

9 10 11 12 13 14 15 16 17 18

18

QWidget ventana ; QVBoxLayout * p rinc ipal Lay out = new QVBoxLayout (& ventana ) ; QLabel * label = new QLabel (" Hola mundo ") ; QPushButton * boton = new QPushButton (" Salir ") ; principalLayout - > addWidget ( label ) ; principalLayout - > addWidget ( boton ) ; ventana . show () ; QObject :: connect ( boton , SIGNAL ( clicked () ) , & app , SLOT ( quit () ) ) ; return app . exec () ; }

1.5.2.

Entendiendo el cdigo o

Usamos aqu como base el ejemplo 2, reemplazamos el segundo label por un botn, simplemente lo instanciamos y luego de agregarlo a nuestro layout o usamos el mtodo connect de la clase QObject. Como se puede observar los dos e primeros argumentos que recibe son el objeto que genera la seal y la seal en si n n misma ante la que tiene que responder, los ultimos dos argumentos corresponden al objeto que va a recibir la seal, en este caso nuestra aplicacin app y el slot.. Un SLOT es n o Esta linea de cdigo lo que hace es enlazar el objeto boton con el SLOT quit() una o funcin o que actuara sobre el objeto app al producirse la seal clicked(). n normal de una clase especialmente denida para reaccionar 1 QObject :: connect ( boton , SIGNAL ( clicked () ) , & app , SLOT ( quit () ) ) ; ante una seal n

1.5.3.

Un poco mas sobre slots y se ales n

Todos los widgets emiten seales y tienen slots, podemos as conectar la n seal emitida de un determinado widget para que acte sobre otro mediante n u el llamado a uno de sus slots. La idea es, cuando se produce un evento en un objeto, ste emite una seal. Esa seal se puede conectar con un slot (que no e n n deja de ser un mtodo de otro objeto) que responde a esa seal. e n Adems, es posible conectar una seal a varios slots. O hace que un slot a n responda a varias seales. n En el ejemplo siguiente vemos como tres objetos que emiten seales (QSpinn Box, QDial y QSlider) y uno que no (QLabel) se interconectan usando este mecanismo para cambiar su estado de acuerdo a los eventos que disparan seales n en cada uno de los objetos. Veamos el cdigo. o

1 2 3 4 5 6

# include # include # include # include # include # include

< QAction > < QApplication > < QButtonGroup > < QDial > < QFrame > < QLabel >

CAP ITULO 1. COMENZANDO

7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46

19

# include # include # include # include

< QPushButton > < QSlider > < QSpinBox > < QVBoxLayout >

int main ( int argc , char * argv []) { QApplication app ( argc , argv ) ; QWidget ventana ; QVBoxLayout * verticalLayout = new QVBoxLayout (& ventana ) ; QSpinBox * spinBox = new QSpinBox () ; QDial * dial = new QDial () ; dial - > setObjectName ( QString :: fromUtf8 (" dial ") ) ; QSlider * ho r iz on t al S li d er = new QSlider () ; horizontalSlider - > setOrientation ( Qt :: Horizontal ) ; QLabel * label = new QLabel () ; QPushButton * salirButton = new QPushButton (" Salir ") ; verticalLayout - > addWidget ( spinBox ) ; verticalLayout - > addWidget ( dial ) ; verticalLayout - > addWidget ( ho r iz o nt a lS l id e r ) ; verticalLayout - > addWidget ( label ) ; verticalLayout - > addWidget ( salirButton ) ; ventana . show () ; QObject :: connect ( spinBox , SIGNAL ( valueChanged ( int ) ) , dial , SLOT ( setValue ( int ) ) ) ; QObject :: connect ( spinBox , SIGNAL ( valueChanged ( int ) ) , horizontalSlider , SLOT ( setValue ( int ) ) ) ; QObject :: connect ( spinBox , SIGNAL ( valueChanged ( int ) ) , label , SLOT ( setNum ( int ) ) ) ; QObject :: connect ( dial , SIGNAL ( valueChanged ( int ) ) , spinBox , SLOT ( setValue ( int ) ) ) ; QObject :: connect ( dial , SIGNAL ( valueChanged ( int ) ) , horizontalSlider , SLOT ( setValue ( int ) ) ) ; QObject :: connect ( dial , SIGNAL ( valueChanged ( int ) ) , label , SLOT ( setNum ( int ) ) ) ; QObject :: connect ( horizontalSlider , SIGNAL ( valueChanged ( int ) ) , spinBox , SLOT ( setValue ( int ) ) ) ; QObject :: connect ( horizontalSlider , SIGNAL ( valueChanged ( int ) ) , label , SLOT ( setNum ( int ) ) ) ; QObject :: connect ( horizontalSlider , SIGNAL ( valueChanged ( int ) ) , dial , SLOT ( setValue ( int ) ) ) ; QObject :: connect ( salirButton , SIGNAL ( clicked () ) , & app , SLOT ( quit () ) ) ; return app . exec () ; }

1.5.4.

Entendiendo el cdigo o

Podemos ver que tenemos en este ejemplo algunos nuevos widgets que la librer QT nos ofrece, una vez instanciados y ordenados en un Layout vertical a hacemos todas las confecciones necesarias para que cualquier evento que se produzca en los widgets capaces de emitir seales disparen una accin. En este caso n o en particular el cambio de cualquiera de los widgets con valores variables modica a los otros, la unica excepcin es QLabel que como sabemos no es editable. o En el diagrama de la Figura 1.5.

CAP ITULO 1. COMENZANDO

20

Figura 1.5: Diagrama de interconexin de seales y slots o n Si ejecutamos este ejemplo obtenemos la ventana de la Figura 1.6 donde podemos ver que los valores de cada widget es coherente con los otros. Las lineas del programa que realizan estas conexiones son las siguientes.

1 2 3 4 5 6 7 8 9 10

QObject :: connect ( spinBox , SIGNAL ( valueChanged ( int ) ) , dial , SLOT ( setValue ( int ) ) ) ; QObject :: connect ( spinBox , SIGNAL ( valueChanged ( int ) ) , horizontalSlider , SLOT ( setValue ( int ) ) ) ; QObject :: connect ( spinBox , SIGNAL ( valueChanged ( int ) ) , label , SLOT ( setNum ( int ) ) ) ; QObject :: connect ( dial , SIGNAL ( valueChanged ( int ) ) , spinBox , SLOT ( setValue ( int ) ) ) ; QObject :: connect ( dial , SIGNAL ( valueChanged ( int ) ) , horizontalSlider , SLOT ( setValue ( int ) ) ) ; QObject :: connect ( dial , SIGNAL ( valueChanged ( int ) ) , label , SLOT ( setNum ( int ) ) ) ; QObject :: connect ( horizontalSlider , SIGNAL ( valueChanged ( int ) ) , spinBox , SLOT ( setValue ( int ) ) ) ; QObject :: connect ( horizontalSlider , SIGNAL ( valueChanged ( int ) ) , label , SLOT ( setNum ( int ) ) ) ; QObject :: connect ( horizontalSlider , SIGNAL ( valueChanged ( int ) ) , dial , SLOT ( setValue ( int ) ) ) ; QObject :: connect ( salirButton , SIGNAL ( clicked () ) , & app , SLOT ( quit () ));

Donde por cada widget emisor de seales se hacen tres conexiones a cada uno n de los widgets capaces de recibir esas seales en sus slots. n

CAP ITULO 1. COMENZANDO

21

Figura 1.6: Ventana del ejemplo 5

Apndice 1 e
Licencia
Copyright (c) Luis Tomas Wayar. Se concede permiso para copiar, distribuir y/o modicar este documento bajo los trminos de la Licencia de Documentacin e o Libre de GNU, Versin 1.3 o cualquier otra versin posterior publicada por o o la Free Software Foundation; sin Secciones Invariantes ni Textos de Cubierta Delantera ni Textos de Cubierta Trasera. Una copia de la licencia est incluida a en la seccin titulada GNU Free Documentation License. o

22

Index
addWidget, 14 clicked, 18 connect, 18 Layouts, 12, 14 Makele, 10 QApplication, 10 QBoxLayout, 12 QCheckBox, 14 QDial, 18 QFormLayout, 12 QGridLayout, 12 QHBoxLayout, 12, 14 QLabel, 11, 14, 18 QLayout, 12 QLineEdit, 14 qmake, 10 QObject, 18 QPushButton, 14 QRadioButton, 14 QSlider, 18 QSpinBox, 18 QStackedLayout, 12 QT, 10 QTextEdit, 14 quit, 18 QVBoxLayout, 12, 14 Seales, 17 n slots, 17

23