JavaFX の Pane, Scene, Stage の関係

ここまで最小限度の JavaFX プログラムとしてプログラムを作りましたが、実際のところ何もしないプログラムでした。少しずつ文字を表示したりしていきましょう。

ここでは次のように画面に文字を表示するプログラムを作ります。

文字を表示しているだけではありますが、画面に色をつけたり、文字のフォントや大きさを設定したり、文字を画面の中央に表示したりしています。

はじめに、ソースコードをみてください。

package com.keicode.java.testapps;

import javafx.application.Application;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.layout.FlowPane;
import javafx.scene.text.Font;
import javafx.scene.text.Text;
import javafx.stage.Stage;

public class App1 extends Application {

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

	@Override
	public void start(Stage primaryStage) throws Exception {
		Text text = new Text();
		text.setText("Hello, world!");
		text.setFont(Font.font("Serif", 32));

		FlowPane pane = new FlowPane();
		pane.setStyle("-fx-background-color: #b2dfdb;");
		pane.setAlignment(Pos.CENTER);
		pane.getChildren().add(text);

		Scene scene = new Scene(pane, 300, 150);
		primaryStage.setScene(scene);

		primaryStage.setTitle("JavaFX App1");
		primaryStage.show();
	}
}

順番にみていきましょう。

「JavaFX アプリケーションの基本メソッドとスレッド」で説明した通り、 JavaFX のプログラムは javafx.application.Application の派生クラスとして作成します。

そして、main メソッドで launch を呼ぶことで JavaFX が開始して、 start メソッドがコールバックされます。このとき引数として Stage のインスタンスを受け取ります。

さて、start メソッド内では、"Hello, world" という文字を表示するためのラベルとなる Text オブジェクトを作成しています。

Text オブジェクトの setText メソッドで表示する文字を設定し、また、setFont メソッドでフォントをセットしています。

次に FlowPane オブジェクトを作成しています。

Pane は複数のコンポーネントの相対的な位置を指定するのに使われます。ここでは Pane の一種である、 FlowPane を利用しています。

FlowPane は子要素を、文字を書くときのように順番に配置して、FlowPane の幅で折り返したりします。

次に Pane を表示するための Scene を作成します。

最後に Stage に Scene を設定することで画面にコンポーネントが表示されます。

Stage は Scene を表示するウィンドウを表しています。

Pane, Scene, Stage をまとめると

繰り返しになりますが、念のためまとめておきます。

UI コンポーネントを並べるために Pane を使います。そして Pane を表示するために Scene を使い、Scene をウィンドウに表示するために Stage に設定します。