【JavaFX】さくっとコンボボックスに項目を設定してみる

2017年9月28日2019年4月3日Java,開発

おはようございます。

今回は、JavaFXの基本的な構成や仕組みなどを学ぶために
とりあえずコンボボックスに項目を設定して選択できるようにしてみます。

開発環境については以前の記事を参考にしてください。

【JavaFX】eclipseにJavaFXプラグインをインストールして Hello World してみる | ド

おはようございます。ちょっと前まで Swingの開発を試しにやってたんですが、どうも Swing が廃止さ ...

https://www.doraxdora.com/blog/2017/09/22/post-2584/

1. 画面の作成
2. コントローラクラスの実装
3. メインクラスの修正
4. 起動してみる

画面の作成

画面は SceneBuilder にて作成します。
（WPF で作成した画面と同等のものを作ってみたいと思います。）

WPF編はこちら

初期状態では、「BorderPane」が設置されていますが、
それを削除して「AnchorPane」を設置し、その上にコントロールを配置していきます。

AnchorPane というのは、
簡単に言うとコントロールを座標（絶対位置）で配置できるレイアウトになります。

その他のレイアウトについてはそのうち紹介できればします。

SceneBuilder上で CTRL + P を押すとプレビュー表示することができます。

eclipse で Java プリケーションの実行をしなくても起動後の画面がサクッと表示されます。
（プログラムは動かないのでコントロールの位置確認のみ）

Sample.fxml

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

<?import javafx.scene.control.Button?>
<?import javafx.scene.control.ComboBox?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.TableColumn?>
<?import javafx.scene.control.TableView?>
<?import javafx.scene.control.TextField?>
<?import javafx.scene.layout.AnchorPane?>

<AnchorPane fx:id="mainPane" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="350.0" prefWidth="530.0"
        xmlns="http://javafx.com/javafx/8.0.111"
        xmlns:fx="http://javafx.com/fxml/1"
        fx:controller="application.SampleController"><!-- ← コントローラクラスと紐付 -->
        <children>
                 <!-- 名前 -->
                <Label fx:id="lbName" layoutX="14.0" layoutY="33.0" text="名前：" />
                <TextField fx:id="txName" layoutX="58.0" layoutY="29.0" />
                 <!-- 種別 -->
                <Label fx:id="lbKind" layoutX="221.0" layoutY="33.0" text="種別：" />
                <ComboBox fx:id="cbKind" layoutX="264.0" layoutY="29.0" prefWidth="150.0" />
                 <!-- 検索ボタン -->
                <Button fx:id="btSearch" layoutX="456.0" layoutY="29.0" mnemonicParsing="false" text="検索" />
                 <!-- 一覧 -->
                <TableView fx:id="tvCat" layoutX="14.0" layoutY="63.0" prefHeight="273.0" prefWidth="498.0">
                        <columns>
                                <TableColumn maxWidth="50.0" minWidth="50.0" prefWidth="50.0" resizable="false" text="No" />
                                <TableColumn maxWidth="100.0" minWidth="100.0" prefWidth="100.0" text="名前" />
                                <TableColumn maxWidth="40.0" minWidth="40.0" prefWidth="40.0" text="性別" />
                                <TableColumn maxWidth="40.0" minWidth="40.0" prefWidth="40.0" text="年齢" />
                                <TableColumn minWidth="120.0" prefWidth="120.0" text="種別" />
                                <TableColumn minWidth="145.0" prefWidth="147.0" text="好物" />
                        </columns>
                         <columnResizePolicy>
                                <TableView fx:constant="CONSTRAINED_RESIZE_POLICY" />
                         </columnResizePolicy>
                </TableView>
         </children>
</AnchorPane>

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

<?import javafx.scene.control.Button?>

<?import javafx.scene.control.ComboBox?>

<?import javafx.scene.control.Label?>

<?import javafx.scene.control.TableColumn?>

<?import javafx.scene.control.TableView?>

<?import javafx.scene.control.TextField?>

<?import javafx.scene.layout.AnchorPane?>

<AnchorPane fx:id="mainPane"maxHeight="-Infinity"maxWidth="-Infinity"minHeight="-Infinity"minWidth="-Infinity"prefHeight="350.0"prefWidth="530.0"

