Adding JavaFx Scene Builder to Intellij idea Ide and Creating Sample Project

Adding JavaFx to Intellij idea Ide:
  1. Download the latest JavaFx Scene builder from Gluonhq and install it.
  2. The application can work standalone without Intellij idea but to use it inside Intellij idea the installation path must be added.
  3. Go to File -> Settings -> Languages & Frameworks -> JavaFx and add the installation path to it.
  4. javafx path example
    javafx path example

     

  5.  Also make sure JavaFx plugin is installed and enabled.
  6. select javafx in new projects menu
    select javafx in new projects menu and click next

     

  7. In the next window name your project
    In the next window name your project and click finish

     

  8. Now in the projects tab go to YourProjectName -> src -> sample there should be two Java Files Main, Controller and sample.fxml
  9. Click on the Scene builder tab in the bottom of the window
    Click on the Scene builder tab in the bottom of the window

     

  10. It should look like this
    It should look like this

     

  11. Now just drag a button from control section and run it
    Now just drag a button from control section and run it

     

     

Advertisements

Java Frame Change Button Colors Based on Even Odd Logic

Java Frame Change Button Colors Based on Even Odd Logic:

This code is continuation of this Java AWT BorderLayout Adding Label to Panel with Color.

Next up handling button press events and adding Sound to button clicks.


Sample:

GridLayout changing button colors
GridLayout changing button colors

 

Code:

import java.awt.*;
import java.awt.event.WindowAdapter;
import java.awt.event.WindowEvent;

/**
 * Created by asif on 8/13/2015.
 */
public class SimpleAwtGui {

    private static final int button_count = 10;

    // Declare a Frame type variable
    Frame frame;
    MenuBar menuBar;
    Menu fileMenu, optionsMenu, helpMenu;
    Panel panelUpperSection, panelLowerSection;
    Label labelButtonPressHeading, labelButtonPressed;

    // Create an array of Button type Objects
    Button [] button = new Button[button_count];

    public SimpleAwtGui() {
        // Create Frame Object and pass in the Frame Name / title
        frame = new Frame("AWT GUI EXAMPLE");

        // Create a panel object for organizing content
        panelUpperSection = new Panel();
        panelLowerSection = new Panel();

        // create Label
        labelButtonPressHeading = new Label();
        labelButtonPressed = new Label();

        // Use for loop to instantiate every button object
        for(int i = 0; i < button_count; ++i){
            button[i] = new Button( "" + i );

            // if i is odd then change the button color
            if(i % 2 == 1){
                button[i].setBackground(Color.BLACK);
                button[i].setForeground(Color.WHITE);
            }
        }

        // Create MenuBar Object
        menuBar = new MenuBar();

        // Create Menu objects to add to the MenuBar
        fileMenu = new Menu("File");
        optionsMenu = new Menu("Options");
        helpMenu = new Menu("Help");
    }

    public static void main(String[] args) {

        // Create an instance of SimpleAwtGui
        SimpleAwtGui window = new SimpleAwtGui();

        // call the showFrame() function to display the window
        window.showFrame();

    }

    // Not necessary but good practice all codes inside this can be written inside main
    public void showFrame() {
        // set the size of the window
        frame.setSize(400, 400);

        // set the layout for the window
        frame.setLayout(new GridLayout(2, 1));

        // Add panel to the frame
        frame.add(panelUpperSection);
        frame.add(panelLowerSection);

        // Set Layout for the panels
        panelUpperSection.setLayout(new BorderLayout());
        panelLowerSection.setLayout(new GridLayout());

        // Add Label to Panel
        panelUpperSection.add(labelButtonPressHeading, BorderLayout.NORTH);
        panelUpperSection.add(labelButtonPressed, BorderLayout.CENTER);

        labelButtonPressHeading.setBackground(Color.BLACK);
        labelButtonPressHeading.setText("Buttons clicked will be shown Below:");
        labelButtonPressHeading.setForeground(Color.WHITE);

        labelButtonPressed.setBackground(Color.darkGray);

        // Add all of the buttons to the layout
        for(int i = 0; i < button_count; ++i) {
            panelLowerSection.add(button[i]);
        }

        // Register window listener event to the frame without implementing WindowListener
        frame.addWindowListener(
                new WindowAdapter() {
                    public void windowClosing(WindowEvent e) {
                        System.exit(0);
                    }
                }
        );

        // Add Menu to the MenuBar
        menuBar.add(fileMenu);
        menuBar.add(optionsMenu);
        menuBar.add(helpMenu);

        /**
         * Add MenuItem to Menu
         */

        // Add items to File Menu
        fileMenu.add(new MenuItem("New"));
        fileMenu.add(new MenuItem("Open"));
        fileMenu.add(new MenuItem("Help"));

        // Add items to File Menu
        optionsMenu.add(new MenuItem("Options"));

        // Add items to File Menu
        helpMenu.add(new MenuItem("Help"));
        helpMenu.add(new MenuItem("About"));

        // Add MenuBar to the Frame
        frame.setMenuBar(menuBar);

        // set the frame visible otherwise nothing will be shown
        frame.setVisible(true);
    }
}

