Diseño de interfaces

Antes de empezar a trabajar con las interfaces gráficas de usuario debemos saber cómo diseñarlas:

• De qué elementos pueden estar compuestas
• Para qué podemos utilizar cada uno de estos elementos.
• Cómo distribuir dichos elementos en las interfaces.
• Las diferentes posibilidades que nos ofrece JavaFX para llevar a cabo este diseño, etc.

Para ello primero mostraré cómo diseñar las interfaces gráficas de usuario utilizando código para ello y luego veremos la alternativa a la utilización del código que nos ofrece JavaFX mediante el uso de ficheros XML (llamados en JavaFX FXML).

Un esqueleto básico de una aplicación JavaFx podría ser el que muestro en la plantilla. En Java FX solemos tener un escenario principal en el que podemos mostrar una o varias escenas. Éstas escenas serán las que contendrán la jerarquía de nodo, partiendo de un nodo raíz.

Aún así, os dejo el código básico que debe contener el esqueleto de una aplicación JavaFX:

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.Pane;
import javafx.stage.Stage;

public class Plantilla extends Application {

	@Override
	public void start(Stage escenarioPrincipal) {
		try {
			Pane raiz = new Pane();
			
			Scene escena = new Scene(raiz, 400, 400);
			escenarioPrincipal.setTitle("Plantilla");
			escenarioPrincipal.setScene(escena);
			escenarioPrincipal.show();
		} catch(Exception e) {
			e.printStackTrace();
		}
	}

	public static void main(String[] args) {
		launch(args);
	}
}

Ni que decir tiene, que el nombre del paquete y de la clase lo deberéis cambiar a vuestra conveniencia.

El código del esqueleto anterior generará la siguiente interfaz.

Ahora veremos cómo ir añadiendo elementos a dicha interfaz para adecuarla a nuestras necesidades.