xmlns="http://javafx.com/javafx/8.0.111"

xmlns:fx="http://javafx.com/fxml/1"

fx:controller="application.SampleController">

</columns>

</columnResizePolicy>

</TableView>

</children>

</AnchorPane>

コントローラクラスの実装

JavaFX では、
基本的に fxml （画面定義）と対応するコントローラー（クラス）を作成し、
コントローラーにてイベントなどを処理するような構成となります。

fxml に記述した

    fx:controller="application.SampleController"

1	fx:controller="application.SampleController"

でコントローラを指定し、コントローラークラスには
画面に設置したコントロールをメンバーとして定義することが必要。

こうすることで、
コントローラークラスにて画面のコントロールを操作することが可能となります。

SampleController.java

package application;

import java.net.URL;
import java.util.ResourceBundle;

import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.Button;
import javafx.scene.control.ComboBox;
import javafx.scene.control.Label;
import javafx.scene.control.TableView;
import javafx.scene.control.TextField;
import javafx.scene.layout.AnchorPane;

public class SampleController implements Initializable{

        /** パネル：メイン */
        @FXML
        private AnchorPane mainPane;

        /** ラベル：名前 */
        @FXML
        private Label lbName;

        /** テキストフィールド：名前 */
        @FXML
        private TextField txName;

        /** ラベル：種別 */
        @FXML
        private Label lbKind;

        /** コンボボックス：名前 */
        @FXML
        private ComboBox<String> cbKind;

        /** ボタン：検索 */
        @FXML
        private Button btSearch;

        /** テーブルビュー：一覧 */
        @FXML
        private TableView<String> tvCat;

        /**
         * @return mainPane
         */
        public AnchorPane getMainPane() {
                return mainPane;
        }

        /**
         * @param mainPane セットする mainPane
         */
        public void setMainPane(AnchorPane mainPane) {
                this.mainPane = mainPane;
        }

        /**
         * @return lbName
         */
        public Label getLbName() {
                return lbName;
        }

        /**
         * @param lbName セットする lbName
         */
        public void setLbName(Label lbName) {
                this.lbName = lbName;
        }

        /**
         * @return txName
         */
        public TextField getTxName() {
                return txName;
        }

        /**
         * @param txName セットする txName
         */
        public void setTxName(TextField txName) {
                this.txName = txName;
        }

        /**
         * @return lbKind
         */
        public Label getLbKind() {
                return lbKind;
        }

        /**
         * @param lbKind セットする lbKind
         */
        public void setLbKind(Label lbKind) {
                this.lbKind = lbKind;
        }

        /**
         * @return cbKind
         */
        public ComboBox<String> getCbKind() {
                return cbKind;
        }

        /**
         * @param cbKind セットする cbKind
         */
        public void setCbKind(ComboBox<String> cbKind) {
                this.cbKind = cbKind;
        }

        /**
         * @return btSearch
         */
        public Button getBtSearch() {
                return btSearch;
        }

        /**
         * @param btSearch セットする btSearch
         */
        public void setBtSearch(Button btSearch) {
                this.btSearch = btSearch;
        }

        /**
         * @return tvCat
         */
        public TableView<String> getTvCat() {
                return tvCat;
        }

        /**
         * @param tvCat セットする tvCat
         */
        public void setTvCat(TableView<String> tvCat) {
                this.tvCat = tvCat;
        }

        /*
         * (非 Javadoc)
         * @see javafx.fxml.Initializable#initialize(java.net.URL, java.util.ResourceBundle)
         */
        @Override
        public void initialize(URL location, ResourceBundle resources) {

                // コンボボックスに項目を追加
                cbKind.getItems().add("指定なし");
                cbKind.getItems().add("キジトラ");
                cbKind.getItems().add("長毛種（不明）");
                cbKind.getItems().add("ミケ（っぽい）");
                cbKind.getItems().add("サビ");
                cbKind.getItems().add("その他");

                // 初期選択状態を設定
                cbKind.getSelectionModel().select(0);

        }

}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

packageapplication;

importjava.net.URL;

importjava.util.ResourceBundle;