Java AWT BorderLayout Adding Label to Panel with Color

Java AWT BorderLayout Adding Label to Panel with Color:

This code is continuation of this tutorial Java AWT Adding Panels to Frame. Changes are highlighted below.

Next up handling button press events and adding Sound to button clicks.


AWT BorderLayout Adding Label to Panel with Color:

BorderLayout adding label to panel and changing color
BorderLayout adding label to panel and changing color

 

Code BorderLayout Adding Label to Panel with Color:

import java.awt.*;
import java.awt.event.WindowAdapter;
import java.awt.event.WindowEvent;

/**
 * Created by asif on 8/13/2015.
 */
public class SimpleAwtGui {

    private static final int button_count = 10;

    // Declare a Frame type variable
    Frame frame;
    MenuBar menuBar;
    Menu fileMenu, optionsMenu, helpMenu;
    Panel panelUpperSection, panelLowerSection;
    Label labelButtonPressHeading, labelButtonPressed;

    // Create an array of Button type Objects
    Button [] button = new Button[button_count];

    public SimpleAwtGui() {
        // Create Frame Object and pass in the Frame Name / title
        frame = new Frame("AWT GUI EXAMPLE");

        // Create a panel object for organizing content
        panelUpperSection = new Panel();
        panelLowerSection = new Panel();

        // create Label
        labelButtonPressHeading = new Label();
        labelButtonPressed = new Label();

        // Use for loop to instantiate every button object
        for(int i = 0; i < button_count; ++i){
            button[i] = new Button( "" + i );
        }

        // Create MenuBar Object
        menuBar = new MenuBar();

        // Create Menu objects to add to the MenuBar
        fileMenu = new Menu("File");
        optionsMenu = new Menu("Options");
        helpMenu = new Menu("Help");
    }

    public static void main(String[] args) {

        // Create an instance of SimpleAwtGui
        SimpleAwtGui window = new SimpleAwtGui();

        // call the showFrame() function to display the window
        window.showFrame();

    }

    // Not necessary but good practice all codes inside this can be written inside main
    public void showFrame() {
        // set the size of the window
        frame.setSize(400, 400);

        // set the layout for the window
        frame.setLayout(new GridLayout(2, 1));

        // Add panel to the frame
        frame.add(panelUpperSection);
        frame.add(panelLowerSection);

        // Set Layout for the panels
        panelUpperSection.setLayout(new BorderLayout());
        panelLowerSection.setLayout(new GridLayout());

        // Add Label to Panel
        panelUpperSection.add(labelButtonPressHeading, BorderLayout.NORTH);
        panelUpperSection.add(labelButtonPressed, BorderLayout.CENTER);

        labelButtonPressHeading.setBackground(Color.BLACK);
        labelButtonPressHeading.setText("Buttons clicked will be shown Below:");
        labelButtonPressHeading.setForeground(Color.WHITE);

        labelButtonPressed.setBackground(Color.darkGray);

        // Add all of the buttons to the layout
        for(int i = 0; i < button_count; ++i) {
            panelLowerSection.add(button[i]);
        }

        // Register window listener event to the frame without implementing WindowListener
        frame.addWindowListener(
                new WindowAdapter() {
                    public void windowClosing(WindowEvent e) {
                        System.exit(0);
                    }
                }
        );

        // Add Menu to the MenuBar
        menuBar.add(fileMenu);
        menuBar.add(optionsMenu);
        menuBar.add(helpMenu);

        /**
         * Add MenuItem to Menu
         */

        // Add items to File Menu
        fileMenu.add(new MenuItem("New"));
        fileMenu.add(new MenuItem("Open"));
        fileMenu.add(new MenuItem("Help"));

        // Add items to File Menu
        optionsMenu.add(new MenuItem("Options"));

        // Add items to File Menu
        helpMenu.add(new MenuItem("Help"));
        helpMenu.add(new MenuItem("About"));

        // Add MenuBar to the Frame
        frame.setMenuBar(menuBar);

        // set the frame visible otherwise nothing will be shown
        frame.setVisible(true);
    }
}

