Login Form in JavaFX and MySQL

JavaFX is used to create GUI, Desktop applications in Java. The problem with Java Swing is that it is outdated, people are started using JavaFX. So, it’s time to learn JavaFX.

Note: I will user Netbeans IDE throughout this article, you can use any other IDE’s you want.

Create a new project in Netbeans IDE
File-> New Project->JavaFX->JavaFX FXML Application-> Project Name-> Finish

Steps to be followed:
Step 1: Add MySQL JDBC Driver to your project

Step 2: Create two packages util and frames

Step 3: Inside util package, Create a java class with a name ‘ConnectionUtil’

Step 4: Inside frames package, Create two java class and two fxml files with name ‘FXMLDocument.fxml’, ‘FXMLMenu.fxml’, ‘FXMLDocumentController.java’ and ‘LoginApplication.java’

Step 5: Create DB a with name ‘swingapp’ and create a table with a name ’employee’

Open MySQL DB and execute this command,

CREATE DATABASE swingapp;

To create a table inside the newly created DB, execute this command,

USE swingapp;

Let’s create our table, by executing this query,

CREATE TABLE employee(
id int not null primary key auto_increment,
email varchar(55) not null,
password varchar(55) not null
);

Now, insert some values to your table

INSERT INTO employee(email, password) VALUES('bushasn', '12345');
INSERT INTO employee(email, password) VALUES('bharath', '12345');

Here is the project structure,

Now,  Let’s write our Jdbc connection code,

ConnectionUtil.java

package com.codingbybushan.util;

import java.sql.*;
import javax.swing.*;
public class ConnectionUtil {
Connection conn = null;
public static Connection connectdb()
{
try
{
Class.forName("com.mysql.jdbc.Driver");
Connection conn = DriverManager.getConnection("jdbc:mysql://localhost/swingapp","root","root");
return conn;
}
catch(Exception e)
{
JOptionPane.showMessageDialog(null, e);
return null;
}
}
}

LoginApplication.java

package com.codingbybushan.frames;

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

/**
*
* @author Bushan Sirgur
*/
public class LoginApplication extends Application {

@Override
public void start(Stage stage) throws Exception {
Parent root = FXMLLoader.load(getClass().getResource("FXMLDocument.fxml"));
Scene scene = new Scene(root);
stage.setScene(scene);
stage.show();
}

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

FXMLDocument.fxml

<?xml version="1.0" encoding="UTF-8"?>

<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>

<AnchorPane id="AnchorPane" prefHeight="437.0" prefWidth="548.0" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8.0.40" fx:controller="com.codingbybushan.frames.FXMLDocumentController">
<children>
<Button fx:id="button" layoutX="204.0" layoutY="162.0" onAction="#handleButtonAction" text="Login" />
<Label fx:id="label" layoutX="204.0" layoutY="269.0" prefHeight="17.0" prefWidth="149.0" />
<TextField fx:id="textEmail" layoutX="200.0" layoutY="65.0" />
<Label layoutX="107.0" layoutY="69.0" text="Email" />
<Label layoutX="107.0" layoutY="119.0" text="Password" />
<PasswordField fx:id="textPassword" layoutX="200.0" layoutY="115.0" />
</children>
</AnchorPane>

FXMLMenu.fxml

<?xml version="1.0" encoding="UTF-8"?>

<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>

<AnchorPane id="AnchorPane" prefHeight="400.0" prefWidth="600.0" xmlns:fx="http://javafx.com/fxml/1">

</AnchorPane>

FXMLDocumentController.java

package com.codingbybushan.frames;

import com.codingbybushan.util.ConnectionUtil;
import java.net.URL;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.util.ResourceBundle;
import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.fxml.FXMLLoader;
import javafx.fxml.Initializable;
import javafx.scene.Node;
import javafx.scene.Scene;
import javafx.scene.control.Alert;
import javafx.scene.control.Alert.AlertType;
import javafx.scene.control.PasswordField;
import javafx.scene.control.TextField;
import javafx.stage.Stage;

/**
*
* @author Bushan Sirgur
*/
public class FXMLDocumentController implements Initializable {

@FXML
private TextField textEmail;

@FXML
private PasswordField textPassword;

Stage dialogStage = new Stage();
Scene scene;

Connection connection = null;
PreparedStatement preparedStatement = null;
ResultSet resultSet = null;

public FXMLDocumentController() {
connection = ConnectionUtil.connectdb();
}

@FXML
private void handleButtonAction(ActionEvent event) {
String email = textEmail.getText().toString();
String password = textPassword.getText().toString();

String sql = "SELECT * FROM employee WHERE email = ? and password = ?";

try{
preparedStatement = connection.prepareStatement(sql);
preparedStatement.setString(1, email);
preparedStatement.setString(2, password);
resultSet = preparedStatement.executeQuery();
if(!resultSet.next()){
infoBox("Enter Correct Email and Password", "Failed", null);
}else{
infoBox("Login Successfull", "Success", null);
Node source = (Node) event.getSource();
dialogStage = (Stage) source.getScene().getWindow();
dialogStage.close();
scene = new Scene(FXMLLoader.load(getClass().getResource("FXMLMenu.fxml")));
dialogStage.setScene(scene);
dialogStage.show();
}

}catch(Exception e){
e.printStackTrace();
}
}

public static void infoBox(String infoMessage, String titleBar, String headerMessage)
{
Alert alert = new Alert(AlertType.INFORMATION);
alert.setTitle(titleBar);
alert.setHeaderText(headerMessage);
alert.setContentText(infoMessage);
alert.showAndWait();
}

@Override
public void initialize(URL url, ResourceBundle rb) {

}
}

Finally, Clean the project and run, here are some of the screen shots,

That’s all about this article, if you have any queries about this article, do mail me at sc.bushan.05@gmail.com

Thanks and Regards,
Bushan Sirgur