PDF de programación - Generadores de Interfaces de Usuario: QT Designer, NetBeans y Windows Forms Designer

Generadores de Interfaces de Usuario: QT Designer, NetBeans y

Windows Forms Designer.

Universidad de Costa Rica, Escuela de Ciencias de la Computación e Informática



Alejandro Alvarez B.

San José, Costa Rica

[email protected]

AND

Universidad de Costa Rica, Escuela de Ciencias de la Computación e Informática

Esteban Valerio R.

San José, Costa Rica

[email protected]

Abstract

In this article, a brief introduction to the Graphic User Interfase Creators it's done. They're
introduced as an example of Fourth Generation Languages. Then, for three of them (QT Designer
Windows Form Designer, and NetBeans GUI Builder), their features are shown. Finally, some of
the advantages and disadvantages of the those tools are enumerated.

Keywords: 4GL, GUI Creators, GUI, NetBeans, QT Designer, Windows , Visual Estudio (Windows Forms), Form
Generator.

Resumen

En este artículo se hace una breve introducción a los Generadores de Pantallas. Se presentan los
mismos como un ejemplo de Lenguajes de Cuarta Generación. Luego se exponen las
características de tres de ellos: el QT Designer, el Windows Form Designer y el NetBeans GUI
Builder. Finalmente, se enumeran algunas de las ventajas y desventajas que presentan dichas
herramientas.

Palabras clave: 4GL, Diseñador de Interfaz Gráfica de Usuario, Interfaz Gráfica de Usuario, NetBeans, QT Designer,
Windows Forms, Visual Estudio (Windows Forms), Generador de Formularios

1. Introducción
En la actualidad es común que los usuarios de computadoras estén acostumbrados a utilizar programas con interfaces
gráficas. Estas interfases se utilizan usualmente en un rango muy amplio de programas que va desde los sistemas
operativos hasta aplicaciones específicas como reproductores o juegos. El objetivo final de dichas interfaces es que los
programas finales sean mucho más amigables y fáciles de usar para los usuarios.

No obstante, la necesidad utilizar interfaces gráficas en los programas impone una carga extra en los diseñadores y
desarrolladores de software, pues deben incorporarlas en sus aplicaciones aún en etapas muy tempranas del desarrollo
del mismo. Por ejemplo, las interfaces gráficas son muy utilizadas en el desarrollo de prototipos para obtener y validar
los requerimientos de las aplicaciones en la etapa de análisis del proceso de desarrollo de software.

Ahora bien, muchos lenguajes de programación no proporcionan librerías estándar para el manejo gráfico y, aún en
aquellos en que se proporcionan dichas librerías, el paso de todos los parámetros necesarios para crear y colocar los

1

diversos elementos en la pantalla es muy complicado y requiere un gran esfuerzo por parte de quien implementa dichas
interfaces.

Para solventar esta necesidad, surgieron una serie de herramientas especializadas de software que permiten crear esas
interfaces gráficas en forma sencilla reduciendo el número de parámetros que debe introducir el usuario y
proporcionando un alto nivel de abstracción para el diseño de las mismas. Estas herramientas son denominadas
creadores de interfases gráficas de usuario o diseñadores de pantallas.

En este artículo se hace una breve introducción a dichas herramientas. Para ello, en primer lugar, se expone el concepto
de interfaz gráfica de usuario, a continuación se explica qué son los diseñadores de interfaz gráfica de usuario, luego se
muestran las características de tres de ellos: el QT Designer, el NetBeans y el Windows Forms Designer y, finalmente,
se exponen las ventajas y desventajas de los diseñadores, en general.

2. Definición de una interfaz grafica de usuario

En Ciencias de la Computación, dentro de la disciplina de la Interacción Persona Computador, se define la GUI
(Graphics User Interface, Interfaz Gráfica de Usuario), como el medio de interacción entre un usuario y un sistema in­
formático que se realiza mediante el lenguaje visual [1]. Esta interfaz debe proveer al usuario un ambiente agradable y
sencillo para el correcto entendimiento y ejecución del programa.

El lenguaje visual de las GUI representa la información y acciones disponibles dentro de una aplicación por medio de un
conjunto de imágenes y gráficos lo suficientemente sencillos y manejables, con la meta ideal de que cualquier usuario,
dentro de un dominio cultural determinado, sin necesitad de demasiada experiencia previa, sea capaz de llevar a cabo las
tareas normales dentro de la aplicación.

La interfaz grafica de usuario es la evolución de los antiguos programas de línea de comando hasta lo que se ve en nues­
tros días en los que se empieza a experimentar con el uso de interfaces en tercera dimensión [7]. Es más, no es aventura­
do señalar que actualmente, dentro de la mente de un usuario promedio, una aplicación de software sin interfaz gráfica o
con una mala interfaz gráfica está destinada a morir en el olvido.

