JavaFX チュートリアル〜今度こそ、初めてでも大丈夫6:CheckBox〜

イントロダクション

以前記載した記事で「初めてでも大丈夫」などと記載していましたが、ちょっと「危ういな」と思いチュートリアルをやってみようとなりました。

今回はチェックボックスの表示をやります。

チュートリアル

ここのページを、戦国Xサラの要領でガンガン斬り伏せながらやっていきます。

<チュートリアル>

基本のコード

/**
 * OracleのJavaFXチュートリアル。
 * ToggleButton表示します。
 * JavaDocです。このクラスは「@see」に記載しているサイトの
 * チュートリアルをやります。このクラスではLabelクラスの使用法を実行します。
 * 
 * @author takunoji
 * @see https://docs.oracle.com/javase/jp/8/javafx/user-interface-tutorial/checkbox.htm#CHDFEJCD
 * 2019/03/14
 */
public class Lv5_CheckBox extends Application {

    /**
     * このメソッドは、Applicationクラス(JavaFXのフレームワーク部品)
     * のメソッドをオーバーライドする。
     * {@link Application#launch(String...)}から呼び出される。
     */
    @Override
    public void start(Stage primaryStage) throws Exception {
        // チュートリアルの乗っていない部分
        Group group = new Group();
        VBox virtical = new VBox();
        HBox horizonal = new HBox();

        /* チュートリアルにあるコード */
        //A checkbox without a caption
        CheckBox cb1 = new CheckBox();
        //A checkbox with a string caption
        CheckBox cb2 = new CheckBox("Second");

        cb1.setText("First");
        cb1.setSelected(true);

        // Groupにチェックボックスを追加する
        group.getChildren().addAll(cb1, cb2);
        // チュートリアルでは省略されている
        virtical.getChildren().addAll(cb1, cb2);
        // チェックボックスの表示領域
        horizonal.getChildren().add(virtical);
        // イメージの表示領域
        Label iconSpace = new Label("Icon Space");
        iconSpace.setBackground(new Background(new BackgroundFill(Color.BLACK, new CornerRadii(5), Insets.EMPTY)));
        horizonal.getChildren().add(iconSpace);
        group.getChildren().add(horizonal);

        // 毎度おなじみのコード(この部分はだいたい同じになる)
        Scene scene = new Scene(group, 300, 300);
        primaryStage.setScene(scene);
        primaryStage.setTitle("チュートリアル6");
        primaryStage.show();
    }

    /**
     * メインメソッド。
     * Apllicationクラスのlaunchメソッドを呼び出す。
     * 
     * @param args プログラム引数
     */
    public static void main(String[] args) {
        launch(args);
    }
}

<実行結果>

この基本のコードを基準にします。

このコードは単純にチェックボックスと、イメージを表示するための背景ラベルを表示します。処理を説明すると以下のようになります。

  1. Groupを使用して最終的に表示するコンテナを作成します。
  2. VBoxで縦、HBoxで横のレイアウト用コンテナを作成。
  3. CheckBoxを2つ作成し、FirstとSecondと名前をつけます。
  4. Firstのチェックボックスに選択済みフラグをTrueに設定します。

そして作成したコンポーネント(画面の部品)をGroup(コンテナ)へ追加して表示しています。

 

そして最終的にできたコードです。

/**
 * このメソッドは、Applicationクラス(JavaFXのフレームワーク部品)
 * のメソッドをオーバーライドする。
 * {@link Application#launch(String...)}から呼び出される。
 */
