プロジェクト

全般

プロフィール

Wiki » Java » JavaFX »

JavaFXで楽々アプリケーション開発

執筆中

はじめに

JavaFXライブラリは、GUIアプリケーションに必要となるビルディングブロックを提供しています。
しかし、プレハブ工法的な、特定のアプリケーションをさっと作るような半完成品的なものではありません。
自由度が高い分、学習する場合には難易度が上がります。
そこで、ビルディングブロックをどのように組み合わせるかを「見本」として用意し、見本に倣って組み立てることで学習の容易化をねらいます。

方針

JavaFXでGUIアプリケーションを作成するときの基本構造を押さえる。

基本構造とは、

  • Javaソースコード、FXML、CSS、リソースバンドルといったファイル構成要素
  • Model - View - Controllerといった役割による分割と連携、ここにはバインディングが含まれます
  • スレッドの扱い

あたりを想定しています。

JavaFXの極々シンプルなサンプルコードでは、説明対象の機能に限定したものになってしまいます。そこで、ある程度本格的な（それでも小規模な）プログラムを用意し、基本構造をちりばめ、どのように構成すればよいかを分かるようにしたいと思います。このJavaFXアプリケーション構成をパターンとして理解・把握することで、JavaFXアプリケーションを悩まずに作ることができる（楽ができる）、あとは作って動かして楽しむプログラミングに至ることを目指します。

サンプルコード

JavaFXの2Dと3Dが混在するプログラムを作ります。3D側は、地球の周囲にある人工衛星の軌道を表示します。2D側は、3D側の表示制御を行います。

ネタ

昨今のGUIプログラム開発技術

対象とするデバイスがPC系（デスクトップPC、ノートPC、大型のタブレット）とスマートデバイス系（7インチ未満のタブレット、スマートホン）で異なっています。
ここでは、PC系を想定しています。

  • 会場への質問
    • 「今持参しているPCのOSは何ですか？」
      想定回答は、Mac OS X、Windows、Linux が混在
    • 「では、これから会場の皆さんが持参しているPCで動くプログラムを作ることになったとします。どんな技術を使いますか？」
      C++とQt、Electron、

JavaFXの壁

JavaFXでGUIプログラムを作ろうとして直面する壁

  • Javaのコードで書くのか、FXMLを書くのか、CSSを書くのか、どうしたらいいかよくわからない
    • FXMLってXMLを書くのは大変そう、よくわからない、面倒くさそう
    • CSS使い方分からない（非Web系エンジニア）
    • CSSが変だ、-fxが付いてる、（Web系エンジニア）
  • クラス構成で何を作るのかよくわからない
    • MVCみたいな構造あるのかな
  • stageって何
  • sceneって何
  • シーングラフって何
  • レイアウトペインでどれを使えばいいのかな
  • SwingにあるLook and Feelのように全体の見栄えを変更することはできるかな
  • 文字列リソースを外部ファイルに定義して使うにはどうしたらいいのかな
  • 画面遷移の実装方法はどうすればいいのかな
  • java.awtパッケージなどに同じ名前のクラスがあって、import文自動生成時に間違えることがある
    • IDEの設定で、importする優先順を変えるなどできる？

JavaFX開発環境

Eclipse (Oxygen)

追加でプラグインを入れないと、JavaFXのプログラミングは次の点でほぼ不可です。

  • javafxで始まるパッケージに含まれるクラスをコーディングすると、アクセス制限違反としてコンパイルエラー扱いされる
    → 回避策あり
  • javafxのクラス名の補完が機能しない（クラス名を一部入れての補完が働かず、またimport文の自動生成不可）
    → 回避策なし

e(fx)clipseプラグインを入れることで、JavaFXのプログラミングが可能となります。

  • FXMLを使うプロジェクト雛形生成可（JavaFX ProjectとJavaFX Library Projectの2種類から選択）
    • Scene Builder連携可（左側ペインでfxmlファイルを右クリックし、Open with SceneBuilder実行）
    • パッケージ名指定可
    • FXMLファイル名の指定可
    • 対のコントローラークラス名指定可
    • CSSファイル（application.css）が自動生成、名前指定不可
    • アプリケーションクラスが自動生成、名前指定不可
    • リソースバンドル・プロパティファイルはソースファイルと同じ場所に置ける
    • 生成されるアプリケーションクラスは名前がMain固定になってる
    • 生成されるコントローラークラスはInitializableを実装していない
  • ビルドはEclipse独自機能
    • 新規プロジェクトでGradleプロジェクトを作成すると、JavaFXの雛形クラス等は生成されない
      ※ Eclipse Oxygenでは標準でGradleビルドのプラグイン（buildshipt）が組み込まれている
    • パッケージを作成後、新規作成でその他からJavaFXのクラスやFXMLを作成で生成する

Eclipse JavaFX開発環境

IntelliJ CommunityEdition 2017.2.2

JavaFXプロジェクト生成機能があります。プロジェクト種類は[JavaFX Application]一択しかありません。

  • SceneBuilderのデザイン画面がIntelliJ IDEAに統合されている
    FXMLをエディタに開くと、左下に[Text]と[Scene Builder]のタブがあり、[Scene Builder]タブをクリックするとエディタ部分がScene Builderのデザイン画面に切り替わる
    左側ペインでfxmlファイルを右クリックし、[Open in SceneBuilder]で、独立したScene Builderで開く
  • パッケージ名、クラス名、FXML名は指定不可（いったん生成してからリファクタリングで名前変更する）
  • 生成されるコントローラーはInitializableを実装していない

IntelliJ IDEA Community版のJavaFX開発

NetBeans IDE 8.2

AntとMavenでのJavaFXプロジェクト生成機能があります。
左側ペインでFXMLファイルをダブルクリックすると、Scene Builderで開く（Scene Builderのパスをオプションメニューから設定しておく）

ant

  • プロジェクト種類は、JavaFXアプリケーション、JavaFXプレローダー、JavaFX FXMLアプリケーション、JavaFX in Swingアプリケーションがあります。
  • パッケージ名、アプリケーションクラス名、FXMLファイル名を指定可能、コントローラー名はFXMLファイル名＋Controller
  • 生成されるコントローラークラスはInitializableを実装し、サンプルのLabelのインジェクション、ボタンクリック時のアクションメソッドの雛形実装を含む

maven

  • プロジェクト種類は、JavaFXアプリケーション一択
  • JavaソースファイルとFXML、CSSファイルが別ディレクトリ（Maven流儀）に配置
  • パッケージ名は指定可能、アプリケーションクラス名、コントローラークラス名、FXMLファイル名、CSSファイル名は指定不可
  • 生成されるコントローラークラスはInitializableを実装し、サンプルのLabelのインジェクション、ボタンクリック時のアクションメソッドの雛形実装を含む

NetBeans JavaFXアプリケーションのビルドをmavenで行う

参考資料

プレゼン資料

JavaOne 資料

2016 SFより

  • BOF2478 JavaFX Scenic View
  • CON1072 The Dark and Light Side of JavaFX
  • CON1379 JavaFX Tips and Tricks
  • CON2483 JavaFX 9 New and Noteworthy
  • CON2492 JavaFX Layouts
    座標変換の適用順序あり
  • CON2592 Creating JavaFX Applications with mvvmFX
  • HOL1634 Customize Your JavaFX Controls