Interfáz grafica con Swing

A continuación se describe el proceso para crear una aplicación gráfica en Java, utilizando la librería Swing

1.- Iniciar NetBeans, y seleccionar nuevo proyecto, posteriormente elegir la categoría Java, y el tipo de proyecto Java Application.

2.- El nombre del proyecto será practica14, una vez cambiado el nombre se hace clic en Finish.

3.- Una vez creado el proyecto se tendrá una ventana como la siguiente, donde se puede apreciar el nombre del proyecto y el código fuente generado default.

4.- En el package practica14, hacer clic con el botón derecho del ratón, con esta acción se desplegara una lista de opciones, donde se elegirá la opción New -> JFrame Form… con esto se agregara al proyecto actual una nueva clase, de tipo JFrame, que es un contenedor grafico, donde se pueden colocar elementos como botones, etiquetas, etc.

5.- Antes de crear el JFrame el asistente pregunta el nombre de la nueva clase, en este caso se pondrá Bienvenida, y posteriormente se hace clic en Finish.

6.- Una vez creado el JFrame, aparece una ventada como la siguiente, donde se puede ver del lado izquierdo un panel llamado Palette, donde se encuentran los componentes visuales como panel, button, label, etc. Que se pueden agregar al contenedor creado. También del lado izquierdo aparece un panel llamado Properties que muestra las propiedades del elemento seleccionado, en este caso el contorno del JFrame que aparece con color amarillo. En la parte central se ve un rectángulo amarillo que el JFrame, y en la parte de arriba aparecen 3 pestañas: Source, Design e History. • Source contiene el código fuente para crear el JFrame y las acciones que se programen en el. • Design es un asistente visual, que permite de forma muy sencilla arrastrar elementos y cambiar sus propiedades viendo en todo momento como será su aspecto final. • History guarda los cambios realizados en el código a través del tiempo.

7.- Como se puede apreciar en la siguiente imagen, ahora se tienen 2 clases dentro del package practica14, uno llamado Bienvenida.java y el Practica14.java, ambas clases tienen un triangulo amarillo, lo que significa que ambas tienen un método main, es decir que son clases principales y que se pueden ejecutar de forma independiente. Como se agregó un JFrame y se estará trabajando de aquí en adelante con el, hay que borrar el archivo Practica14.java, para que solo se tenga una clase principal. Para realizar dicho proceso se hace clic con botón derecho del mouse y se elige Delete.

Nota: Otra opción para no tener que eliminar esta clase, es que al momento de crear el proyecto, no se active la opción Create Main Class, con lo que se creara un proyecto nuevo sin clases ni packages.

8.- Cuando se elige la opción delete, el asistente muestra una ventana como la siguiente, permitiendo hacer una búsqueda en el proyecto para ver si en alguna pararte del código se hacer referencia a esta clase, y de ser así la elimina también.

9.- Una vez borrada la clase practica14.java, se ejecuta el proyecto con la tecla F6, o con el menú Run –> Run Project, con lo que el asistente preguntara cual de las clases es la que se desea ejecutar, como en este caso solo se tiene practica14.Bienvenida, es la que se selecciona.

10.- La ejecución de la aplicación mostrara un formulario vacío, con los botones de minimizar, maximizar y cerrar.

11.- Regresando a Netbeans, se va a poner un titulo a la ventana, haciendo clic en la propiedad title del panel Properties, y se le pondrá Formulario de Bienvenida.

12.- Ahora se agrega el componente jButton, arrastrándolo desde el Palette hasta el centro del JFrame.

13.-Una vez agregado el nuevo JButton, se le cambia el texto que mostrara al usuario, usando la propiedad text, donde se pondrá el texto Saludo.

14.-Cada que se agregue un nuevo componente es importante cambiar el texto que se mostrara a los usuarios, si es que cuenta con esta propiedad, y además cambiar el nombre default con el que se creo, de tal forma que se tenga un control total de los elementos agregados. Para hacer esto se hace clic derecho sobre el jButton, y se elige Change Variable Name…

15.- el nombre del jButton será jb_saludo, indicando con las siglas jb que es un JButton.

16.-Ya que se cambio el texto a visualizar y el nombre del componente, se creara un evento, donde se programara el comportamiento del botón, como se puede ver en la captura de pantalla, existen muchos eventos por componente que se pueden utilizar, lo que significa que un mismo componente puede tener varios comportamientos asignados a diferentes eventos. Para este caso se utilizara el evento Events -> Mouse -> mouseClicked.

17.-Cuando se crea un nuevo evento en la ventana de Source se aprecia que se ha agregado un nuevo método, con el nombre del componente y el nombre del evento seleccionado, en este caso jb_saludoMouseClicked.

18.- Dentro del método se agregara el código JOptionPane.showMessageDialog(null, “hola mundo Swing”); con lo que se conseguirá que al hacer clic en el botón saludo, se muestre una ventana con el texto antes escrito.

19.- Como se vio en practicas anteriores, es necesario agregar la librería JOptionPane para que se pueda mostrar el cuadro de dialogo de mensaje, esto se hace agregando debajo del package la línea import jvax.swing.JOptionPane;

20.- Una vez agregada la librería se ejecuta nuevamente el proyecto y el resultado será una venta con el título Formulario de Bienvenida, y que al hacer clic en el botón Saludo mostrara un mensaje. 21.-Aquí se muestra el mensaje mostrado al hacer clic en el botón.