Curso de JavaFX | 2. Crear una escena básica

Por 9.99€ al mes tendrás acceso completo a todos los cursos. Sin matrícula ni permanencia.

En esta lección aprenderás a crear una escena básica en JavaFX, que será el punto de partida para desarrollar interfaces gráficas interactivas. Veremos cómo estructurar una ventana simple y añadir una escena con un diseño de distribución básico.

¿Qué aprenderás en esta lección?

• Cómo inicializar una aplicación JavaFX.
• Crear un StackPane, que es un tipo de contenedor para organizar elementos visuales.
• Establecer una escena y asociarla a un escenario (ventana principal).
• Hacer visible la ventana de la aplicación.

Código base de una escena básica

Aquí tienes el código que usaremos como ejemplo:

public class MainEscenaBasica extends Application {
	@Override
	public void start(Stage primaryStage) {
		try {
			//Especificamos el layout que definirá la distribución de los componentes en escena
			StackPane root = new StackPane();
			// Definimos la escena (la vista o ventana con la que el usuario va a interactuar)
			// Dicha escena recibe como parámetro la distrubución de sus componentes y sus medidas
			Scene scene = new Scene(root,400,400);
			// Para que una escena sea visible, debe ser añadida al escenario
			primaryStage.setScene(scene);
			// Hacemos visible el escenario
			primaryStage.show();
		} catch(Exception e) {
			e.printStackTrace();
		}
	}
	
	public static void main(String[] args) {
		launch(args);
	}
}

Explicación paso a paso

1. Importación de librerías:
   • javafx.application.Application: Necesario para crear la aplicación JavaFX.
   • javafx.scene.Scene: Representa el contenido dentro de la ventana.
   • javafx.scene.layout.StackPane: Un contenedor que organiza los elementos de manera apilada.
   • javafx.stage.Stage: Representa la ventana principal de la aplicación.
2. Clase principal que extiende Application: La clase debe extender Application, lo que permite usar el método start.
3. Método start: Este método es el punto de entrada donde configuramos la escena y el escenario.
   • Se crea un StackPane llamado root como layout principal.
   • Se define una escena con un tamaño de 400×400 píxeles.
   • La escena se asocia al escenario mediante primaryStage.setScene(scene).
   • Finalmente, el escenario se muestra con primaryStage.show().
4. Método main: Sirve para lanzar la aplicación con launch(args).

Ejecución del programa

1. Copia el código en tu entorno de desarrollo.
2. Asegúrate de tener las librerías de JavaFX correctamente configuradas.
3. Ejecuta la aplicación para ver una ventana de 400×400 píxeles vacía.

¿Qué puedes hacer después?

• Cambiar las dimensiones de la escena.
• Probar con diferentes tipos de layouts como VBox, HBox, o GridPane.
• Añadir componentes visuales como botones, etiquetas o campos de texto.

En la próxima lección aprenderás a detectar y procesar eventos en botones, lo que te permitirá interactuar con los elementos gráficos. ¡Continúa aprendiendo!