Preparación del entorno de desarrollo

Se requiere descargar el SDK de JavaFX (archivos JAR) y la herramienta Scene Builder. Los JAR se agregan al proyecto en IntelliJ IDEA a través de la ruta de módulos (Ctrl+Shift+Alt+S). Luego se especifica la ubicación del ejecutable de Scene Builder en Settings → Languages & Frameworks → JavaFX.

Estructura básica del proyecto

Un proyecto JavaFX se oragniza típicamente con un archivo de descripción de interfaz (.fxml), una clase controladora que gestiona los eventos y una clase principal que carga la escena. La siguiente ilustración resume la jerarquía de componentes:

• Stage: ventana principal de la aplicación.
• Scene: contenedor raíz que aloja los nodos visuales.
• Layouts (como AnchorPane): contenedores que organizan los controles.
• Controls: botones, campos de texto, etiquetas, etc.

Diseño visual con Scene Builder

Scene Builder evita tener que escribir manualmente todo el código de la interfaz. Genera un archivo XML (FXML) que describe la disposición de los componentes. Al abrir un archivo .fxml con Scene Builder, se pueden arrastrar controles desde la paleta al panel de diseño.

En el siguiente ejemplo, se construye una ventana con un botón y un campo de texto. Se asigna un identificador único a cada control (atributo fx:id) y se define un método controlador para el evento On Action del botón. La vista previa permite verificar el resultado antes de guardar.

Vinculación entre la vista y el controlador

En el archivo FXML se especifica la clase controladora con el atributo fx:controller dentro del nodo raíz. Esto permite que el controlador reciba referencias a los controles mediante la anotación @FXML. Al presionar el botón, el método asociado ejecuta la lógica de negocio y actualiza la interfaz.

Ejemplo de archivo FXML:

<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>

<AnchorPane prefHeight="350.0" prefWidth="500.0" xmlns="http://javafx.com/javafx/17" xmlns:fx="http://javafx.com/fxml/1" fx:controller="ControladorSaludo">
   <children>
       <Button fx:id="btnSaludo" layoutX="150.0" layoutY="80.0" text="Saludar" onAction="#mostrarSaludo"/>
       <TextField fx:id="txtResultado" layoutX="150.0" layoutY="140.0" prefWidth="200.0"/>
   </children>
</AnchorPane>
 

Clase controladora:

import java.net.URL;
import java.time.LocalDateTime;
import java.time.format.DateTimeFormatter;
import java.util.ResourceBundle;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.Button;
import javafx.scene.control.TextField;

public class ControladorSaludo implements Initializable {

   @FXML
   private Button btnSaludo;

   @FXML
   private TextField txtResultado;

   @Override
   public void initialize(URL location, ResourceBundle resources) {
       // Inicialización si es necesaria
   }

   public void mostrarSaludo() {
       LocalDateTime ahora = LocalDateTime.now();
       DateTimeFormatter formato = DateTimeFormatter.ofPattern("dd/MM/yyyy HH:mm:ss");
       String mensaje = "Hola, son las " + ahora.format(formato);
       txtResultado.setText(mensaje);
   }
}
 

Clase principle de la aplicación:

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;

public class AppPrincipal extends Application {
   @Override
   public void start(Stage escenario) throws Exception {
       Parent raiz = FXMLLoader.load(getClass().getResource("/VentanaSaludo.fxml"));
       escenario.setTitle("Demo JavaFX");
       escenario.setScene(new Scene(raiz));
       escenario.show();
   }

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

Al ejecutar la aplicación, se muestra la ventana diseñada. Al hacer clic en el botón, el campo de texto refleja el saludo con la fecha y hora actuales. Este flujo básico ilustra la comunicación entre la vista (FXML), el contrloador y el modelo de datos, siguiendo un patrón MVC sencillo.