Introducción aplicaciones gráficas en Java

Hola a todos, hoy os explicare una introducción sobre las aplicaciones gráficas en Java, veremos un ejemplo práctico de como crear una aplicación gráfica.

Hasta ahora, hemos visto como crear aplicaciones simples que muestran información por consola o por dialogo. Las aplicaciones mas comunes tienen una ventana con sus botones y otros elementos que según interactuemos hará una acción u otra.

Para programar las acciones de la aplicación gráfica usaremos Listeners, esto lo veremos mas adelante. Por ahora, veremos como se crea una ventana gráfica y sus operaciones básicas.

La diferencia entre las aplicaciones que hemos visto hasta ahora y las aplicaciones gráficas es en el flujo del programa, es decir, mientras que en las aplicaciones que hemos visto nosotros definíamos el flujo del programa y en las aplicaciones gráficas este flujo lo determina el usuario que use la aplicación.

En Java, tenemos dos principales bibliotecas que manejan los elementos gráficos, estas son javax.swing y java.awt. La mas usada es la primera, pero para ciertas operaciones aun se sigue usando la segunda.

La estructura de un programa es la siguiente:

  • Contenedor: es el elemento base de la aplicación gráfica, representa la ventana de la aplicación sobre las que se añaden los distintos componentes. Sin este elemento no podríamos hacer nada.
  • Panel: es el elemento que se coloca en el contenedor, sobre este pueden haber distintos componentes. Si no añadimos el panel al contenedor no veremos nada, aunque la ventana tenga componentes.
  • Componentes: son los elementos que se añaden al Panel como etiquetas, botones, lista, checkbox, etc.

Todas los elementos que usaremos son clases, por lo que crearemos objetos de estas clases.

Empecemos con el ejemplo práctico, lo primero que haremos es crear un nuevo proyecto y crear una aplicación sin main. Esta clase haremos que herede los elementos de la clase JFrame, que sera el contenedor de nuestra aplicación. Recuerda que debemos importar la clase JFrame, que esta en javax.swing.

import javax.swing.*;

public class AplicacionGrafica extends JFrame{

}

Para crear la ventana, crearemos un constructor por defecto, también podemos ponerle algún parámetro que queramos nosotros.

Ahora realizaremos algunas operaciones básicas, usando algunos métodos que provienen de la clase JFrame (la clase que hemos heredado), no todas son estrictamente necesarias, lo iremos indicando.

import javax.swing.*;

public class AplicacionGrafica extends JFrame{

	public AplicacionGrafica(){

		//Añade un titulo, no es estrictamente necesario
		setTitle("Titulo de la ventana");

		/*
		 * Coordenadas x y de la aplicacion y su altura y longitud,
		 * si no lo indicamos aparecera una ventana muy pequeña
		 */
		setBounds(400, 200, 250, 300);

		/*
		 * Indica que cuando se cierre la ventana se acaba la aplicacion,
		 * si no lo indicamos cuando cerremos la ventana la aplicacion seguira funcionando
		 */
		setDefaultCloseOperation(EXIT_ON_CLOSE);

		//Hace visible la ventana, si no lo hacemos no veremos la aplicacion
		setVisible(true);

	}
}

Ahora, vamos a crear un atributo JPanel, que sera el panel donde insertemos los componentes. También añadiremos el panel al contenedor y definiremos su estilo (lo veremos con detalle mas adelante).

import javax.swing.*;

public class AplicacionGrafica extends JFrame{

	/**
	 * Panel de la aplicacion
	 */
	private JPanel contentPane;
	public AplicacionGrafica(){

		//Añade un titulo, no es estrictamente necesario
		setTitle("Titulo de la ventana");

		/*
		 * Coordenadas x y de la aplicacion y su altura y longitud,
		 * si no lo indicamos aparecera una ventana muy pequeña
		 */
		setBounds(400, 200, 250, 300);

		/*
		 * Indica que cuando se cierre la ventana se acaba la aplicacion,
		 * si no lo indicamos cuando cerremos la ventana la aplicacion seguira funcionando
		 */
		setDefaultCloseOperation(EXIT_ON_CLOSE);

		//Hace visible la ventana, si no lo hacemos no veremos la aplicacion
		setVisible(true);

		//Creamos el panel
		contentPane =new JPanel();

		//Indicamos su diseño
		contentPane.setLayout(null);

		//asigno el pannel a la ventana
		setContentPane(contentPane);

	}
}