La revolución en el diseño de las interfaces dentro de las principales aplicaciones del mercado se comenzó a dar a me­
diados de los ochentas con la aparición de Apple en el mercado computacional, su sistema operativo grafico provocó un
fenómeno tan fuera de serie. De hecho las bases establecidas por dichos sistema operativo para las interfaces gráficas,
aún están en vigor. Luego comenzaron a aparecer las versiones de la competencia por parte de Microsoft, empezando
con el sistema operativo Windows 3.1 hasta la ultima versión de Windows, el Vista en cualquiera de sus presentaciones
[1].

En este artículo dará una breve introducción a varias herramientas 4GL (Fourth Generation Languages, Lenguajes de
Cuarta Generación) para desarrollar GUI (Graphics User Interfaces, Interfaces Gráficas de Usuario).

3. Definición de los diseñadores de GUI

Los diseñadores de interfases gráficas de usuario, son herramientas de software que permiten generar interfaces gráfi­
cas de usuario mediante un lenguaje cercano al lenguaje natural. En general, proveen una abstracción de las librerías de
diseño gráfico, para desarrollar en forma más sencilla las interfaces.

Los diseñadores de GUI modernos utilizan, a su vez, una interfaz gráfica para comunicarse con el desarrollador. Es de­
cir, el desarrollador crea su interfaz mediante el lenguaje gráfico proveído por la herramienta (paletas de componentes,
acciones de “arrastrar” y “soltar”, presión de botones, selectores de colores, etc). No obstante, dichas herramientas tam­
bién requieren el uso de texto para ajustar en forma fina el comportamiento y las propiedades de los componentes.

2

Los creadores de GUI se consideran un tipo de lenguajes de cuarta generación porque esa abstracción tan amplia permite
que el desarrollador al diseñar la interfase se concentre más en qué es lo que quiere hacer más que en cómo lograrlo. Es
interesante recalcar acá que el lenguaje utilizado por esas herramientas es el lenguje visual o gráfico, lo que permite que
las interfaces se construyan mediante una especie de analogía de colocar elementos sobre una mesa de trabajo. Para el
desarrollador el diseño de la pantalla se vuelve un problema de “acomodar” las piezas en el lugar correcto más que de­
terminar cuales son todos los parámetros que requieren cada uno de los componentes de la interfaz gráfica.

4. Ejemplos de Diseñadores de GUI

En esta sección expondremos algunas características relevantes de tres

4.1

QT Designer

QT Designer es una herramienta para el desarrollo de formularios y presentaciones gráficas para las aplicaciones. Permi­
te acelerar el desarrollo de interfaces de alto rendimiento, a la vez que proporciona una forma fácil de diseñar interfaces
gráficas de usuario avanzadas generando el código fuente para las mismas, lo que permite al desarrollador ajustarlo a sus
necesidades.

Este generador de interfaces fue creado inicialmente por la empresa TROLLTECH para trabajar en varias distribuciones
Linux. No obstante, actualmente puede instalarse en otras plataformas como Windows y Mac OsX.

El QT Designer utiliza como base la librería gráfica de QT, que ha sido transportada a diversas plataformas, lo que per­
mite que el código generado por el QT Designer pueda ser utilizado en diversas plataformas. Además, el QT funciona
sólo o asociándose a algunos entornos de desarrollo integrado como Visual Studio .Net o Eclipse. Esta herramienta pro­
vee características muy poderosas como la previsualización de la interfaz, soporte para widgets y un editor de propieda­
des bastante poderoso.

Imagen 1: Diseñador de Interfases QT

Qt y Qt Designer tienen dos opciones principales de licenciamiento: Licencia Comercial y Licencia OpenSource. La li­
cencia comercial (que debe ser pagada) se usa cuando el desarrollador está creando aplicaciones de su propiedad para la

3

distribución comercial de las mismas. La licencia Open Source es gratuita pero implica que el desarrollador se ve obliga­
do a liberar su código fuente y hacer una distribución gratuita de su aplicación. [14]

La librería QT es una librería implementada en C++ y orientada a objetos. Actualmente hay enlaces para otros lenguajes
como Python o Perl y, en el caso de java, se ha desarrollado un API (Aplication Programming Interface, Interfaz para
Programación de Aplicaciones) para poder utilizar esta librería C++ en aplicaciones Java.

Los conceptos básicos de la librería son los widgets (objetos), los slots (o señales) y los eventos.

Los widgets son contenedores que pueden contener widgets en cualquier cantidad de niveles. El widget "padre" de dicha
jerarquía puede ser cualquiera.

El QT Designer crea archivos (.ui) que contienen la especificación de la interfaz, provee una serie de plantillas
predeterminadas para crear los proyectos.

La interfaz para la creación de las GUI se basa en el uso de una paleta que clasifica los diversos objetos que incluye
muchos de los widgets de la librería QT y además permite la adición de nuevos widgets (aún cread