JavaFX Table Cells: Interdependence and Dynamic Editability

 The standard usage of JavaFX TableView with currently available set of cell controls, with all its indisputable merits, fails to meet a fairly important requirement, which usually arises when editable fields are mutually dependent. Generally it is easy enough to change values of all dependent fields when value of some field had been changed. The real problem emerges when a cell control, which is connected with a single data field (property), should become editable or not editable (having a fixed value) depending on values of some other fields (properties) of the same record (row data object). Besides, to spare user some useless clicks and confusion, it is important to make appearance of the cell reflect at least two conditions: editable/not editable and within/outside of the selected row.

To make it work, there is no need to subclass anything but table-cell controls. While it is possible to subclass TableCell and recreate all the specific cell controls, it is much easier to subclass each particular cell control, although it does lead to some minor duplication of code. To insure that all our custom cells refer to the same style definitions in a CSS stylesheet, let's share style constants in an interface:

public interface IDeCell
{
  public static final String CLASS_DE_CELL = "de-cell";
  public static final String PSEUDO_CLASS_NOT_EDITABLE = "not-editable";
  public static final String PSEUDO_CLASS_ROW_SELECTED = "row-selected";
}

Prefix "de" stands for Dynamic Editability. We are going to prefix our custom cell extensions with "De" and refer to such cells as "de-cells".
 
Here is source code of custom TextFieldTableCell extension:

public class DeTextFieldTableCell<S, T> extends TextFieldTableCell<S, T> implements IDeCell
{
  private static final PseudoClass NOT_EDITABLE_PSEUDO_CLASS =
    PseudoClass.getPseudoClass(PSEUDO_CLASS_NOT_EDITABLE);
  private static final PseudoClass ROW_SELECTED_PSEUDO_CLASS =
    PseudoClass.getPseudoClass(PSEUDO_CLASS_ROW_SELECTED);
 
  public BooleanProperty notEditableProperty() { return notEditable; }
  public final boolean isNotEditable() { return notEditableProperty().get(); }
  private final BooleanProperty notEditable = new SimpleBooleanProperty(this,
    PSEUDO_CLASS_NOT_EDITABLE, false)
  {
    @Override protected void invalidated()
    {
      pseudoClassStateChanged(NOT_EDITABLE_PSEUDO_CLASS, get());
    }
  }; 

  public final BooleanProperty rowSelectedProperty() { return rowSelected; }
  public final boolean isRowSelected() { return rowSelectedProperty().get(); }
  private final BooleanProperty rowSelected = new SimpleBooleanProperty(this,
    PSEUDO_CLASS_ROW_SELECTED, false)
  {
    @Override protected void invalidated()
    {
      pseudoClassStateChanged(ROW_SELECTED_PSEUDO_CLASS, get());
    }
  }; 
 
  public SimpleObjectProperty<S> recordProperty() { return record; }
  private SimpleObjectProperty<S> record = new SimpleObjectProperty<>();
 
  public DeTextFieldTableCell(StringConverter<T> converter)
  {
    super(converter);
    getStyleClass().add(CLASS_DE_CELL);
    notEditable.bind(editableProperty().not());
    tableRowProperty().addListener((ov, vOld, vNew)->
    {
      record.unbind();
      rowSelected.unbind();
      if (vNew != null)
      {
        record.bind(vNew.itemProperty());
        rowSelectedProperty().bind(vNew.selectedProperty());
      }
    });
  }
}

DeTextFieldTableCell and all other de-cell controls share identical lines of code which define Boolean properties "rowSelected" and "notEditable" and respective custom CSS pseudo-classes "row-selected" and "not-editable". Additionally, de-cells expose row object (record) with "record" property. 

Code, which makes editability and appearance of a cell depend on values of one or more properties of the "record" has to look like this:

cell.recordProperty().addListener((ov, r0, r) ->
{
  cell.editableProperty().unbind();
  if (r != null) {
     cell.editableProperty().bind(r.someProperty().and(r.otherProperty()));
  }
});

Here is sample CSS for de-cells:

.de-cell:filled:not-editable
{
    -fx-background-color: #cccccc;
    -fx-text-fill: #0000ff;
    -fx-border-width: 1px 0px 0px 1px;
    -fx-border-color: #eeeeee   
}
.de-cell:filled:row-selected
{
    -fx-background-color: skyblue;
    -fx-text-fill: black;
    -fx-border-width: 1px 0px 0px 1px;
    -fx-border-color: #eeeeee   
}
.de-cell:filled:not-editable:row-selected
{
    -fx-background-color: #999999;
    -fx-text-fill: #0000ff
}

