JavaFXのHello Worldを試してみました

Javaプロジェクトの作成

• Eclipseを起動してNew→Java Projectでプロジェクトを作成。

• プロジェクト名を入力: MyJavaFX
• Use Default JREを選択
• Finishボタンでプロジェクトを作成

クラスの作成

• New → Classでクラスを作成
• packageにユニークキーを入力(ドメイン名など)
• クラス名を入力 : MyApp
• superクラスのBrowseボタンをクリック
• 検索ボックスにApplicationと入力、javafxを選択

• public static void mainの生成チェックをつけておく
• 入力内容を確認してFinishボタンをクリック

• クラス生成完了

Javaを実行してみる

さっきつくったクラスを次のように編集

package io.github.tyoshikawa1106;

import javafx.application.Application;
import javafx.stage.Stage;

public class MyApp extends Application {

  @Override
  public void start(Stage primaryStage) throws Exception {
    primaryStage.show();
  }

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

}

Runアイコンをクリック

ウィンドウを表示できます。

FXMLファイルを作成

• レイアウト部分はFXMLファイルで定義されます。
• New → Fileから作成

• Home.fxmlで作成

• こんな感じ

<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>

<BorderPane prefHeight="300" prefWidth="400"
	xmlns="http://javafx.com/javafx/8"
	xmlns:fx="http://javafx.com/fxml/1">
	<center>
		<Label fx:id="label1" text="Hello JavaFX!" BorderPane.alignment="CENTER" />
	</center>
</BorderPane>

• MyJavaFXAppを編集

package io.github.tyoshikawa1106;

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

public class MyApp extends Application {

	@Override
	public void start(Stage primaryStage) throws Exception {
		Parent root = FXMLLoader.load(getClass().getResource("Home.fxml"));
		Scene scene = new Scene(root, 400, 300);
		primaryStage.setScene(scene);
		primaryStage.show();
	}

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

}

これで起動するとFXMLファイルで定義したラベルが表示されます。

コントローラの作成

• ウィンドウフォームから利用するコントローラを作成します。(Javaクラスの作成)

• こんな感じ

package io.github.tyoshikawa1106;

import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.scene.control.Label;

public class HomeController {
	@FXML
	private Label label1;
	
	@FXML
	protected void doClick(ActionEvent event) {
		label1.setText("Hello! World!");
	}
}

コントローラが作成できたので、Home.fxmlを変更

<?xml version="1.0" encoding="UTF-8"?>
<?import java.lang.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>

<BorderPane prefHeight="300" prefWidth="400"
	fx:controller="io.github.tyoshikawa1106.HomeController"
	xmlns="http://javafx.com/javafx/8"
	xmlns:fx="http://javafx.com/fxml/1">
	<center>
		<Label fx:id="label1" text="Hello JavaFX!" BorderPane.alignment="CENTER" />
	</center>
	<bottom>
		<Button fx:id="button1" onAction="#doClick" text="Click!" BorderPane.alignment="CENTER" />
	</bottom>
</BorderPane>

ボタンが表示され、クリックするとラベルの内容が変更されます。

JavaFXのHello Worldはこんなかんじでした。