コンテンツにスキップ

JavaFX

出典: フリー教科書『ウィキブックス(Wikibooks)』
Wikipedia
Wikipedia
ウィキペディアJavaFXの記事があります。

JavaFXは、Javaプラットフォーム向けのユーザーインターフェース(UI)およびグラフィカルユーザーインターフェース(GUI)ライブラリおよびソフトウェアフレームワークです。JavaFXは、豊富なビジュアルエクスペリエンスを提供し、デスクトップ、モバイル、および組み込みデバイス向けのアプリケーションを開発するために使用されます。

JavaFXは、Javaの標準ライブラリの一部として提供されており、Java Development Kit(JDK)に含まれています。JavaFXは、豊富なグラフィックス、アニメーション、メディア再生機能、および豊富なUIコントロールを提供し、開発者が魅力的で使いやすいアプリケーションを構築できるように支援します。

JavaFXは、Java言語で開発されており、FXMLというXMLベースの言語を使用してUIを記述することができます。また、CSS(Cascading Style Sheets)を使用してスタイルを定義することも可能です。

JavaFXは、Java Swingと比較してより現代的なアプローチを取っており、リッチなUIや洗練されたグラフィックスを実現するための機能を提供しています。

JavaFX

[編集]

JavaFXは、JavaでGUIアプリケーションを開発するためのツールキットです。JavaFXを使用すると、豊富なUIコントロール、グラフィックス、レイアウト、CSSスタイルシートなどを使用して、美しい、インタラクティブなデスクトップアプリケーションを作成できます。

JavaFXアプリケーションは、JavaFX Scene Graphと呼ばれるグラフィカルなオブジェクトツリーで構築されます。このScene Graphを構築するには、FXMLというXMLベースのマークアップ言語を使用することもできます。FXMLを使用すると、GUIのレイアウトとデザインを分離し、デザイナーとプログラマーが分業できます。

JavaFXには、JavaFXアプリケーションを構築するための豊富なAPIが用意されています。これには、UIコントロール(ラベル、ボタン、テキストボックスなど)、レイアウトマネージャー、アニメーション、トランジション、CSSスタイルシートなどが含まれます。また、FXMLを使用して、JavaコントローラクラスにUIコントロールをバインドし、ユーザーのアクションに応答するコードを記述できます。

JavaFXは、Java SE Development Kit(JDK)の一部であり、JavaFXを使用するためにはJDKをインストールする必要があります。また、JavaFXの最新バージョンは、OpenJFXプロジェクトとしてオープンソースで開発されており、多くのIDEがJavaFXプロジェクトをサポートしています。

FXML

[編集]

FXMLとは、JavaFXのUIを宣言的に記述するXMLベースのマークアップ言語です。 FXMLを使用することで、JavaFXのUIをより簡単に作成できます。

以下は、FXMLの例です。

sample.fxml
<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.layout.StackPane?>
<?import javafx.scene.text.Text?>

<StackPane prefHeight="200.0" prefWidth="250.0" xmlns="http://javafx.com/javafx/16" xmlns:fx="http://javafx.com/fxml/1" fx:controller="sample" fx:stylesheet="sample.css">
    <children>
        <Text text="Hello, JavaFX!" />
    </children>
</StackPane>

FXMLでは、UI要素を定義するためにXMLタグを使用し、その属性を使用してUI要素の属性を設定します。 FXMLファイルの最上位の要素はルート要素であり、この場合はStackPaneです。 StackPane要素のchildrenタグ内に、Text要素があり、そのtext属性にはテキストコンテンツが設定されます。

FXMLファイルは、JavaFXのアプリケーションクラスからロードされます。例えば、FXMLLoaderクラスを使用してロードできます。 以下は、FXMLを使用してJavaFXアプリケーションを初期化するためのコードの例です。

sample.java
import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Scene;
import javafx.stage.Stage;