Java AWT Adding Panels to Frame

Java AWT Adding Panels to Frame:

This code is continuation of this tutorial to add MenuItem to Menu. Changes that need to be made from the last code is highlighted below.

Here, GridLayout(2,1) create 2 rows and 1 column in the frame. It is very useful for creating custom designs.


AWT Adding Panels to Frame:

Creating custom design with panels
Creating custom design with panels

 

Code AWT Adding Panels to Frame:

import java.awt.*;
import java.awt.event.WindowAdapter;
import java.awt.event.WindowEvent;

/**
 * Created by asif on 8/13/2015.
 */
public class SimpleAwtGui {

    private static final int button_count = 10;

    // Declare a Frame type variable
    Frame frame;
    MenuBar menuBar;
    Menu fileMenu, optionsMenu, helpMenu;
    Panel panelUpperSection, panelLowerSection;

    // Create an array of Button type Objects
    Button [] button = new Button[button_count];

    public SimpleAwtGui() {
        // Create Frame Object and pass in the Frame Name / title
        frame = new Frame("AWT GUI EXAMPLE");

        // Create a panel object for organizing content
        panelUpperSection = new Panel();
        panelLowerSection = new Panel();

        // Use for loop to instantiate every button object
        for(int i = 0; i < button_count; ++i){
            button[i] = new Button( "" + i );
        }

        // Create MenuBar Object
        menuBar = new MenuBar();

        // Create Menu objects to add to the MenuBar
        fileMenu = new Menu("File");
        optionsMenu = new Menu("Options");
        helpMenu = new Menu("Exit");
    }

    public static void main(String[] args) {

        // Create an instance of SimpleAwtGui
        SimpleAwtGui window = new SimpleAwtGui();

        // call the showFrame() function to display the window
        window.showFrame();

    }

    // Not necessary but good practice all codes inside this can be written inside main
    public void showFrame() {
        // set the size of the window
        frame.setSize(400, 400);

        // set the layout for the window
        frame.setLayout(new GridLayout(2, 1));

        // Add panel to the frame
        frame.add(panelUpperSection);
        frame.add(panelLowerSection);

        // Set Layout for the panels
        panelUpperSection.setLayout(new FlowLayout());
        panelLowerSection.setLayout(new GridLayout());

        // Add all of the buttons to the layout
        for(int i = 0; i < button_count; ++i) {
            panelLowerSection.add(button[i]);
        }

        // Register window listener event to the frame without implementing WindowListener
        frame.addWindowListener(
                new WindowAdapter() {
                    public void windowClosing(WindowEvent e) {
                        System.exit(0);
                    }
                }
        );

        // Add Menu to the MenuBar
        menuBar.add(fileMenu);
        menuBar.add(optionsMenu);
        menuBar.add(helpMenu);

        /**
         * Add MenuItem to Menu
         */

        // Add items to File Menu
        fileMenu.add(new MenuItem("New"));
        fileMenu.add(new MenuItem("Open"));
        fileMenu.add(new MenuItem("Exit"));

        // Add items to File Menu
        optionsMenu.add(new MenuItem("Options"));

        // Add items to File Menu
        helpMenu.add(new MenuItem("Help"));
        helpMenu.add(new MenuItem("About"));

        // Add MenuBar to the Frame
        frame.setMenuBar(menuBar);

        // set the frame visible otherwise nothing will be shown
        frame.setVisible(true);
    }
}

Java AWT Frame Adding MenuItem to Menu

Java AWT Frame Adding MenuItem to Menu:

