Documentos de Académico
Documentos de Profesional
Documentos de Cultura
Manual GUI NetBeans PDF
Manual GUI NetBeans PDF
Manual de creacin de
Interfaces de Usuario
en Netbeans
Versin 2.0
Jess Omar lvarez Mrquez
Programas necesarios
Para poder llevar a cabo lo descrito en este manual slo ser necesario bajarse
NetBeans de la siguiente pgina:
http://netbeans.org/index.html
En la fecha de creacin de este documento, la ltima versin disponible es la 6.8,
aunque segn la propia pgina de descarga se pueden conseguir los mismos
resultados desde la 6.5.
3. Rellenamos con los datos deseados el formulario, pero dejando marcadas las
casillas Create Main Class y Set as Main project. Pulsamos Finish.
6. Se nos debera abrir el archivo que hemos creado, mostrando la interfaz del GUI
Builder.
Zona de diseo
Esta es la zona que est contenida en el cuadrado rojo y que en un comienzo tan slo
contendr un rectngulo vaco. Sirve para colocar los distintos elementos de la interfaz
que estemos creando, cambiando sus parmetros (color, tamao, etc) y, en definitiva,
amoldndolos a los que queramos conseguir. En la parte superior tiene una barra de
herramientas con diferentes elementos:
1. Source Design: estos dos botones nos permiten cambiar entre modo de vista
de cdigo y grfico. En el Grfico podremos aadir los distintos elementos de la
interfaz, mientras que en el de vista de cdigo les daremos funcionalidad.
Ntese que en la parte de cdigo aparecern zonas sombreadas de azul, lo
que significar que ese trozo de cdigo slo puede ser editado mediante el GUI
Builder y no de forma manual.
2. En esta parte tenemos 3 botones muy tiles.
a. Modo Seleccin: nos permite seleccionar los elementos de la interfaz y
moverlos o cambiar su tamao.
b. Modo Conexin: nos deja definir la relacin entre dos elementos de la
interfaz, sin tener que entrar en la vista de cdigo.
c. Vista previa: aparece una interfaz preliminar para que podamos evaluar
su funcionalidad antes de compilar.
3. Botones de autoajuste: con ellos podemos alinear los elementos de la interfaz
de forma automtica.
4. Pautas de autoredimensionamiento: indican si al ampliar la ventana principal de
la interfaz los elementos que contenga se redimensionan con ella o no.
Swing Containers: en esta parte se encuentran los elementos que slo sirven
para contener a otros, pero que por s mismos no hacen nada. Ejemplos de ello
son las barras de herramientas o los mens tabulares. Si queremos que
contengan algo, debemos aadirlo en su interior.
Swing Controls: aqu se almacenan los elementos mediante los que se crea o
almacena informacin y rdenes, y que pueden estar contenidos en los
descritos anteriormente o no. Como ejemplos, tenemos botones, etiquetas,
barras deslizantes o tablas.
Swing Menus: aqu hay distintos elementos que ayudan a la creacin de barras
de mens, aadiendo los mens propiamente dichos y sus elementos.
Swing Windows: en esta seccin tenemos una serie de ventanas que aparecen
como dilogos, y que son tiles a la hora de crear eventos de advertencia y
similares.
AWP: estos elementos son similares a los visto con anterioridad en Swing
Containers y Swing Controls, pero con un diseo anticuado y simple, pues
AWP es una biblioteca de clases para el desarrollo de interfaces anterior a
Swing, la cual no es ni ms ni menos que una extensin de la primera.
Java Persistence: en este ltimo apartado se hallan los elementos
correspondientes a consultas sobre bases de datos.
Propiedades de elementos
Es la parte que est en el recuadro azul. Aqu se mostrarn las propiedades del
elemento que tengamos seleccionado en ese momento, permitiendo a su vez su
alteracin.
Inspector
A parte de las zonas anteriores, existe una
zona ms, en la esquina inferior izquierda,
llamada Inspector. Es aqu donde
encontramos un resumen en forma de
rbol de todos los elementos que hemos
ido aadiendo a la interfaz, pudiendo
adems seleccionarlos directamente o
cambiar sus propiedades pinchando en
opcin adecuada al hacer clic con el botn
derecho del ratn sobre ellos, sin
necesidad de buscarlos en la propia
interfaz.
Aadir un elemento
Basta con seleccionar el que queramos y arrstralo hasta la zona de diseo. En un
principio suele ser mejor insertar primero los elementos contenedores, tales como
paneles o mens, para luego ir aadiendo los dems. En el ejemplo hemos aadido 2
paneles:
*Nota: ahora mismo se ven ambos paneles porque estn seleccionados, pero de no
ser as no se vera nada, pues los paneles por defecto no traen borde.
Modificar atributos
Lo primero que debemos hacer es redimensionarlos hasta estar conformes con el
resultado. Despus, seleccionamos el que queramos y en la zona de propiedades los
modificamos a nuestro gusto. En este caso, hemos aadido un borde con titulo a las
paletas, y de camino unos cuando elementos ms, como botones o eqtiquetas:
Anclaje
EL anclaje se refiere a la capacidad de un elemento de adaptarse al tamao de la
ventana o del objeto que la contiene (algo as como una interfaz dinmica en cuanto a
tamao). Se puede realizar de forma automtica si acercamos un el elemento hasta el
borde de la tabla de diseo o del contenedor, cuando aparece una lnea punteada
(imagen anterior). Para hacerlo de forma manual simplemente basta con seleccionar o
deseleccionar las opciones que vimos en la zona de diseo nmero 4, y que
relacionan contenedor con contenido en ancho, alto, o ambos a la vez.
Vase la diferencia en la siguiente imagen:
Otro tipo de anclaje es el que se da entre un elemento y otro al mismo nivel (ninguno
contiene al otro), que hace que se conserve la posicin relativa entre ambos(como
pasa con el Botn del ejemplo, que conserva la posicin con respecto al borde). Esto
se consigue usando las guas que aparecen mientras se arrastra un objeto: si lo
ponemos a la distancia de una de las lneas que aparecen en otro elemento, esa
distancia no se alterar nunca:
10
11
12
5. Por ltimo aparecer otro formulario que nos preguntar cmo queremos
visualizar las columnas de las tablas. Elegimos la opcin que queramos y
finalizamos.
Llegados a este punto, debera haberse creado una interfaz con un formulario que
realiza las tareas ms sencillas sobre nuestra BD: consultar, aadir y borrar. A partir
de aqu, le podemos aadir la funcionalidad y el formato que deseemos, como barras
deslizantes para dar valor a los campos.
13