Until you run Hello World of JavaFX with VS Code + Gradle

Introduction

Make a note of how to run JavaFX "for the time being" with VSCode + Gradle. It was made by copying the wisdom of our predecessors everywhere. Thank you to all our ancestors.

0. Environment

The tools and execution environment used are as follows.

• Linux Mint 19.3
• OpenJDK 11
• OpenJFX 11 (11.0.6)
• VSCode(code) 1.42.1
• Gradle 6.1.1

Also, since we will focus on the title part, we will omit the installation of individual tools.

1. Create a project in Gradle

Create a project directory and run gradle init (assuming you're in your path to the gradle command). It will be completed if you answer the options as follows.

ximia@thinkpad:~/dev/sandbox02$ gradle init

Select type of project to generate:
  1: basic
  2: application
  3: library
  4: Gradle plugin
Enter selection (default: basic) [1..4] 2

Select implementation language:
  1: C++
  2: Groovy
  3: Java
  4: Kotlin
  5: Swift
Enter selection (default: Java) [1..5] 3

Select build script DSL:
  1: Groovy
  2: Kotlin
Enter selection (default: Groovy) [1..2] 1

Select test framework:
  1: JUnit 4 VSCode
  2: TestNG
  3: Spock
  4: JUnit Jupiter
Enter selection (default: JUnit 4) [1..4] 1

Project name (default: sandbox02): 
Source package (default: sandbox02): me.osa2.java.sandbox02

> Task :init
Get more help with your project: https://docs.gradle.org/6.1.1/userguide/tutorial_java_projects.html

BUILD SUCCESSFUL in 42s
2 actionable tasks: 2 executed
ximia@thinkpad:~/dev/sandbox02$ 

2. Add tasks.json in VS Code

Add the sandbox02 directory created above to the VS Code workspace and then run the default build. However, VS Code does not know what to do and asks me to create a Config (see the figure below). Click "Configure Build Task ..." displayed in the center of the screen (If you have translated VS Code into Japanese, please translate it in your brain as appropriate).

Select Other from the options. Then tasks.json that just displays Hello will be created under the .vscode folder of the project. Copy and paste the following completely over there.

{
    "version": "1.0.0",
    "tasks": [
        {
            "label": "build",
            "type": "shell",
            "command": "./gradlew build"
        },
        {
            "label": "run",
            "type": "shell",
            "command": "./gradlew run",
            "group": {
                "kind": "build",
                "isDefault": true
            }
        },
        {
            "label": "clean",
            "type": "shell",
            "command": "./gradlew clean"
        },
        {
            "label": "check",
            "type": "shell",
            "command": "./gradlew check"
        },
        {
            "label": "create-jar",
            "type": "shell",
            "command": "./gradlew jar"
        }
    ]
}

After saving, select Terminal> Run Buld Task ... from the VS Code menu, the build will run slowly on the shell screen below, and "Hello World" in the console app that Gradle prepared at the time of init will be displayed. If you look at tasks.json, you can see that gradle run is the default for build tasks.

3. Replace with JavaFX code

It's very crude, but in VSCode, overwrite src / main / java / (package path) /App.java completely with the following code and rename the file to HelloWorld.java. Also, the test skeleton under src / test will also cause an error (because I will not write the test code here), so delete it.

package your.package.path;
 
import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;
 
public class HelloWorld extends Application {
    public static void main(String[] args) {
        launch(args);
    }
    
    @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();
    }
}

In addition, this code has been borrowed from the following page of Oracle in the world. https://docs.oracle.com/javafx/2/get_started/hello_world.htm

4. Pass the classpath for VSCode and Gradle respectively

First, replace build.gradle completely as follows and save it. Please rewrite the mainClassName according to your convenience. If you build (gradle run) up to this point, the JavaFX application will be launched. The image of the app is at the end.

/*
 * This file was generated by the Gradle 'init' task.
 *
 * This generated file contains a sample Java project to get you started.
 * For more details take a look at the Java Quickstart chapter in the Gradle
 * User Manual available at https://docs.gradle.org/6.1.1/userguide/tutorial_java_projects.html
 */

plugins {
    id 'java'
    id 'application'
    id 'eclipse' // for auto-completion enabled .classpath.
    id 'org.openjfx.javafxplugin' version '0.0.8'
}

repositories {
    jcenter()
}

javafx {
    version = "11"
    modules = [ 'javafx.controls']
}

dependencies {
    // This dependency is used by the application.
    implementation 'com.google.guava:guava:28.1-jre'

    // Use JUnit test framework
    testImplementation 'junit:junit:4.12'

    // Making Runnable Jar
    implementation "com.github.jengelman.gradle.plugins:shadow:5.1.0"
}

mainClassName = 'me.osa2.java.sandbox02.HelloWorld'

tasks.withType(JavaCompile) {
    options.encoding = "UTF-8"
}

jar {
        manifest {
        attributes ('Main-Class': mainClassName, "Implementation-Title": "Gradle",
                "Implementation-Version": 1)
    }
    from { configurations.compile.collect { it.isDirectory() ? it : zipTree(it) } }
    from configurations.compileClasspath.collect { it.isDirectory() ? it : zipTree(it) }
}

Next, create a launch.json file in the .vscode folder (the folder where tasks.json was created earlier), and paste the following as the contents. Please rewrite the main class name, package name, and openjfx lib path according to your convenience. Now when you restart VS Code, the red wave underline of the identifier that was unrecognizable on the source should disappear.

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "java",
            "name": "Debug (Launch) - Current File",
            "request": "launch",
            "mainClass": "${file}"
        },
        {
            "type": "java",
            "name": "Debug (Launch)-HelloWorld<sandbox02>",
            "request": "launch",
            "mainClass": "me.osa2.java.sandbox02.HelloWOrld",
            "projectName": "hello",
            "vmArgs": "--module-path /home/ximia/libs/javafx-sdk-11.0.2/lib --add-modules javafx.controls,javafx.fxml"
        }
    ]
}

5. Conclusion

It's a collection of other Qiita articles, and it's just "Marutto Copipe". Is it good for people who want to think about things after moving? I hope you get used to it! : grinning:

== END ==