The example below is a taken (with some simplification) from the existing working application. There is a system, which allows customers to buy online prints and file downloads. All general, non-specific files, which are accessible by general customers, have preassigned General Prices: price of 1 printed copy for printable and download price for not printable ones. Besides, there are special, tailor-made files, which are not accessible by general customers and don't have General Prices.

A customer can fetch products himself (with General Price only), or some products can be pushed to him by a sales manager - with General Price or (relatively reduced) Special Price. In the first case number of the printed copies to be chosen by the customer, whereas in the last case number of printed copies has to be limited by the sales manager. In case of special, tailor-made files Special Price has to be assigned. Number of copies (quantity) for the file download is always equal 1.

At some point a sales manager collects all products (both general and tailor-made) to be pushed to a customer and has to edit collected entries. He/She can change any general price to a special one, allow download of a printable product, edit Special prices and printed copies (quantities).

There are following dependencies:
1. General/Special choice is enabled for the general products only.
2. Print/Download choice is enabled for printable products when Special Price is selected.
3. Price is editable when Special Price is selected, otherwise it has to be equal to preassigned General Price.
4. Quantity is editable when Special Price and Print Service are selected. When Download selected quantity is fixed and equals 1, when General and Print selected quantity is null (to be chosen by customer). 
 
For example, for a sample product "*A: General Print" the only editable dynamic field is "Price Type". If a user changes Price Type to Special then Service Type, Item Price and Quantity become editable. If a user changes Service Type to Download then Quantity become not editable (and set to 1).

 Here is source code for data object Entry:

public class Entry
{
  private final IntegerProperty entryId = new SimpleIntegerProperty();
  private final StringProperty name = new SimpleStringProperty();
  private final BooleanProperty printable = new SimpleBooleanProperty();
  private final BooleanProperty useGeneralPrice = new SimpleBooleanProperty();
  private final BooleanProperty usePrintService = new SimpleBooleanProperty();
  private final ObjectProperty<Number> generalPrice = new SimpleObjectProperty<>();
  private final ObjectProperty<Number> price = new SimpleObjectProperty<>();
  private final ObjectProperty<Integer> quantity = new SimpleObjectProperty<>();
  
  private final ObjectProperty<Number> totalPrice = new SimpleObjectProperty<>();
 
  public IntegerProperty entryIdProperty() { return entryId; }
  public StringProperty nameProperty() { return name; }
  public BooleanProperty printableProperty() { return printable; }
  public BooleanProperty useGeneralPriceProperty() { return useGeneralPrice; }
  public BooleanProperty usePrintServiceProperty() { return usePrintService; }
  public ObjectProperty<Number> generalPriceProperty() { return generalPrice; }
  public ObjectProperty<Number> priceProperty() { return price; }
  public ObjectProperty<Integer> quantityProperty() { return quantity; }
  
  public ObjectProperty<Number> totalPriceProperty() { return totalPrice; }
  
  public Entry(int aEntryId, String aName, BigDecimal aGeneralPrice, boolean aPrintable)
  {
    entryId.set(aEntryId);
    name.set(aName);
    printable.set(aPrintable);
    useGeneralPrice.set(aGeneralPrice != null);
    usePrintService.set(aPrintable);
    generalPrice.set(aGeneralPrice);
    price.set(aGeneralPrice);
    quantity.set((aPrintable) ? null : 1);
    
    totalPrice.bind(new ObjectBinding<Number>()
    {
      {
        super.bind(price, quantity);
      }  
    
      @Override
      protected Number computeValue() 
      {
        return (price.get() == null || quantity.get() == null) ?
          null : price.get().doubleValue()*quantity.get();
      }
    });
  }
}

