JavaFX shape inside cell of tableview

Question

I currently have a working table, but I want to change the SimpleIntegerProperty "status" to a square. Basically, I want the all the "1" to become squares. This is the code that I made:

public ObservableList<PumpSites> list = FXCollections.observableArrayList(
        new PumpSites (1, "Canduman"),
        new PumpSites (1, "Cubacub"),
        new PumpSites (1, "Liloan"),
        new PumpSites (1, "Talamban"),
        new PumpSites (1, "Tisa")
        );

status.setCellValueFactory(new PropertyValueFactory<PumpSites, Integer>("status"));
ps.setCellValueFactory(new PropertyValueFactory<PumpSites, String>("ps"));
table.setItems(list);

public class PumpSites {
    private final SimpleIntegerProperty status;
    private final SimpleStringProperty ps;

    public PumpSites(Integer status, String ps){
        super();
        this.status = new SimpleIntegerProperty(status);
        this.ps = new SimpleStringProperty(ps);
    }

    public Integer getStatus() {
        return status.get();
    }

    public String getPs() {
        return ps.get();
    }

}

How can I do that?

Answer 1

Instead of the IntegerProperty use an ObjectProperty<Shape> and @Override in a TableCell the updateItem(item,empty) method to display the shape

Here is the working code:

public class Controller implements Initializable {

    @FXML
    private TableView<Model> tableView;
    @FXML
    private TableColumn<Model, Shape> shapeColumn;
    @FXML
    private TableColumn<Model, String> textColumn;

    @Override

    public void initialize(URL location, ResourceBundle resources) {
        shapeColumn.setCellValueFactory(data -> data.getValue().shapeProperty());
        textColumn.setCellValueFactory(data -> data.getValue().textProperty());

        shapeColumn.setCellFactory(cell -> new ShapeTableCell());

        ObservableList<Model> items = FXCollections.observableArrayList();

        items.add(new Model(new Circle(10), "Circle"));
        items.add(new Model(new Rectangle(20, 20), "Rectangle"));

        tableView.setItems(items);
    }

    private class Model {
        // Instead of shape you can use anything, which inherits from Node,
        // like an ImageView to display a specific image
        private ObjectProperty<Shape> shape;
        private StringProperty text;

        public Model(Shape shape, String text) {
            this.shape = new SimpleObjectProperty<>(shape);
            this.text = new SimpleStringProperty(text);
        }

        public Shape getShape() {
            return shape.get();
        }

        public ObjectProperty<Shape> shapeProperty() {
            return shape;
        }

        public String getText() {
            return text.get();
        }

        public StringProperty textProperty() {
            return text;
        }
    }

    private class ShapeTableCell extends TableCell<Model, Shape> {
        @Override
        protected void updateItem(Shape item, boolean empty) {
            super.updateItem(item, empty);
            if (empty) {
                setGraphic(null);
            } else {
                setGraphic(item);
            }
        }
    }

}

Hint: Try to avoid using PropertyValueFactory and use Callback instead. PVF uses reflection which is never the best solution when you have an alternative one.