javafx create ComboBox TableCell

Jerome picture Jerome · Feb 18, 2014 · Viewed 13.5k times · Source

I'm trying to create a custom TableCell in my TableView. I'd like it to display a ComboBox where I can choose a String value, and then display the String value as if it was an user input. The idea is that ths user doesn't know which are the allowed values so he can simply pick one of them in the ComboBox.

I tried to do that making my own "ComboBoxCell" but it doesn't work as expected :

public class ComboBoxCell extends TableCell<ClassesProperty, String> {

    private ComboBox<String> comboBox;

    public ComboBoxCell() {
    }

    @Override
    public void startEdit() {
        super.startEdit();

        if (comboBox == null) {
            createComboBox();
        }

        setGraphic(comboBox);
        setContentDisplay(ContentDisplay.GRAPHIC_ONLY);
    }

    @Override
    public void cancelEdit() {
        super.cancelEdit();

        setText(String.valueOf(getItem()));
        setContentDisplay(ContentDisplay.TEXT_ONLY);
    }

    public void updateItem(String item, boolean empty) {
        super.updateItem(item, empty);

        if (empty) {
            setText(null);
            setGraphic(null);
        } else {
            if (isEditing()) {
                if (comboBox != null) {
                    comboBox.setValue(getString());
                }
                setGraphic(comboBox);
                setContentDisplay(ContentDisplay.GRAPHIC_ONLY);
            } else {
                setText(getString());
                setContentDisplay(ContentDisplay.TEXT_ONLY);
            }
        }
    }

    private void createComboBox() {
        // ClassesController.getLevelChoice() is the observable list of String
        comboBox = new ComboBox<>(ClassesController.getLevelChoice());
        comboBox.setMinWidth(this.getWidth() - this.getGraphicTextGap()*2);
        comboBox.setOnKeyPressed(new EventHandler<KeyEvent>() {
            @Override
            public void handle(KeyEvent t) {
                if (t.getCode() == KeyCode.ENTER) {
                    commitEdit(comboBox.getSelectionModel().getSelectedItem());
                } else if (t.getCode() == KeyCode.ESCAPE) {
                    cancelEdit();
                }
            }
        });
    }

    private String getString() {
        return getItem() == null ? "" : getItem().toString();
    }
}

Then in my "main" app :

levelChoice = FXCollections.observableArrayList(
        new String("Bla"),
        new String("Blo")
    );

// Level Column : String value
Callback<TableColumn, TableCell> comboBoxFactory = new Callback<TableColumn, TableCell>() {
        @Override
        public TableCell call(TableColumn p) {
            return new ComboBoxCell();
        }
    };

levelColumn.setCellValueFactory(
        new PropertyValueFactory<ClassesProperty, String>("level")
    );
levelColumn.setCellFactory(comboBoxFactory);

Any ideas? Thanks !

Answer

Jerome picture Jerome · Feb 19, 2014

I've found the solution :

levelChoice = FXCollections.observableArrayList("Bla", "Blo");

levelColumn.setCellValueFactory(
    new PropertyValueFactory<ClassesProperty, String>("level")
);
levelColumn.setCellFactory(ComboBoxTableCell.forTableColumn(levelChoice));
levelColumn.setOnEditCommit(
    new EventHandler<CellEditEvent<ClassesProperty, String>>() {
        @Override
        public void handle(CellEditEvent<ClassesProperty, String> t) {
            ((ClassesProperty) t.getTableView().getItems().get(t.getTablePosition().getRow())).setLevel(t.getNewValue());
        };
    }
);