ドキュメント



JavaFX: JavaFX UIコンポーネントの操作

4 ラジオ・ボタン

この章では、ラジオ・ボタンのコントロール、およびToggleButtonクラスの特殊な実装であるRadioButtonクラスについて説明します。

ラジオ・ボタンのコントロールは選択済の場合も選択解除の場合もあります。通常、ラジオ・ボタンはグループにまとめられており、一度に選択できるボタンは1つのみです。この動作は、グループ内ですべて選択されていない状態にできるトグル・ボタンとは異なります。

図4-1に、ラジオ・ボタンがグループに追加されているRadioButtonサンプルの3つの画面キャプチャを示します。

図4-1 RadioButtonサンプル

3つのラジオ・ボタンのグループ
「図4-1 RadioButtonサンプル」の説明

次の段落を読み、アプリケーションにラジオ・ボタンを実装する方法について学習します。

ラジオ・ボタンの作成

JavaFX SDKのjavafx.scene.controlパッケージで提供されているRadioButtonクラスでは、ラジオ・ボタンの作成に使用できる2つのコンストラクタが用意されています。例4-1に2つのラジオ・ボタンを示します。rb1の作成には、パラメータのないコンストラクタを使用します。このラジオ・ボタンのテキスト・キャプションはsetTextメソッドを使用して設定します。rb2のテキスト・キャプションは対応するコンストラクタ内で定義されます。

例4-1 ラジオ・ボタンの作成

//A radio button with an empty string for its label
RadioButton rb1 = new RadioButton();
//Setting a text label
rb1.setText("Home");
//A radio button with the specified label
RadioButton rb2 = new RadioButton("Calendar");

setSelectedメソッドを使用し、その値をtrueに設定すると、ラジオ・ボタンを明示的に選択済にできます。ユーザーが特定のラジオ・ボタンを選択したかどうかを確認する必要がある場合は、isSelectedメソッドを適用します。

RadioButtonクラスはLabeledクラスの拡張であるため、テキスト・キャプションに加えてイメージも指定できます。setGraphicメソッドを使用してイメージを指定します。例4-2に、アプリケーションにグラフィカル・ラジオ・ボタンを実装する方法を示します。

例4-2 グラフィカル・ラジオ・ボタンの作成

Image image = new Image(getClass().getResourceAsStream("ok.jpg"));
RadioButton rb = new RadioButton("Agree");
rb.setGraphic(new ImageView(image));

グループへのラジオ・ボタンの追加

通常、ラジオ・ボタンはグループで使用され、複数の相互排他オプションを示します。ToggleGroupオブジェクトは、関連するすべてのラジオ・ボタンへの参照を指定し、それを管理し、一度に1つのみラジオ・ボタンが選択されるようにします。例4-3では、トグル・グループと3つのラジオ・ボタンを作成して、それぞれのラジオ・ボタンをトグル・グループに追加し、アプリケーションの起動時にどのボタンが選択されるかを指定します。

例4-3 ラジオ・ボタン・グループの作成

final ToggleGroup group = new ToggleGroup();

RadioButton rb1 = new RadioButton("Home");
rb1.setToggleGroup(group);
rb1.setSelected(true);

RadioButton rb2 = new RadioButton("Calendar");
rb2.setToggleGroup(group);
 
RadioButton rb3 = new RadioButton("Contacts");
rb3.setToggleGroup(group);

レイアウト・コンテナを使用してこれらのラジオ・ボタンを並べ、アプリケーションにそのコンテンツを追加すると、その出力は図4-2のようになります。

図4-2 グループに組み込まれた3つのラジオ・ボタン

3つのラジオ・ボタン: 「Home」、「Calendar」、「Contacts」
「図4-2 グループに組み込まれた3つのラジオ・ボタン」の説明

ラジオ・ボタンのイベントの処理

通常、グループ内のラジオ・ボタンのいずれかが選択されると、アプリケーションがアクションを実行します。例4-4のコード・フラグメントを確認し、選択したラジオ・ボタンに応じてアイコンがどのように変化するかを学習します。

例4-4 ラジオ・ボタンのアクションの処理

ImageView image = new ImageView();

rb1.setUserData("Home")
rb2.setUserData("Calendar");
rb3.setUserData("Contacts");

final ToggleGroup group = new ToggleGroup();

group.selectedToggleProperty().addListener(
    (ObservableValue<? extends Toggle> ov, Toggle old_toggle, 
    Toggle new_toggle) -> {
        if (group.getSelectedToggle() != null) {
            final Image image = new Image(
                getClass().getResourceAsStream(
                group.getSelectedToggle().getUserData().toString() +
                ".jpg"));
        icon.setImage(image);
    }
});

それぞれのラジオ・ボタンにユーザー・データが割り当てられています。ChangeListener<Toggle>オブジェクトがグループ内で選択したトグルをチェックします。これはgetSelectedToggleメソッドを使用して、現在選択されているラジオ・ボタンを識別し、getUserDataメソッドをコールしてそのユーザー・データを抽出します。そのユーザー・データは、ロードするイメージ・ファイル名を構築するために適用されます。

たとえば、rb3が選択されると、getSelectedToggleメソッドが"rb3"を返し、getUserDataメソッドが"Contacts"を返します。このため、getResourceAsStreamメソッドは値"Contacts.jpg"を受け取ります。図4-1にアプリケーションの出力を示します。

ラジオ・ボタンのフォーカスのリクエスト

ラジオ・ボタンのグループでは、最初のボタンがデフォルトでフォーカスされています。setSelectedメソッドをグループ内の2番目のラジオ・ボタンに適用すると、その結果は図4-3に示すようになります。

図4-3 デフォルトのフォーカス設定

2番目のラジオ・ボタンが選択されています。
「図4-3 デフォルトのフォーカス設定」の説明

2番目のラジオ・ボタンが選択されていますが、最初のボタンにフォーカスが残っています。フォーカスを変更するには、例4-5に示すようにrequestFocus関数を使用します。

例4-5 2番目のラジオ・ボタンへのフォーカスのリクエスト

rb2.setSelected(true);
rb2.requestFocus();

このコードを適用すると、その結果は図4-4に示すとおりになります。

図4-4 選択したラジオ・ボタンへのフォーカスの設定

2番目のラジオ・ボタンにフォーカスが設定されています。
「図4-4 選択したラジオ・ボタンへのフォーカスの設定」の説明

関連APIドキュメント

ウィンドウを閉じる

目次

JavaFX: JavaFX UIコンポーネントの操作

展開 | 縮小