Here is an excerpt from the sample app - creation of table columns with de-cells:

    TableColumn<Entry, Boolean> priceTypeCol =  new TableColumn<>("Price Type");
    priceTypeCol.setPrefWidth(60);
    priceTypeCol.setCellValueFactory(new PropertyValueFactory<>("useGeneralPrice"));   
    priceTypeCol.setCellFactory((tableColumn) ->
    {
      DeComboBoxTableCell<Entry, Boolean> cell = new DeComboBoxTableCell<>(
        new ABooleanConverter(PRICE_TYPES[0], PRICE_TYPES[1]), true, false);
      cell.recordProperty().addListener((ov, vOld, vNew) ->
      {
        cell.editableProperty().unbind();
        if (vNew != null)
          cell.editableProperty().bind(vNew.generalPriceProperty().isNotNull());
      });
      return cell;
    });
    priceTypeCol.setOnEditCommit((ev) ->
    {
      Entry entry = ev.getRowValue();
      Boolean value = ev.getNewValue();
      entry.useGeneralPriceProperty().set(value);
      if (value)
      {
        entry.priceProperty().set(entry.generalPriceProperty().get());
        entry.usePrintServiceProperty().set(entry.printableProperty().get());
      }
      entry.quantityProperty().set(
        (value && entry.usePrintServiceProperty().get()) ? null : 1);
    });
//==============================================================
    TableColumn<Entry, Boolean> serviceTypeCol = new TableColumn<>("Service Type");
    serviceTypeCol.setPrefWidth(60);
    serviceTypeCol.setCellValueFactory(new PropertyValueFactory<>("usePrintService"));   
    serviceTypeCol.setCellFactory((tableColumn) ->
    {
      DeComboBoxTableCell<Entry, Boolean> cell = new DeComboBoxTableCell<>(
        new ABooleanConverter(SERVICE_TYPES[0], SERVICE_TYPES[1]), true, false);
      cell.recordProperty().addListener((ov, vOld, vNew) ->
      {
        cell.editableProperty().unbind();
        if (vNew != null)
        {
          cell.editableProperty().bind(vNew.useGeneralPriceProperty().not()
            .and(vNew.printableProperty()));
        }
      });
      return cell;
    });
    serviceTypeCol.setOnEditCommit((ev) ->
    {
      Entry entry = ev.getRowValue();
      Boolean value = ev.getNewValue();
      entry.usePrintServiceProperty().set(value);
      entry.quantityProperty().set(1);
    });
//==============================================================
    TableColumn<Entry, Number> priceCol = new TableColumn<>("Item Price");
    priceCol.setPrefWidth(50);
    priceCol.setCellValueFactory(new PropertyValueFactory<>("price"));   
    priceCol.setCellFactory((tableColumn) ->
    {
      DeTextFieldTableCell<Entry, Number> cell = new DeTextFieldTableCell<>(
        new AMoneyConverter());
      cell.setAlignment(Pos.CENTER_RIGHT);
      cell.recordProperty().addListener((ov, vOld, vNew) ->
      {
        cell.editableProperty().unbind();
        if (vNew != null)
          cell.editableProperty().bind(vNew.useGeneralPriceProperty().not());
      });
      return cell;
    });
    priceCol.setOnEditCommit((ev) ->
    {
      ev.getRowValue().priceProperty().set(ev.getNewValue());
    });
//==============================================================
    TableColumn<Entry, Integer> quantityCol = new TableColumn<>("Quantity");
    quantityCol.setPrefWidth(40);
    quantityCol.setCellValueFactory(new PropertyValueFactory<>("quantity"));   
    quantityCol.setCellFactory((tableColumn) ->
    {
      DeTextFieldTableCell<Entry, Integer> cell = new DeTextFieldTableCell<>(
        new IntegerStringConverter());
      cell.setAlignment(Pos.CENTER);
      cell.recordProperty().addListener((ov, vOld, vNew) ->
      {
        cell.editableProperty().unbind();
        if (vNew != null)
        {
          cell.editableProperty().bind(vNew.useGeneralPriceProperty().not()
            .and(vNew.usePrintServiceProperty()));
        }
      });
      return cell;
    });
    priceCol.setOnEditCommit((ev) ->
    {
      ev.getRowValue().priceProperty().set(ev.getNewValue());
    });
//==============================================================
    TableColumn<Entry, Number> totalPriceCol = new TableColumn<>("Total Price");
    totalPriceCol.setPrefWidth(50);
    totalPriceCol.setCellValueFactory(new PropertyValueFactory<>("totalPrice"));   
    totalPriceCol.setCellFactory((tableColumn) ->
    {
      DeTextFieldTableCell<Entry, Number> cell = new DeTextFieldTableCell<>(
        new AMoneyConverter());
      cell.setAlignment(Pos.CENTER_RIGHT);
      cell.setEditable(false);
      return cell;
    });
    totalPriceCol.setEditable(false);

--