public class sample extends Application {
    @Override
    public void start(Stage primaryStage) throws Exception {
        primaryStage.setTitle("ここはタイトル");
        primaryStage.setOnCloseRequest(e -> System.exit(0));

        FXMLLoader loader = new FXMLLoader(getClass().getResource("sample.fxml"));
        StackPane root = loader.load();
        Scene scene = new Scene(root, 250, 200);

        primaryStage.setScene(scene);
        primaryStage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}

FXMLを使用する場合、start()メソッド内でFXMLファイルをロードする必要があります。 FXMLLoaderクラスを使用して、FXMLファイルを読み込み、FXMLのルート要素を取得します。 これをJavaFXのSceneに追加し、Stageに表示することができます。

CSS

[編集]

JavaFXはCSSを使用して外観をスタイリングできます。CSSを使用すると、ボタン、ラベル、テキストフィールドなど、JavaFXの多くのUIコントロールの外観をカスタマイズできます。

sample.css
.root {
    -fx-background-color: #f2f2f2; /* ルートノードの背景色 */ 
}

.text { 
    -fx-font-size: 24pt; /* テキストのフォントサイズ ''/ 
    -fx-text-fill: #ff0000; /'' テキストの文字色 */ 
}
JavaFX/CSSの主なプロパティ
プロパティ名 説明
-fx-alignment コントロール内のコンテンツの配置位置を指定する
-fx-background-color コントロールの背景色を指定する
-fx-background-image コントロールの背景画像を指定する
-fx-background-insets コントロールの背景画像の余白を指定する
-fx-background-position コントロールの背景画像の位置を指定する
-fx-background-radius コントロールの背景画像の角丸のサイズを指定する
-fx-background-size コントロールの背景画像のサイズを指定する
-fx-border-color コントロールの枠線の色を指定する
-fx-border-insets コントロールの枠線の余白を指定する
-fx-border-radius コントロールの枠線の角丸のサイズを指定する
-fx-border-style コントロールの枠線のスタイルを指定する
-fx-border-width コントロールの枠線の太さを指定する
-fx-font コントロールのフォントを指定する
-fx-font-family コントロールのフォントファミリーを指定する
-fx-font-size コントロールのフォントサイズを指定する
-fx-font-style コントロールのフォントスタイルを指定する
-fx-font-weight コントロールのフォントの太さを指定する
-fx-text-alignment テキストの水平方向の配置位置を指定する
-fx-text-fill テキストの色を指定する
-fx-padding コントロールの内側の余白を指定する
-fx-opacity コントロールの不透明度を指定する
-fx-cursor マウスポインタの形状を指定する
-fx-effect コントロールに対して適用するエフェクトを指定する
-fx-focus-color フォーカスがあたったときの色を指定する
-fx-focus-traversable コントロールがフォーカスを受け取るかどうかを指定する
-fx-highlight-fill 選択範囲の背景色を指定する
-fx-highlight-text-fill 選択範囲内のテキストの色を指定する

AWT、Swing、JavaFXの特徴を比較

[編集]

以下は、AWT、Swing、およびJavaFXの特徴を比較する表です。

AWT、Swing、JavaFXの特徴を比較
特徴 AWT Swing JavaFX
コンポーネント ネイティブコンポーネントを使用 ルックアンドフィールの変更が可能 CSSを使用してスタイリング可能
ルックアンドフィール ネイティブOSのルックアンドフィール ネイティブOSのルックアンドフィール または、独自のルックアンドフィール 独自のルックアンドフィール
レンダリングエンジン ネイティブ Javaで実装された独自の描画エンジン Javaで実装された独自の描画エンジン
イベントモデル ネイティブ Javaで実装された独自のイベントモデル Javaで実装された独自のイベントモデル
レイアウトマネージャ プラットフォームに依存 Javaで実装された独自のレイアウトマネージャ Javaで実装された独自のレイアウトマネージャ
カスタマイズ性 限定的 高い 高い
機能拡張 オーバーヘッドが少ない 高い 高い
モバイルサポート 限定的 限定的 高い
非同期処理 サポートされていない サポートされていない サポートされている
グラフィックス機能 限定的 高い 高い
アニメーション 不十分 限定的 高い
動画・3Dサポート なし なし 組み込みでサポート
グラフィックス性能 低い 中程度 高い
ツールチップサポート なし あり あり
  • AWTは古典的なアプローチで、ネイティブOSの機能をそのまま利用しますが、機能やカスタマイズ性に制限があります。
  • SwingはAWTの欠点を克服し、より高度なカスタマイズ性や機能拡張を提供しますが、レンダリングやパフォーマンスに関しては劣ることがあります。
  • JavaFXはSwingと同様に多くのGUIコンポーネントを提供し、レスポンシブなレイアウト、アニメーション、3Dグラフィックス、FXMLといったモダンな特徴を持っています。

FXMLの代替技術

[編集]

FXMLは機能的には優れているのですが、XMLに基づいているので記述性と可読性に難があります。 このため、いくつかの代替技術が開発されています。

以下はいくつかの代替技術の例です。

  1. Kotlin DSL (Domain Specific Language): Kotlinは、Javaと互換性があり、JavaFXとの統合も簡単です。Kotlin DSLを使用してUIをプログラム的に構築することができます。Kotlin DSLは、JavaFXのAPIをより簡潔かつ直感的に使用することができます。この方法を選択すると、FXMLの代わりにUIをコードで構築することができます。
    import javafx.application.Application
    import javafx.scene.Scene
    import javafx.scene.control.Button
    import javafx.scene.layout.VBox
    import javafx.stage.Stage
    
    fun main() = launchApp {
        title = "KotlinFX Example"
        width = 300.0
        height = 200.0
    
        scene = scene {
            root = VBox {
                center = button("Click Me") {
                    onAction {
                        println("Button clicked!")
                    }
                }
            }
        }
    }
    </kotlin>
    # TornadoFX: TornadoFXは、Kotlinで構築されたJavaFX向けの軽量フレムワクです。TornadoFXは、Kotlinの特性を活かしてUIを宣言的に構築し、FXMLを回避することができます。また、TornadoFXは、リアクティブプログラミングのサポトやDI (Dependency Injection) の統合など、さまざまな機能を提供します。
    #:<syntaxhighlight lang=kotlin>
    import tornadofx.*
    
    class TornadoFXExample : App() {
        override fun start(stage: Stage) {
            stage {
                title = "TornadoFX Example"
                width = 300.0
                height = 200.0
    
                scene {
                    root = vbox {
                        button("Click Me") {
                            setOnAction {
                                println("Button clicked!")
                            }
                        }
                    }
                }
            }
        }
    }
    
    fun main() = launch<TornadoFXExample>()
    
  2. GroovyFX: GroovyFXは、JavaFXをGroovyスクリプトで利用するためのライブラリです。GroovyFXを使用すると、JavaFXのAPIをGroovyの柔軟性と表現力を利用して利用することができます。これにより、FXMLを使用せずにUIをプログラム的に構築することができます。
    @Grapes([
        @Grab('org.codehaus.groovyfx:groovyfx:0.6.0')
    ])
    import groovyx.javafx.GroovyFX
    
    def primaryStage = GroovyFX.start {
        title = "GroovyFX Example"
        width = 300
        height = 200
    
        vbox {
            button("Click me!") {
                setOnAction {
                    println("Button clicked!")
                }
            }
        }
    }
    

これらの代替技術は、FXMLを回避したり、UIの構築をよりプログラマブルにしたりするために使用することができます。KotlinやGroovyの柔軟性を活かしたUI開発を行いたい場合には、これらの代替技術が有用です。