GUI - JavaFX

New JavaFX Application Project in IntelliJ with Java 11

One time per computer

• Download and unzip JavaFX 11 SDK gluonhq.com/products/javafx/

  • You can move the unzipped folder to your root drive or your OneDrive

• From Welcome screen...

  • Configure -> Structure for New Projects

    • Global Libraries + Java

    • Browse to and then expand the javafx-sdk/lib folder

    • Select all the jar files and only the jar files, OK

    • Change the name from javafx-swt to javafx11

One time per project

• Create New Project -> Java FX

• File -> Project Structure -> Global Libraries -> right click javafx11 -> Copy to Project Libraries, check box, OK, OK

  • Modules -> Dependencies -> + -> Library -> javafx11 (from project) -> Add Selected -> OK

• If necessary, right click src -> New -> module-info.java (probably not necessary on Windows and probably necessary on MacOS)

  • Add the following between the top module line and the bottom }

requires javafx.fxml;

requires javafx.controls;

opens sample;

This really should work. If not, restart your computer and try it again.

Basic Single File JavaFX Project in IntelliJ using Java 11 and Maven

• File -> New -> Project -> Maven (Project SDK should be 11) -> Next

• Give project a meaningful name, set location to ~\OneDrive - Florida Gulf Coast University\IDEA Projects\project-name

  • Optionally, set Artifact Coordinates -> GroupId to a reverse domain name, like io.github.username

• Finish

• Enable auto-import

• Expand project, expand src folder, expand main folder

• Right click java folder -> New JavaFXApplication -> File name: Main

• File -> Project Structure -> Modules -> Sources -> Language level: 11

• File -> Settings -> Build, Execution, Deployment -> Java Compiler -> Module -> 11

• Modify start method in Main:

@Override

public void start(Stage primaryStage) {

primaryStage.setTitle("Hello World!");

Button btn = new Button();

btn.setText("Say 'Hello World'");

btn.setOnAction(new EventHandler<ActionEvent>() {

@Override

public void handle(ActionEvent event) {

System.out.println("Hello World!");

}

});

StackPane root = new StackPane();

root.getChildren().add(btn);

primaryStage.setScene(new Scene(root, 300, 250));

primaryStage.show();

}

• Alt-Enter to import libraries

  • Never import anything from AWT

• Right click Main -> Run 'Main.main()'

FXML JavaFX Project in IntelliJ using Java 11 and Maven

• File -> New -> Project -> Maven (Project SDK should be 11) -> Next

  • Name project and double check Project location. Should be something like C:\Users\username\OneDrive - Florida Gulf Coast University\IDEA Projects\projectname

  • GroupId can be blank or a reverse domain name like io.github.username

  • ArtifactId should be project name

  • Version can be left unchanged (or delete SNAPSHOT)

• Finish

• Edit pom.xml

• click M to load Maven changes

• File -> Project Structure -> Modules -> Sources -> Language level: 11

• File -> Settings -> Build, Execution, Deployment -> Compiler -> Java Compiler -> Module -> 11

• Follow Common FXML Project Instructions

FXML JavaFX Project in IntelliJ using Java 11 and Gradle

• File -> Create New Project -> Gradle -> Java (Project SDK: 11) -> Next

• Name project and double check Project location. Should be something like C:\Users\username\OneDrive - Florida Gulf Coast University\IDEA Projects\projectname

  • GroupId can be blank or a reverse domain name like io.github.username

  • ArtifactId should be project name

  • Version can be left unchanged (or delete SNAPSHOT)

• Click Finish

• Edit build.gradle (info)

plugins {

id 'java'

id 'application'

id 'org.openjfx.javafxplugin' version '0.0.7'

}

sourceCompatibility = 11

javafx {

modules = [ 'javafx.controls' , 'javafx.fxml' ]

version = '11.0.2'

}

mainClassName = 'Main'

group 'io.github.username'

version '1.0'

repositories {

mavenCentral()

}

dependencies {

testCompile group: 'junit', name: 'junit', version: '4.12'

}

• Update username in group

• Click Elephant at top right of screen or Ctrl+Shift+O

• Follow Common FXML Project Instructions

• Run -> Edit Configurations -> Modify options -> Add VM options -> paste the text below replacing the PathToYourJavaFXSDK with the path to your JavaFX SDK. You can find this through Windows Explorer (the folder icon). (no C: and forward slashes on a Mac) image

--module-path "C:\PathToYourJavaFXSDK\lib" --add-modules javafx.controls,javafx.fxml,javafx.base,javafx.media,javafx.graphics,javafx.swing,javafx.web

Scene Builder

• SceneBuilder download

  • Getting Started with Scene Builder

    • Scene Builder Overview

    • Specify the path to the JavaFX Scene Builder executable

  • JavaFX Scene Builder: User Guide

• Integrating Scene Building in IntelliJ

  • Right click FXML file -> open in SceneBuilder

  • The first time it will ask you to locate scenebuilder.exe

    • In the classroom it is in C:\Program Files\SceneBuilder\SceneBuilder.exe

    • On your computer it might be in C:\Users\username\AppData\Local\SceneBuilder\scenebuilder.exe

      • You may need to type \AppData when navigating

    • If it's not in either of those places, hit the Windows key on the keyboard, find the Scene Builder program, right click, open file location, right click, open file location again, copy the address then paste it in IntelliJ.

• Oracle Tutorial Getting Started with JavaFX Scene Builder - VERY USEFUL

• TutorialsPoint JavaFX Tutorial

  • UI Controls

  • Layout GridPane

  • Layout Panes (Containers)

• View - Show Sample Controller Skeleton

  • copy - paste into Controller

• CSS in Scene Builder

JFoenix

For more (cool) controls, use JFoenix.

1. Download appropriate jar (like for Java 8) from https://github.com/jfoenixadmin/JFoenix

2. Open Scene Builder, click on gear icon in Library box, click JAR/FXML Manager, select downloaded jar file