This code is continuation of this tutorial to add Menu and MenuBar to AWT Frame. The changes from previous code is highlighted below. Create Menu objects and add MenuItem objects to them.


AWT Frame Adding MenuItem to Menu:

awt gui menu with menu items
awt gui menu with menu items

 

Code AWT Frame Adding MenuItem to Menu:

import java.awt.*;
import java.awt.event.*;

/**
 * Created by asif on 8/13/2015.
 */
public class SimpleAwtGui {

    private static final int button_count = 10;

    // Declare a Frame type variable
    Frame frame;
    MenuBar menuBar;
    Menu fileMenu, optionsMenu, helpMenu;

    // Create an array of Button type Objects
    Button [] button = new Button[button_count];

    public SimpleAwtGui() {
        // Create Frame Object and pass in the Frame Name / title
        frame = new Frame("AWT GUI EXAMPLE");

        // Use for loop to instantiate every button object
        for(int i = 0; i < button_count; ++i){
            button[i] = new Button( "" + i );
        }

        // Create MenuBar Object
        menuBar = new MenuBar();

        // Create Menu objects to add to the MenuBar
        fileMenu = new Menu("File");
        optionsMenu = new Menu("Options");
        helpMenu = new Menu("Exit");
    }

    public static void main(String[] args) {

        // Create an instance of SimpleAwtGui
        SimpleAwtGui window = new SimpleAwtGui();

        // call the showFrame() function to display the window
        window.showFrame();

    }

    // Not necessary but good practice all codes inside this can be written inside main
    public void showFrame() {
        // set the size of the window
        frame.setSize(400, 400);

        // set the layout for the window
        frame.setLayout(new GridLayout());

        // Add all of the buttons to the layout
        for(int i = 0; i < button_count; ++i) {
            frame.add(button[i]);
        }

        // Register window listener event to the frame without implementing WindowListener
        frame.addWindowListener(
                new WindowAdapter() {
                    public void windowClosing(WindowEvent e) {
                        System.exit(0);
                    }
                }
        );

        // Add Menu to the MenuBar
        menuBar.add(fileMenu);
        menuBar.add(optionsMenu);
        menuBar.add(helpMenu);

        /**
         * Add MenuItem to Menu
         */

        // Add items to File Menu
        fileMenu.add(new MenuItem("New"));
        fileMenu.add(new MenuItem("Open"));
        fileMenu.add(new MenuItem("Exit"));

        // Add items to File Menu
        optionsMenu.add(new MenuItem("Options"));

        // Add items to File Menu
        helpMenu.add(new MenuItem("Help"));
        helpMenu.add(new MenuItem("About"));

        // Add MenuBar to the Frame
        frame.setMenuBar(menuBar);

        // set the frame visible otherwise nothing will be shown
        frame.setVisible(true);
    }
}

Java AWT Adding MenuBar, Menu to GUI Window

Java AWT Adding MenuBar, Menu to GUI Window:

This code is continuation of this tutorial Java AWT Creating Piano Buttons with Grid Layout.

First of all none of the buttons will work because i haven’t added any event listeners and handlers. Also menu items are not added yet.


GridLayout Adding MenuBar, Menu:

awt adding menubar menu to window
awt adding menubar menu to window

 

Code AWT GridLayout Adding MenuBar, Menu:

import java.awt.*;
import java.awt.event.*;

/**
 * Created by asif on 8/13/2015.
 */
public class SimpleAwtGui {

    private static final int button_count = 10;

    // Declare a Frame type variable
    Frame frame;
    MenuBar menuBar;
    Menu fileMenu, optionsMenu, exitMenu;

    // Create an array of Button type Objects
    Button [] button = new Button[button_count];

    public SimpleAwtGui() {
        // Create Frame Object and pass in the Frame Name / title
        frame = new Frame("AWT GUI EXAMPLE");

        // Use for loop to instantiate every button object
        for(int i = 0; i < button_count; ++i){
            button[i] = new Button( "" + i );
        }

        // Create MenuBar Object
        menuBar = new MenuBar();

        // Create Menu objects to add to the MenuBar
        fileMenu = new Menu("File");
        optionsMenu = new Menu("Options");
        exitMenu = new Menu("Exit");
    }