importjavafx.fxml.FXML;

importjavafx.fxml.Initializable;

importjavafx.scene.control.Button;

importjavafx.scene.control.ComboBox;

importjavafx.scene.control.Label;

importjavafx.scene.control.TableView;

importjavafx.scene.control.TextField;

importjavafx.scene.layout.AnchorPane;

publicclassSampleControllerimplementsInitializable{

/** パネル：メイン */

@FXML

privateAnchorPane mainPane;

/** ラベル：名前 */

@FXML

privateLabel lbName;

/** テキストフィールド：名前 */

@FXML

privateTextField txName;

/** ラベル：種別 */

@FXML

privateLabel lbKind;

/** コンボボックス：名前 */

@FXML

privateComboBox<String>cbKind;

/** ボタン：検索 */

@FXML

privateButton btSearch;

/** テーブルビュー：一覧 */

@FXML

privateTableView<String>tvCat;

/**

* @return mainPane

publicAnchorPane getMainPane(){

returnmainPane;

}

/**

* @param mainPane セットする mainPane

publicvoidsetMainPane(AnchorPane mainPane){

this.mainPane=mainPane;

}

/**

* @return lbName

publicLabel getLbName(){

returnlbName;

}

/**

* @param lbName セットする lbName

publicvoidsetLbName(Label lbName){

this.lbName=lbName;

}

/**

* @return txName

publicTextField getTxName(){

returntxName;

}

/**

* @param txName セットする txName

publicvoidsetTxName(TextField txName){

this.txName=txName;

}

/**

* @return lbKind

publicLabel getLbKind(){

returnlbKind;

}

/**

* @param lbKind セットする lbKind

publicvoidsetLbKind(Label lbKind){

this.lbKind=lbKind;

}

/**

* @return cbKind

publicComboBox<String>getCbKind(){

returncbKind;

}

/**

* @param cbKind セットする cbKind

publicvoidsetCbKind(ComboBox<String>cbKind){

this.cbKind=cbKind;

}

/**

* @return btSearch

publicButton getBtSearch(){

returnbtSearch;

}

/**

* @param btSearch セットする btSearch

publicvoidsetBtSearch(Button btSearch){

this.btSearch=btSearch;

}

/**

* @return tvCat

publicTableView<String>getTvCat(){

returntvCat;

}

/**

* @param tvCat セットする tvCat

publicvoidsetTvCat(TableView<String>tvCat){

this.tvCat=tvCat;

}

* (非 Javadoc)

* @see javafx.fxml.Initializable#initialize(java.net.URL, java.util.ResourceBundle)

@Override

publicvoidinitialize(URL location,ResourceBundle resources){

// コンボボックスに項目を追加

cbKind.getItems().add("指定なし");

cbKind.getItems().add("キジトラ");

cbKind.getItems().add("長毛種（不明）");

cbKind.getItems().add("ミケ（っぽい）");

cbKind.getItems().add("サビ");

cbKind.getItems().add("その他");

// 初期選択状態を設定

cbKind.getSelectionModel().select(0);

}

メインクラスの修正

ちょっと嵌ったんですが
fxml で AnchorPane のサイズをいくら変更しても
いざ起動してみるとその通りのサイズになってくれませんでした。

よくよく見なおしてみると、メインクラスにて、
Scene のインスタンスを初期化する際に、幅と高さを指定していたことが原因でした。
（デフォルトでそうなっている）

幅と高さの指定を取り除いたら問題なく fxml で指定したサイズで表示されるようになりました。

Main.java

package application;

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

public class Main extends Application {
        @Override
        public void start(Stage primaryStage) {
                try {
                        AnchorPane root = (AnchorPane) FXMLLoader.load(getClass().getResource("Sample.fxml"));
                        // 幅と高さを指定してインスタンスを生成
                        //Scene scene = new Scene(root, 400, 400);
                        // 幅と高さを指定せずにインスタンスを生成
                        Scene scene = new Scene(root);
                        scene.getStylesheets().add(getClass().getResource("application.css").toExternalForm());
                        primaryStage.setScene(scene);
                        primaryStage.show();
                } catch (Exception e) {
                        e.printStackTrace();
                }
        }

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