@Override
public void start(Stage primaryStage) throws Exception {
    // チュートリアルの乗っていない部分
    Group group = new Group();
    VBox virtical = new VBox();
    HBox horizonal = new HBox();

    /* チュートリアルにあるコード */
    //A checkbox without a caption
    CheckBox cb1 = new CheckBox();
    //A checkbox with a string caption
    CheckBox cb2 = new CheckBox("Second");

    cb1.setText("First");
    cb1.setSelected(true);

    // CheckBoxの動きの設定
    final String[] names = new String[]{"ore", "min", "twit"};
    final Image[] images = new Image[names.length];
    final ImageView[] icons = new ImageView[names.length];
    final CheckBox[] cbs = new CheckBox[names.length];

    // イメージ用のグループ
    Group gp = new Group();
    for (int i = 0; i < names.length; i++) {
        final Image image = images[i] =
            new Image("/" + names[i] + ".png");
        final ImageView icon = icons[i] = new ImageView();
        gp.getChildren().add(icon);
        final CheckBox cb = cbs[i] = new CheckBox(names[i]);
        cb.selectedProperty().addListener(
            (ObservableValue<? extends Boolean> ov,
                Boolean old_val, Boolean new_val) -> {
                    icon.setImage(new_val ? image : null);
        });
        virtical.getChildren().add(cb);
    }
    // Groupを追加する
//      group.getChildren().addAll(cb1, cb2);
    // チュートリアルでは省略されている
    virtical.getChildren().addAll(cb1, cb2);
    // チェックボックスの表示領域
    horizonal.getChildren().add(virtical);
    // イメージの表示領域
    Label iconSpace = new Label("Icon Space");
    iconSpace.setBackground(new Background(new BackgroundFill(Color.BLACK, new CornerRadii(5), Insets.EMPTY)));
    horizonal.getChildren().add(gp);
    group.getChildren().add(horizonal);

    // 毎度おなじみのコード(この部分はだいたい同じになる)
    Scene scene = new Scene(group, 300, 300);
    primaryStage.setScene(scene);
    primaryStage.setTitle("チュートリアル6");
    primaryStage.show();
}

チュートリアルに乗っている部分をコピーしています。

実行結果は以下のようになります。

イベント処理を追加するときは「〜Property」を使用するようですね(笑)

余談

JavaFXを使用するのに、便利なツールがあります。
その名も「SceneBuilder」インストール方法はこちらに記載しましています。

そして、こんな感じの使い勝手です。

できたもの

この記事を書いている時に作成しようとしていたものです。
Guluonというフレームワーク?を使用して作成しました。余計な音が入っています。



JavaFX関連ページ

  1. JavaFX SceneBuilder 〜EclipseとSceneBuilder連携~
  2. JavaFX SceneBuilder〜ボタンにメソッドを割り当てるワンポイント〜
  3. Java プロコンゲーム 〜見た目の作成(SceneBuilderの使用)〜

関連ページ一覧

Eclipse セットアップ

  1. Java Install Eclipse〜開発ツールのインストール〜
  2. TensorFlow C++環境〜EclipseCDTをインストール〜
  3. Setup OpenGL with JavaJOGLを使う準備 for Eclipse
  4. Eclipse Meven 開発手順〜プロジェクトの作成〜
  5. Java OpenCV 環境セットアップ(on Mac)
  6. Eclipse SceneBuilderを追加する
  7. JavaFX SceneBuilder EclipseSceneBuilder連携~

Java Basic一覧

  1. Java Basic Level 1 〜Hello Java〜
  2. Java Basic Level2 〜Arithmetic Calculate〜
  3. Java Basic Level3 〜About String class〜
  4. Java Basic Level 4〜Boolean〜
  5. Java Basic Level 5〜If Statement〜
  6. Java Basic Summary from Level1 to 5
  7. Java Basic Level 6 〜Traning of If statement〜
  8. Java Basic Level8 〜How to use for statement〜
  9. Java Basic Level 8.5 〜Array〜
  10. Java Basic Level 9〜Training of for statement〜
  11. Java Basic Level 10 〜While statement 〜
  12. Java Basic Swing〜オブジェクト指向〜
  13. Java Basic Swing Level 2〜オブジェクト指向2〜
  14. サンプル実装〜コンソールゲーム〜
  15. Java Basic インターフェース・抽象クラスの作り方
  16. Java Basic クラスとは〜Step2_1〜
  17. Java Basic JUnit 〜テストスイートの作り方〜

Git関連

  1. Java Git clone in Eclipse 〜サンプルの取得〜
  2. Eclipse Gitリポジトリの取得 GitからソースをPullしよう〜
  3. IntelliJ IDEA GitGitリポジトリからクローン〜