JavaFX mordern Login Example - Scene builder and Netbeans

fxml

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

<?import com.jfoenix.controls.JFXButton?>

<?import com.jfoenix.controls.JFXCheckBox?>

<?import com.jfoenix.controls.JFXPasswordField?>

<?import com.jfoenix.controls.JFXTextField?>

<?import javafx.scene.control.Label?>

<?import javafx.scene.image.Image?>

<?import javafx.scene.image.ImageView?>

<?import javafx.scene.layout.AnchorPane?>

<?import javafx.scene.text.Font?>

<?import javafx.scene.text.Text?>

<AnchorPane id="AnchorPane" fx:id="root" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="631.0" prefWidth="1227.0" stylesheets="@style.css" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8.0.141" fx:controller="mordern.login.FXMLDocumentController">

   <children>

      <AnchorPane fx:id="sidepane" layoutX="528.0" layoutY="-1.0" prefHeight="631.0" prefWidth="474.0" styleClass="sidepane" stylesheets="@style.css" AnchorPane.bottomAnchor="1.0" AnchorPane.rightAnchor="-1.0" AnchorPane.topAnchor="-1.0">

         <children>

            <Text fill="#eeeded" layoutX="189.0" layoutY="99.0" strokeType="OUTSIDE" strokeWidth="0.0" text="Sign In">

               <font>

                  <Font name="Century Gothic Bold" size="29.0" />

               </font>

            </Text>

            <JFXTextField focusColor="#e8e8e8" layoutX="95.0" layoutY="230.0" maxWidth="280.0" minWidth="271.0" prefHeight="63.0" prefWidth="280.0" promptText="Username / E-Mail" unFocusColor="WHITE" />

            <JFXPasswordField focusColor="#f8f9fc" layoutX="95.0" layoutY="316.0" maxWidth="280.0" minWidth="268.0" prefHeight="63.0" prefWidth="280.0" promptText="Password" unFocusColor="WHITE" />

            <JFXCheckBox checkedColor="#266545" layoutX="95.0" layoutY="406.0" onContextMenuRequested="#btn_remember" text="Remember me" textFill="#fffdfd" unCheckedColor="WHITE" />

            <JFXButton layoutX="249.0" layoutY="442.0" onMouseClicked="#btn_login" prefHeight="45.0" prefWidth="113.0" styleClass="btn" text="LogIn" textFill="#e4e4e4">

               <font>

                  <Font size="15.0" />

               </font>

            </JFXButton>

            <JFXButton layoutX="427.0" layoutY="1.0" onMouseClicked="#btn_close" prefHeight="37.0" prefWidth="44.0" styleClass="btn" text="X" textFill="WHITE">

               <font>

                  <Font size="17.0" />

               </font>

            </JFXButton>

            <Label layoutX="95.0" layoutY="522.0" onMouseClicked="#forgetpassword" prefHeight="17.0" prefWidth="92.0" text="Forget password" textFill="#dad9d9" />

         </children>

      </AnchorPane>

      <ImageView fitHeight="516.0" fitWidth="474.0" layoutX="140.0" layoutY="224.0" opacity="0.13" pickOnBounds="true" preserveRatio="true">

         <image>

            <Image url="@../../images/background.png" />

         </image>

      </ImageView>

      <Text fill="#3c3939" layoutX="175.0" layoutY="268.0" strokeType="OUTSIDE" strokeWidth="0.0" text="Welcome to Material Ui Java">

         <font>

            <Font name="Century Gothic Bold" size="29.0" />

         </font>

      </Text>

      <Text fill="#3c3939" layoutX="175.0" layoutY="299.0" strokeType="OUTSIDE" strokeWidth="0.0" text="Anything you want to learn to follow my channel">

         <font>

            <Font name="Century Gothic" size="15.0" />

         </font>

      </Text>

      <Text fill="#3c3939" layoutX="175.0" layoutY="318.0" strokeType="OUTSIDE" strokeWidth="0.0" text="or E-Mail me.">

         <font>

            <Font name="Century Gothic" size="15.0" />

         </font>

      </Text>

      <JFXButton layoutX="291.0" layoutY="358.0" onMouseClicked="#btn_signup" prefHeight="45.0" prefWidth="148.0" styleClass="btn" text="SignUp" textFill="#e4e4e4">

         <font>

            <Font size="15.0" />

         </font>

      </JFXButton>

   </children>

</AnchorPane>

controller 

package mordern.login;

import java.net.URL;

import java.util.ResourceBundle;

import javafx.event.ActionEvent;

import javafx.fxml.FXML;

import javafx.fxml.Initializable;

import javafx.scene.control.Label;

import javafx.scene.input.ContextMenuEvent;

import javafx.scene.input.MouseEvent;

import javafx.scene.layout.AnchorPane;

/**

 *

 * @author Administrator

 */

public class FXMLDocumentController implements Initializable {

    

    private Label label;

    @FXML

    private AnchorPane root;

    @FXML

    private AnchorPane sidepane;

    

    private void handleButtonAction(ActionEvent event) {

       

    }

    

    @Override

    public void initialize(URL url, ResourceBundle rb) {

        // TODO

    }    

    @FXML

    private void forgetpassword(MouseEvent event) {

    }

    @FXML

    private void btn_remember(ContextMenuEvent event) {

    }

    @FXML

    private void btn_login(MouseEvent event) {

    }

    @FXML

    private void btn_close(MouseEvent event) {

        System.exit(0);

    }

    @FXML

    private void btn_signup(MouseEvent event) {

    }

    

}

loader

package mordern.login;

import javafx.application.Application;

import javafx.fxml.FXMLLoader;

import javafx.scene.Parent;

import javafx.scene.Scene;

import javafx.stage.Stage;

import javafx.stage.StageStyle;

public class MordernLogin extends Application {

    

    @Override

    public void start(Stage stage) throws Exception {

        Parent root = FXMLLoader.load(getClass().getResource("FXMLDocument.fxml"));

        stage.initStyle(StageStyle.UNDECORATED);

        Scene scene = new Scene(root);

        stage.setScene(scene);

   

        stage.show();

    }

    /**

     * @param args the command line arguments

     */

    public static void main(String[] args) {

        launch(args);

    }

    

}

css

.sidepane{

    -fx-background-color: #A73627;

}

.btn{

    -fx-background-color: #F1634F;

}

.root{

    -fx-background-color: floralwhite;

}