今回から主要なIDEでJavaFXの環境を整えて、サンプルを作るというところまでを解説していきます。主要なIDEというのは以下の3種類です。
はじめがNetBeansなのは、単に私が使い慣れているからです。
どれもJDKとIDEがインストールされているという前提で説明します。Liberica JDKやZuleFXなどのJavaFXを含んだJDKを使う場合でも、JDKに含まれているJavaFXは使わずに一般のライブラリとして話を進めます。
なお、OpenJFX SDKは必要ありません！
MavenやGradleを使えば、Mavenのセントラルレポジトリから自動的にJavaFXをダウンロードするので、OpenJFX SDKをインストールする必要はないのです。
JavaFXのアプリケーションを作るには、それが一番手っ取り早いはずです。
NetBeans + Maven
NetBeansはもともとAntを使ってビルドや実行を行っていましたが、NetBeans 10.0からはAntよりもMavenやGradleの方に重きがかかっているようです。というのも、新規プロジェクトを作る場合、Mavenプロジェクトが先頭、Gradleが次、3番目になってやっとAntが登場しているからです。
今回使用したのはOracle JDK 12.0.2と、NetBeans 11.0です。JDKはOracle OpenJDK以外のものでもかまいませんし、Java 12でなくてもJava 11でもOKです。
プロジェクト作成
はじめに行うのがプロジェクトの作成です。メニューバーの[File]-[New Project...]でプロジェクト作成のダイアログが表示されます。
もしくは左側ペインの[Projects]タブで右クリックして、ポップアップの[New Project...]でもOKです。
すると、プロジェクト作成が表示されます。
ここでは、Mavenを使うので、左側の[Categories]の[Java with Maven]を選択します。すると、右側にはプロジェクトの種類が表示されるので、この中から[Project from Archetype]を選びます。
注意
ここで[JavaFX Application]を選んではダメです！！
この[JavaFX Application]で作成するプロジェクトはJavaFX 8用なので、Java 11以降では使えません！！
MavenのArchetypeは、プロジェクトのひな型のようなものです。MavenのCentral RepositryにはいろいろなArchetypeが登録されていますが、JavaFXのArachetypeもあるのです。
[Project from Archetype]を選択したら、[Next]で次に進みましょう。
次画面では、Archetypeを選択します。とはいうものの、Archetypeはいっぱいあるので、上部にある[Search]フィールドでArchetypeのフィルタリングをします。
JavaFXのArchetypeはGroup IDがorg.openjfxなので、[Search]フィールドに"org.openjfx"、もしくは"openjfx"などを入力してみます。"javafx"だとJavaFX 8以前のArchetypeも表示されてしまうので、"openjfx"の方がよいです。
下の図では、"openjfx"でフィルタリングしたところです。
すると、[Known Archetypes]に、以下の2つのArchetypeが表示されます。
1つ目のjavafx-archetype-fxmlはFXMLを使用したJavaFXアプリケーション、2つ目のjavafx-archetype-simpleはFXMLを使用しないJavaFXアプリケーションになります。
まずは、FXMLを使用しないjavafx-archetype-simpleでやってみましょう。javafx-archetype-simpleを選択して、[Next]で先に進みます。
すると、プロジェクト名などを入力する画面に遷移します。
プロジェクト名やプロジェクトの場所などは、適当につけておいてください。ここではsimplefxdemoというプロジェクトにしました。
ダイアログの下の方の[Additional Creation Properties]でライブラリとプラグインのバージョンを設定することができます。2019年7月段階でのデフォルトではJavaFXが11.0.2、JavaFX Maven Pluginが0.0.1になっています。これらのバージョンは、プロジェクト作成してからでも変更できるので、今はこのままにしておきましょう。
設定ができたら、[Finish]でプロジェクトが作成されます。
プロジェクトの構成は以下のようになりました。
module-info.javaが存在していることから分かるように、このアプリケーションはモジュールになっています。でも、モジュールにしたくないのであれば、module-info.javaを削除すればOKです。
そして、Mavenのビルドファイルであるpom.xmlは次のようになっています。
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd"> <modelVersion>4.0.0</modelVersion> <groupId>net.javainthebox</groupId> <artifactId>simplefxdemo</artifactId> <version>1.0-SNAPSHOT</version> <properties> <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding> <maven.compiler.source>11</maven.compiler.source> <maven.compiler.target>11</maven.compiler.target> </properties> <dependencies> <dependency> <groupId>org.openjfx</groupId> <artifactId>javafx-controls</artifactId> <version>11.0.2</version> </dependency> </dependencies> <build> <plugins> <plugin> <groupId>org.apache.maven.plugins</groupId> <artifactId>maven-compiler-plugin</artifactId> <version>3.8.0</version> <configuration> <release>11</release> </configuration> </plugin> <plugin> <groupId>org.openjfx</groupId> <artifactId>javafx-maven-plugin</artifactId> <version>0.0.1</version> <configuration> <mainClass>net.javainthebox.simplefxdemo.App</mainClass> </configuration> </plugin> </plugins> </build> </project>
使用するライブラリ(依存性のあるライブラリ)は
これは、javafx-controlsが依存しているライブラリも、プロジェクトのDependenciesに表示されるからです。
Mavenのプラグインは
なお、2019年7月での最新は、JavaFXが12.0.1、JavaFX Maven Pluginが0.0.2です。必要に応じて、pom.xmlのバージョン記述をあげておいた方がいいと思います。
プロジェクトの実行
このプロジェクトはそのままでも実行できるので、実行してみましょう。
とはいうものの、NetBeansのメニューバーの[Run]-[Run Project]では、すぐには実行できません。単に[Run Project]ではJavaFXのお約束のモジュール指定などを行わないからです。
それらを行うためにJavaFX Maven Pluginがあるのです。JavaFX Maven Pluginでアプリケーションを実行するには、Mavenのゴールとしてjavafx:runを使用します。
NetBeansでMavenのゴールを直接指定するには、プロジェクトを右クリックして表示されたポップアップメニューから、[Run Maven]-[Goals...]を選択します。
すると、ゴールを指定するダイアログが表示されるので、[Goals]の欄に"javafx:run”を入力します。
[OK]でゴールを実行します。すると、下の図のようなウィンドウが表示されるはずです。
もう、JavaFXのアプリケーションが実行できてしまいました。とはいうものの、毎回ゴールを指定するのもめんどうです。
そこで、NetBeansですぐに実行できるように設定してみましょう。
MavenのゴールとNetBeansのアクションを結びつけるという設定を行うのですが、それにはプロジェクトのプロパティから行います。
プロジェクトを右クリックして表示されたポップアップメニューの一番下に[Properties]があるので、それを選択します。
すると、設定用のダイアログが表示されます。
ダイアログの左側の[Categories]から[Actions]を選択すると、右側にアクションの一覧が表示されます。この中で、[Run project]を選択します。
[Execute Goals]に表記されている内容が、[Run project]に割り当てられているゴールです。
デフォルトではExec Maven Pluginのexecが使われていることが分かります。この部分をJavaFX Maven Pluginのjavafx:runに変更します。また、[Set Properties]に記載されているプロパティは必要ないので、削除します。
[OK]で設定完了です。
では、プロジェクトの右クリックで、ポップアップメニューの[Run]を実行してみましょう。もしくは、メニューバーの[Run] - [Run Project]、あるいはファンクションキーのF6でも実行できます。
正しく設定ができていれば、上述したウィンドウが表示されるはずです。
この設定を行うと、プロジェクトのpom.xmlと同じ場所にnbactions.xmlというファイルが作成されます。このファイルに、ここで行った設定が記述されます。
<?xml version="1.0" encoding="UTF-8"?> <actions> <action> <actionName>run</actionName> <packagings> <packaging>jar</packaging> </packagings> <goals> <goal>javafx:run</goal> </goals> </action> </actions>
なお、javafx:runだけではビルドが必須ではないので、毎回ビルドをし直すのであればclean javafx:runのように記述してビルドを強制させるようにします。
後は、このプログラムをベースに拡張を行っていけばOKです。ただ、GUI部品が増えてくるとコードがとても見にくくなってきます。そこで、使うのが次節で扱うFXMLです。
FXMLプロジェクト作成
FXMLはXMLでGUIの画面構成を記述するファイルです。FXMLはペアとなるJavaファイルが存在し、通常コントローラークラスと呼ばれます。コントローラークラスにはGUI部品で発生したイベントの処理を記述します。
FXMLには画面構成を記述しますが、それと一緒にGUI部品をコントローラクラスで扱うためのIDや、イベント発生時にコールするコントローラクラスのメソッドも記述します。
では、FXMLを使用したプロジェクトを作成していきましょう。
FXMLを使ったプロジェクトも、Mavenのarchetypeで作っていきます。
プロジェクト作成の手順はarchetypeを選択するまでは、先ほどと同じです。先ほどはarchetypeにjavafx-archetype-simpleを選択しましたが、FXMLを使う場合はjavafx-archetype-fxmlを選択します。
プロジェクト名の入力画面は先ほどの例と同じですね。ここでは、simplefxmldemoというプロジェクト名にしました。
プロジェクトの構成は以下のようになっています。
先ほどのサンプルと同じようにAppクラスがメインのクラスです。その他に2つのクラスが存在していますが、クラス名にControllerが含まれることから分かるように、コントローラークラスになります。
FXMLはリソースの方に分類されています。ここでは2つのFXMLファイルが存在しています。
primary.fxmlファイルとPrimaryControllerクラス、secondary.fxmlファイルとSecondaryControllerクラスがペアになっています。
このサンプルもそのままで実行できるので、実行してみましょう。実行のための設定は、先ほどのサンプルと同じです。
実行するとボタンが1つのステージが表示されます。このボタンをクリックすると、2番目の画面に切り替わります。2番目の画面のボタンをクリックすると、再び1番目の画面に遷移します。
Scene Builder
このアプリケーションを改造していく、もしくは新たにFXMLを作成するような場合、FXMLをグラフィカルに編集できるツールがほしいところです。この用途に使えるツールとしてScene Builderがあります。
Scene Builderはオープンソースで開発されていますが、Gluonがバイナリを配布しているので、それを使うのが手っ取り早いです。なお、Oracleで配布しているScene Builderは古いバージョンで、JavaFX 2の頃のものです。JavaFX 8を使う場合でも、Gluonからダウンロードできるバイナリを使用してください。
Scene BuilderはインストーラもしくはRPMなどのパッケージが配布されているので、それにしたがってインストールしてみてください。
ただ、Windows版は日本語環境だと文字化けを起こすので、今のところ英語で使うしかないです。
Scene Builderをインストールしたディレクトリの直下にあるappディレクトリにSceneBuilder.cfgというファイルがあります。このファイルを開くと[JVMOptions]という項目があるはずです。
この項目には--add-opensが記載されていますが、これに加えて-Duser.language=enを記述します。
[JVMOptions] -Duser.language=en --add-opens javafx.fxml/javafx.fxml=ALL-UNNAMED
これで、Scene Builderは英語表記になります。
このバグ、日本語のプロパティファイルが壊れているせいで、エラーの報告もされているんですけど、直らないんですよね...
次に、NetBeansからScene Builderを呼び出せるように設定します。
まず、メニューバーの[Tools]-[Options]を選択します。
すると、オプション設定のダイアログが開きます。
上段のカテゴリーの中から[Java]を選択し、タブの中から[JavaFX]を選択します。はじめて[JavaFX]を選択すると、JavaFXをアクティベートしてから上記のように表示されます。デフォルトでは[Scene Builder Home]の欄は空白になっているので、SceneBuilderをインストールしたディレクトリを指定します。
その下の[Save All Modified Files Before Running Scene Builder]はチェックしてもしなくてもOKです。チェックしておいた方が間違いは少ないとは思います。
これで、NetBeansでFXMLをダブルクリック、もしくは右クリックしてポップアップメニューの[Open]を選択すると、Scene Builderが起動し、指定したFXMLファイルをオープンします。
たとえば、primary.fxmlをダブルクリックすると、以下のような画面になります。もし、Scene Builderが起動しない場合は、NetBeansを再起動してみてください。
ちなみに、FXMLをNetBeansで開きたいときは、FXMLを右クリックして、ポップアップメニューの[Edit]を選択します。
これで、グラフィカルにFXMLを変数する用意ができました。あとは、このサンプルをベースに改良するか、新たに作成していくかして、アプリケーションを作っていけるはずです。
まとめ
NetBeansとMavenを使ったJavaFXの開発環境を整える方法を紹介しました。簡単にまとめると
- JavaFXのArchetypeを使えば、JavaFXアプリケーションのひな型は簡単に作成できる
- コンパイル、実行などはNetBeansから行うが、多少の設定は必要
- FXMLの編集にはScene Builderを使用し、NetBeansから使えるようにしておくと便利
今回は、環境構築とアプリケーションのひな型を作るだけでした。次回は、今回の続きで、実際にひな型を拡張してアプリケーションを作る説明をしていきます。
追記
このエントリーを公開した前日にNetBeans 11.1がリリースされました！
JavaFXに関しては大きな変更はないのですが、サンプルの中にOpenJFXが追加されました。このサンプルを使用すれば、上記のMavenのプロジェクトをarchetypeを使わずに作成することができます。
また、nbactions.xmlも含まれているので、javafx:runをゴールに指定する必要もありません。
OpenJFXのプロジェクトを作成するには、[New Project...]で表示されるダイアログの中から、カテゴリーを[Samples]-[OpenJFX]にします。
[Samples]の中には[JavaFX]もありますが、こちらはJavaFX 8とJava SE 8の組み合わせなので、Java 11以降では使用できません。
[HelloFXWithMaven]か[HelloFXMLWithMaven]を選択して、[Next]で、プロジェクト名などの入力画面に切り替わります。デフォルトだとプロジェクト名がHelloFXWithMavenもしくはHelloFXMLWithMavenになっているので、必要におうじて変更してください。
後は、Mavenのarchetypeを使って作成したプロジェクトと同じです。前述したようにnbactions.xmlはすでに設定してあるので、実行もすぐにできるはずです！