    public static void main(String[] args) {

        // Create an instance of SimpleAwtGui
        SimpleAwtGui window = new SimpleAwtGui();

        // call the showFrame() function to display the window
        window.showFrame();

    }

    // Not necessary but good practice all codes inside this can be written inside main
    public void showFrame() {
        // set the size of the window
        frame.setSize(400, 400);

        // set the layout for the window
        frame.setLayout(new GridLayout());

        // Add all of the buttons to the layout
        for(int i = 0; i < button_count; ++i) {
            frame.add(button[i]);
        }

        // Register window listener event to the frame without implementing WindowListener
        frame.addWindowListener(
                new WindowAdapter() {
                    public void windowClosing(WindowEvent e) {
                        System.exit(0);
                    }
                }
        );

        // Add Menu to the MenuBar
        menuBar.add(fileMenu);
        menuBar.add(optionsMenu);
        menuBar.add(exitMenu);

        // Add MenuBar to the Frame
        frame.setMenuBar(menuBar);

        // set the frame visible otherwise nothing will be shown
        frame.setVisible(true);
    }
}

Java AWT Creating Piano Buttons with Grid Layout

Java AWT Creating Piano Buttons with Grid Layout:

This code is continuation of this tutorial Java AWT Changing Button Size in Flow Layout.  Just delete line 24 in the previous code and change line 45 to GridLayout in that code.


GridLayout Piano Type Buttons:

creating piano type button with awt grid layout
creating piano type button with awt grid layout

 

Code AWT GridLayout Piano Type Buttons:

import java.awt.*;
import java.awt.event.*;

/**
 * Created by asif on 8/13/2015.
 */
public class SimpleAwtGui {

    private static final int button_count = 10;

    // Declare a Frame type variable
    Frame frame;

    // Create an array of Button type Objects
    Button [] button = new Button[button_count];

    public SimpleAwtGui() {
        // Create Frame Object and pass in the Frame Name / title
        frame = new Frame("AWT GUI EXAMPLE");

        // Use for loop to instantiate every button object
        for(int i = 0; i < button_count; ++i){
            button[i] = new Button( "" + i );
        }

    }

    public static void main(String[] args) {

        // Create an instance of SimpleAwtGui
        SimpleAwtGui window = new SimpleAwtGui();

        // call the showFrame() function to display the window
        window.showFrame();

    }

    // Not necessary but good practice all codes inside this can be written inside main
    public void showFrame() {
        // set the size of the window
        frame.setSize(400, 400);

        // set the layout for the window
        frame.setLayout(new GridLayout());

        // Add all of the buttons to the layout
        for(int i = 0; i < button_count; ++i) {
            frame.add(button[i]);
        }

        // Register window listener event to the frame without implementing WindowListener
        frame.addWindowListener(
                new WindowAdapter() {
                    public void windowClosing(WindowEvent e) {
                        System.exit(0);
                    }
                }
        );

        // set the frame visible otherwise nothing will be shown
        frame.setVisible(true);
    }
}

Java AWT Changing Button Size in Flow Layout

Java AWT Changing Button Size in Flow Layout:

This code is continuation of this tutorial JAVA AWT ADD MULTIPLE BUTTONS TO FLOWLAYOUT WITHFOR LOOP.


FlowLayout Changing Button Size:

for loop flowlayout button size change
for loop flowlayout button size change

 

Code FlowLayout Change Button Size:

import java.awt.*;
import java.awt.event.*;

/**
 * Created by asif on 8/13/2015.
 */
public class SimpleAwtGui {

    private static final int button_count = 10;

    // Declare a Frame type variable
    Frame frame;

    // Create an array of Button type Objects
    Button [] button = new Button[button_count];

    public SimpleAwtGui() {
        // Create Frame Object and pass in the Frame Name / title
        frame = new Frame("AWT GUI EXAMPLE");

        // Use for loop to instantiate every button object
        for(int i = 0; i < button_count; ++i){
            button[i] = new Button( "" + i );
            button[i].setSize(50, 50);
        }

    }

    public static void main(String[] args) {

        // Create an instance of SimpleAwtGui
        SimpleAwtGui window = new SimpleAwtGui();

        // call the showFrame() function to display the window
        window.showFrame();

    }

