	ブログをはじめるログイン

2020年09月03日｜ 2020年09月04日｜2020年09月05日ブログトップ

TableView　[JavaFX]

前置き

表形式でデータを表示するためのコントロール。
このコントロールを使うとステップ数が爆上がりする。。。

TableViewにTableColumnをネストしたり。。。

データクラスを用意したり。。。

TableColumnにデータクラスをバインドしたり。。。

編集可能にするためにsetCellFactoryしたり。。。

セルの編集時にsetOnEditCommitで変更内容を反映させる必要があるし。。。

必要に応じてsetSelectionModeで複数行選択できるようにしたり。。。

etc...

とにかく面倒くさい。。。なのによく使うコントロール。。。

実装

FXDemo.fxml

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

<?import javafx.geometry.Insets?>
<?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.BorderPane?>
<?import javafx.scene.layout.FlowPane?>

<BorderPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="500.0" prefWidth="800.0" xmlns="http://javafx.com/javafx/11.0.1" xmlns:fx="http://javafx.com/fxml/1" fx:controller="jp.ne.yonem.FXDemo">
    <top>
        <FlowPane hgap="5.0" BorderPane.alignment="CENTER">
            <children>
            <Label text="Name" />
            <ComboBox fx:id="cmbName" prefWidth="150.0" />
            <Label text="Price" />
            <TextField fx:id="txtPrice" />
            <Button fx:id="btnAdd" mnemonicParsing="false" onAction="#onAdd" text="追加" />
            <Button fx:id="btnDel" mnemonicParsing="false" onAction="#onDel" text="削除" />
            </children>
            <BorderPane.margin>
            <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
            </BorderPane.margin>
        </FlowPane>
    </top>
    <center>
        <TableView fx:id="tblItem" editable="true" prefHeight="200.0" prefWidth="200.0" BorderPane.alignment="CENTER">
            <columns>
            <TableColumn fx:id="colNo" prefWidth="75.0" text="No" />
            <TableColumn fx:id="colName" onEditCommit="#nameCommit" prefWidth="75.0" text="Name" />
            <TableColumn fx:id="colPrice" onEditCommit="#priceCommit" prefWidth="75.0" text="Price" />
            </columns>
        </TableView>
    </center>
</BorderPane>

FXDemo.java

package jp.ne.yonem;

import javafx.application.Application;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.fxml.FXML;
import javafx.fxml.FXMLLoader;
import javafx.fxml.Initializable;
import javafx.scene.Scene;
import javafx.scene.control.*;
import javafx.scene.control.cell.ComboBoxTableCell;
import javafx.scene.control.cell.PropertyValueFactory;
import javafx.scene.control.cell.TextFieldTableCell;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;
import javafx.util.converter.IntegerStringConverter;
import lombok.Data;

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

public class FXDemo extends Application implements Initializable {

    @FXML
    ComboBox<String> cmbName;

    @FXML
    TextField txtPrice;

    @FXML
    TableView tblItem;

    @FXML
    TableColumn colNo;

    @FXML
    TableColumn colName;

    @FXML
    TableColumn colPrice;

    @Override
    public void start(Stage stage) throws IOException {
        BorderPane pane = FXMLLoader.load(getClass().getResource("FXDemo.fxml"));
        stage.setScene(new Scene(pane));
        stage.setTitle("FXDemo");
        stage.show();
    }

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

    @Override
    public void initialize(URL location, ResourceBundle resources) {
        cmbName.getItems().addAll(itemFactory());
        cmbName.getSelectionModel().select(0);

        // ItemをTableColumnにバインドする
        colNo.setCellValueFactory(new PropertyValueFactory<>("no"));
        colName.setCellValueFactory(new PropertyValueFactory<>("name"));
        colPrice.setCellValueFactory(new PropertyValueFactory<>("price"));

        // Editableの状態(ON/OFF)によって、編集可能なフィールドを割り当てる
        colName.setCellFactory(ComboBoxTableCell.forTableColumn(itemFactory()));
        colPrice.setCellFactory(TextFieldTableCell.forTableColumn(new IntegerStringConverter()));

        // 初期データ登録
        ObservableList vals = FXCollections.observableArrayList(
                new Item(1, "Item1", 111),
                new Item(2, "Item2", 222),
                new Item(3, "Item3", 333),
                new Item(4, "Item4", 444)
        );
        tblItem.setItems(vals);
        tblItem.getSelectionModel().setSelectionMode(SelectionMode.MULTIPLE);
    }

    private String[] itemFactory() {
        String[] items = new String[20];

        for (int i = 0; i < items.length; i++) {
            items[i] = String.format("Item%s", i + 1);
        }
        return items;
    }

    @FXML
    private void nameCommit(TableColumn.CellEditEvent<Item, String> e) {
        e.getTableView().getItems().get(e.getTablePosition().getRow()).setName(e.getNewValue());
    }

    @FXML
    private void priceCommit(TableColumn.CellEditEvent<Item, Integer> e) {
        e.getTableView().getItems().get(e.getTablePosition().getRow()).setPrice(e.getNewValue());
    }

    @FXML
    private void onAdd() {

        // Priceが未入力、数字以外が入力された場合は何もしない
        if (txtPrice.getText().isEmpty() || txtPrice.getText().matches(".*\\D.*")) {
            return;
        }
        ObservableList<Item> items = tblItem.getItems();
        int max = 0;

        if (!items.isEmpty()) {
            max = items.stream().map(i -> i.getNo()).max(Integer::compareTo).get();
        }
        items.add(new Item(
                ++max,
                cmbName.getSelectionModel().getSelectedItem(),
                Integer.parseInt(txtPrice.getText())));
    }

    @FXML
    private void onDel() {
        ObservableList<Item> items = tblItem.getSelectionModel().getSelectedItems();
        System.out.println(items);
        tblItem.getItems().removeAll(items);
    }


    @Data
    protected class Item {
        private int no;
        private String name;
        private int price;

        public Item(int no, String name, int price) {
            this.no = no;
            this.name = name;
            this.price = price;
        }
    }
}