Crear una Pantalla de Login en JavaFX con Eclipse

Introducción

En este tutorial, aprenderás cómo construir una pantalla de login básica utilizando JavaFX en Eclipse. Este formulario permitirá a los usuarios ingresar su nombre de usuario y contraseña, demostrando un enfoque práctico para el manejo de formularios GUI en aplicaciones de escritorio Java.

Configuración del Proyecto en Eclipse

Primero, necesitas configurar tu entorno de desarrollo:

1. Instalar JDK y Eclipse: Asegúrate de tener el Java Development Kit (JDK) y Eclipse instalados. JavaFX requiere JDK 11 o superior debido a la inclusión de JavaFX en su librería estándar desde esta versión.
2. Instalar e(fx)clipse: Agrega el plugin e(fx)clipse a Eclipse desde el Eclipse Marketplace para facilitar el desarrollo en JavaFX.

Creación del Proyecto JavaFX

1. Crear un nuevo proyecto: En Eclipse, ve a File > New > Project..., elige JavaFX Project bajo la carpeta JavaFX y sigue los pasos para nombrar y configurar tu proyecto.
2. Estructura del proyecto: El proyecto contendrá una estructura básica con una clase principal que extiende de Application.

Implementación de la Pantalla de Login

Vamos a diseñar la interfaz de usuario y la lógica para nuestra pantalla de login.

package application;

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

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

        // GridPane para organizar los controles
        GridPane grid = new GridPane();
        grid.setAlignment(Pos.CENTER);
        grid.setHgap(10);
        grid.setVgap(10);
        grid.setPadding(new Insets(25, 25, 25, 25));

        // Componentes de la interfaz
        Label userName = new Label("Usuario:");
        TextField userTextField = new TextField();
        Label pw = new Label("Contraseña:");
        PasswordField pwBox = new PasswordField();
        Button btn = new Button("Iniciar sesión");
        final Label message = new Label();

        // Añadiendo componentes al GridPane
        grid.add(userName, 0, 1);
        grid.add(userTextField, 1, 1);
        grid.add(pw, 0, 2);
        grid.add(pwBox, 1, 2);
        grid.add(btn, 1, 4);
        grid.add(message, 1, 6);

        // Evento de botón
        btn.setOnAction(e -> {
            if (userTextField.getText().equals("admin") && pwBox.getText().equals("password123")) {
                message.setText("Inicio de sesión exitoso");
            } else {
                message.setText("Credenciales inválidas");
            }
        });

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

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

Explicación del Código

• GridPane: Utilizamos un GridPane para posicionar los controles de forma ordenada. Este layout facilita la alineación de los componentes de texto y botones.
• Controladores de Usuario y Contraseña: TextField para el nombre de usuario y PasswordField para la contraseña aseguran que la entrada de datos sea adecuada para cada tipo de información.
• Botón y Eventos: El botón «Iniciar sesión» desencadena un evento que verifica las credenciales. Por simplicidad, estamos usando valores codificados, pero en una aplicación real, conectarías esto a una base de datos o un servicio de autenticación.

Conclusión

Este tutorial te ha guiado a través de los pasos para crear una pantalla de login en JavaFX utilizando Eclipse. Este es un punto de partida básico y puede ser expandido con funcionalidades adicionales como conexión a bases de datos, encriptación de contraseñas y un diseño de interfaz más elaborado. Esperamos que este ejemplo te haya proporcionado una base sólida para tus proyectos de JavaFX.