    // Not necessary but good practice all codes inside this can be written inside main
    public void showFrame() {
        // set the size of the window
        frame.setSize(400, 400);

        // set the layout for the window
        frame.setLayout(new FlowLayout());

        // Add all of the buttons to the layout
        for(int i = 0; i < button_count; ++i) {
            frame.add(button[i]);
        }

        // Register window listener event to the frame without implementing WindowListener
        frame.addWindowListener(
                new WindowAdapter() {
                    public void windowClosing(WindowEvent e) {
                        System.exit(0);
                    }
                }
        );

        // set the frame visible otherwise nothing will be shown
        frame.setVisible(true);
    }
}

Java AWT Add Multiple Buttons to FlowLayout with For Loop

Java Add Multiple Buttons to FlowLayout with For Loop:

This code is continuation of this tutorial adding button and window closing event tutorial. Just create an array of Button type objects then using for loop instantiate all buttons. Finally using for loop add all of the buttons to the window.


FlowLayout For Loop Button adding to AWT Window:

for loop flowlayout button adding to awt frame window
for loop flowlayout button adding to awt frame window

 

Code FlowLayout For Loop Button adding:

import java.awt.*;
import java.awt.event.*;

/**
 * Created by asif on 8/13/2015.
 */
public class SimpleAwtGui {

    private static final int button_count = 10;

    // Declare a Frame type variable
    Frame frame;

    // Create an array of Button type Objects
    Button [] button = new Button[button_count];

    public SimpleAwtGui() {
        // Create Frame Object and pass in the Frame Name / title
        frame = new Frame("AWT GUI EXAMPLE");

        // Use for loop to instantiate every button object
        for(int i = 0; i < button_count; ++i){
            button[i] = new Button("Button: " + i );
        }

    }

    public static void main(String[] args) {

        // Create an instance of SimpleAwtGui
        SimpleAwtGui window = new SimpleAwtGui();

        // call the showFrame() function to display the window
        window.showFrame();

    }

    // Not necessary but good practice all codes inside this can be written inside main
    public void showFrame() {
        // set the size of the window
        frame.setSize(400, 400);

        // set the layout for the window
        frame.setLayout(new FlowLayout());

        // Add all of the buttons to the layout
        for(int i = 0; i < button_count; ++i) {
            frame.add(button[i]);
        }

        // Register window listener event to the frame without implementing WindowListener
        frame.addWindowListener(
                new WindowAdapter() {
                    public void windowClosing(WindowEvent e) {
                        System.exit(0);
                    }
                }
        );

        // set the frame visible otherwise nothing will be shown
        frame.setVisible(true);
    }
}

Java Closing AWT Window without Implementing WindowListener

Closing AWT Window without Implementing WindowListener:

This code is extension or continuation of this code adding button to AWT window. Why do this? Shorter code, no need implement unnecessary methods.

Register window listener to the frame and pass in WindowAdapter Object as shown below. Here we just implement windowClosing method but if we need others we could also add them inside WindowAdapter.

Code AWT GUI window Closing without WindowListener Implementation:

import java.awt.*;
import java.awt.event.*;

/**
 * Created by asif on 8/13/2015.
 */
public class SimpleAwtGui {

    // Declare a Frame type variable
    Frame frame;
    Button button;

    public SimpleAwtGui() {
        // Create Frame Object and pass in the Frame Name / title
        frame = new Frame("AWT GUI EXAMPLE");
        button = new Button("I am here Click Me");
    }

    public static void main(String[] args) {

        // Create an instance of SimpleAwtGui
        SimpleAwtGui window = new SimpleAwtGui();

        // call the showFrame() function to display the window
        window.showFrame();

    }

    // Not necessary but good practice all codes inside this can be written inside main
    public void showFrame() {
        // set the size of the window
        frame.setSize(400, 400);

        // set the layout for the window
        frame.setLayout(new FlowLayout());

        // Add the button component to frame otherwise button won't show
        frame.add(button);

        // Register window listener event to the frame without implementing WindowListener
        frame.addWindowListener(
                new WindowAdapter() {
                    public void windowClosing(WindowEvent e) {
                        System.exit(0);
                    }
                }
        );

        // set the frame visible otherwise nothing will be shown
        frame.setVisible(true);
    }
}