Crear una Interfaz de Usuario y Contraseña en JavaFX con Funciones de Borrado y Ejecución

Introducción

En este tutorial, vamos a aprender a construir una interfaz gráfica de usuario en JavaFX que incluye campos para introducir un usuario y una contraseña, junto con dos botones: uno para borrar el formulario y otro para ejecutar una acción específica. Este tipo de interfaz es común en muchas aplicaciones que requieren autenticación de usuarios.

Configuración del Proyecto en Eclipse

Antes de comenzar, asegúrate de que tienes configurado tu entorno de desarrollo:

1. Instalar JDK: JavaFX requiere JDK 11 o superior.
2. Configurar Eclipse: Si aún no tienes Eclipse, descárgalo e instala la versión que soporta Java. Asegúrate de tener el plugin e(fx)clipse instalado para facilitar el desarrollo con JavaFX.

Creación del Proyecto JavaFX

1. Crear un nuevo proyecto: En Eclipse, ve a File > New > Project..., selecciona JavaFX Project y sigue los pasos para configurar tu nuevo proyecto.
2. Estructura del Proyecto: Eclipse generará la estructura básica, incluyendo una clase principal que extiende de Application.

Diseño de la Interfaz de Usuario

Ahora, procederemos a diseñar la interfaz de usuario. Aquí está el código para la interfaz:

package application;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.*;
import javafx.scene.layout.GridPane;
import javafx.stage.Stage;
import javafx.geometry.Insets;
import javafx.geometry.Pos;

public class LoginApplication extends Application {
    @Override
    public void start(Stage primaryStage) {
        primaryStage.setTitle("Login Interface");

        GridPane grid = new GridPane();
        grid.setAlignment(Pos.CENTER);
        grid.setHgap(10);
        grid.setVgap(10);
        grid.setPadding(new Insets(25, 25, 25, 25));

        Label usernameLabel = new Label("Usuario:");
        TextField usernameTextField = new TextField();
        Label passwordLabel = new Label("Contraseña:");
        PasswordField passwordField = new PasswordField();

        Button clearButton = new Button("Borrar");
        Button submitButton = new Button("Enviar");

        grid.add(usernameLabel, 0, 0);
        grid.add(usernameTextField, 1, 0);
        grid.add(passwordLabel, 0, 1);
        grid.add(passwordField, 1, 1);
        grid.add(clearButton, 0, 2);
        grid.add(submitButton, 1, 2);

        clearButton.setOnAction(e -> {
            usernameTextField.clear();
            passwordField.clear();
        });

        submitButton.setOnAction(e -> {
            executeLogin(usernameTextField.getText(), passwordField.getText());
        });

        Scene scene = new Scene(grid, 300, 200);
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    private void executeLogin(String username, String password) {
        System.out.println("Usuario: " + username + ", Contraseña: " + password);
        // Aquí puedes añadir la lógica para verificar el usuario y la contraseña
    }

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

Explicación del Código

• GridPane: Usamos un GridPane para organizar los componentes de la UI. Es ideal para crear formularios debido a su flexibilidad en la colocación y alineación de elementos.
• Campos de Texto y Etiquetas: Incluimos campos para ingresar el usuario y la contraseña.
• Botones: El botón Borrar limpia los campos de texto, mientras que el botón Enviar activa la función executeLogin, que actualmente imprime los datos ingresados en la consola.

Pruebas y Ejecución

Para probar tu interfaz, ejecuta la aplicación desde Eclipse utilizando Run As > Java Application. Deberías ser capaz de ver la interfaz, ingresar datos y utilizar los botones para interactuar con el formulario.

Conclusión

Este tutorial te ha guiado a través del proceso de creación de una interfaz de usuario básica en JavaFX. Este tipo de funcionalidades es fundamental en muchas aplicaciones, y puedes expandir este ejemplo básico con funciones más complejas como la validación de credenciales y la conexión con bases de datos.