Una aplicación gráfica puede tener varios paneles, aunque lo normal es que tenga uno. Ahora vamos a crear una nueva clase ejecutable y crearemos un objeto de la clase que acabamos de crear. Así quedaría:

public class AplicacionGraficaApp {

	public static void main(String[] args) {
		AplicacionGrafica ventana=new AplicacionGrafica();

	}

}

Vamos a ver como se añaden componentes. Añadiremos una simple etiqueta, la mayoría de los componentes se crean de la misma manera.

import javax.swing.*;

public class AplicacionGrafica extends JFrame{

	/**
	 * Panel de la aplicacion
	 */
	private JPanel contentPane;
	public AplicacionGrafica(){

		//Añade un titulo, no es estrictamente necesario
		setTitle("Titulo de la ventana");

		/*
		 * Coordenadas x y de la aplicacion y su altura y longitud,
		 * si no lo indicamos aparecera una ventana muy pequeña
		 */
		setBounds(400, 200, 250, 300);

		/*
		 * Indica que cuando se cierre la ventana se acaba la aplicacion,
		 * si no lo indicamos cuando cerremos la ventana la aplicacion seguira funcionando
		 */
		setDefaultCloseOperation(EXIT_ON_CLOSE);

		//Hace visible la ventana, si no lo hacemos no veremos la aplicacion
		setVisible(true);

		//Creamos el panel
		contentPane =new JPanel();

		//Indicamos su diseño
		contentPane.setLayout(null);

		//asigno el pannel a la ventana
		setContentPane(contentPane);

		//Creacion de componentes

		//Creo el componente
		JLabel etiqueta=new JLabel("¡Hola mundo!");

		//Colocamos el componente
		etiqueta.setBounds(60, 20, 100, 20);

		//Añadimos el elemento al panel, sino no se vera
		contentPane.add(etiqueta);
	}
}

Al ejecutar la aplicación nos aparecerá nuestra ventana. ventana ejemplo Si te resulta mas cómodo, para no tener que crear dos clases, podemos unirla en una. Quedaría de esta forma:

import javax.swing.*;

public class AplicacionGrafica extends JFrame{

	/**
	 * Panel de la aplicacion
	 */
	private JPanel contentPane;
	public AplicacionGrafica(){

		//Añade un titulo, no es estrictamente necesario
		setTitle("Titulo de la ventana");

		/*
		 * Coordenadas x y de la aplicacion y su altura y longitud,
		 * si no lo indicamos aparecera una ventana muy pequeña
		 */
		setBounds(400, 200, 250, 300);

		/*
		 * Indica que cuando se cierre la ventana se acaba la aplicacion,
		 * si no lo indicamos cuando cerremos la ventana la aplicacion seguira funcionando
		 */
		setDefaultCloseOperation(EXIT_ON_CLOSE);

		//Hace visible la ventana, si no lo hacemos no veremos la aplicacion
		setVisible(true);

		//Creamos el panel
		contentPane =new JPanel();

		//Indicamos su diseño
		contentPane.setLayout(null);

		//asigno el pannel a la ventana
		setContentPane(contentPane);

		//Creacion de componentes

		//Creo el componente
		JLabel etiqueta=new JLabel("¡Hola mundo!");

		//Colocamos el componente
		etiqueta.setBounds(60, 20, 100, 20);

		//Añadimos el elemento al panel, sino no se vera
		contentPane.add(etiqueta);

	}

	public static void main(String[] args) {
		AplicacionGrafica ventana=new AplicacionGrafica();

	}

}

Si has probado a colocar un componente con el método setBounds, veras que es un poco incomodo, veremos como podemos optimizar la creación de aplicaciones gráficas con el plugin WindowsBuilder de Eclipse, es importante saber al menos la estructura como hemos visto en este post.

También es aconsejable crear métodos para que el constructor tenga menos lineas y sea mas claro (como la creación de componentes específicos).

Para aplicaciones gráficas os recomiendo usar el IDE netbeans, ya que esta más optimizado y es más sencillo de hacer. Aquí te dejo el manual.

Espero que os sea de ayuda. Si tenéis dudas, preguntad. Estamos para ayudarte.

Etiquetas

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *