I want to apply a custom style using the setStyle method to the CheckBox of a TableView but I can not do it. I have tried to create a CheckBox inside the setCellFactory regardless of CheckBoxTableCell but in that case the value in the ObservableList<Person> is no longer updated.
My code is the following:
public class Person {
private String name;
private boolean accepted;
public Person(String name, boolean accepted) {
this.name = name;
this.accepted = accepted;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public boolean isAccepted() {
return accepted;
}
public void setAccepted(boolean accepted) {
this.accepted = accepted;
}
}
The main class:
import javafx.application.Application;
import javafx.beans.property.SimpleBooleanProperty;
import javafx.beans.value.ObservableValue;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.TableColumn;
import javafx.scene.control.TableColumn.CellDataFeatures;
import javafx.scene.control.TableView;
import javafx.scene.control.cell.CheckBoxTableCell;
import javafx.scene.control.cell.PropertyValueFactory;
import javafx.scene.control.cell.TextFieldTableCell;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;
public class TableViewWithCheckBox extends Application {
#Override
public void start(Stage stage) {
TableView<Person> table = new TableView<>();
// Editable
table.setEditable(true);
TableColumn<Person, String> fullNameCol = new TableColumn<>("Name");
TableColumn<Person, Boolean> acceptedCol = new TableColumn<>("Accepted");
// NAME
fullNameCol.setCellValueFactory(new PropertyValueFactory<>("name"));
fullNameCol.setCellFactory(TextFieldTableCell.<Person> forTableColumn());
fullNameCol.setMinWidth(200);
// ACCEPTED
acceptedCol.setCellValueFactory((CellDataFeatures<Person, Boolean> param) -> {
Person person = param.getValue();
SimpleBooleanProperty booleanProp = new SimpleBooleanProperty(person.isAccepted());
booleanProp.addListener(
(ObservableValue<? extends Boolean> observable,
Boolean oldValue, Boolean newValue) -> {
person.setAccepted(newValue);
});
return booleanProp;
});
acceptedCol.setCellFactory((TableColumn<Person, Boolean> p) -> {
CheckBoxTableCell<Person, Boolean> cell = new CheckBoxTableCell<>();
cell.setAlignment(Pos.CENTER);
return cell;
});
ObservableList<Person> list = getPersonList();
table.setItems(list);
table.getColumns().addAll(fullNameCol, acceptedCol);
StackPane root = new StackPane();
root.setPadding(new Insets(5));
root.getChildren().add(table);
Scene scene = new Scene(root, 300, 300);
stage.setScene(scene);
stage.show();
}
private ObservableList<Person> getPersonList() {
Person person1 = new Person("John White", true);
Person person2 = new Person("Kevin Land", false);
Person person3 = new Person("Rouse Hill", true);
ObservableList<Person> list = FXCollections.observableArrayList(person1, person2, person3);
return list;
}
}
And the code with a custom CheckBox but that does not update the observable list:
acceptedCol.setCellFactory((TableColumn<Person, Boolean> success) -> {
TableCell<Person, Boolean> cell = new TableCell<Person, Boolean>(){
#Override
public void updateItem(Boolean item, boolean empty) {
super.updateItem(item, empty);
if(empty || item == null){
setGraphic(null);
} else {
CheckBox myCheckBox = new CheckBox();
myCheckBox.getStyleClass().add("myPersonalCheckBoxStyle");
myCheckBox.setSelected(item);
setGraphic(myCheckBox);
}
}
};
return cell;
});
CheckBoxTableCell does all the heavy lifting for you, just need a little help from your Person class which should use/expose properties (vs. plain fields with getters/setters only). Then configure the column with the acceptedProperty and apply a custom style to the cell.
In code snippets:
public class Person {
private BooleanProperty accepted;
public Person(String name, boolean single) {
this.accepted = new SimpleBooleanProperty(single);
...
}
public BooleanProperty acceptedProperty() {
return accepted;
}
public boolean isAccepted() {
return acceptedProperty().get();
}
....
Configuration of the column with cell/Value/Factory:
acceptedCol.setCellValueFactory(new PropertyValueFactory<>("accepted"));
acceptedCol.setCellFactory((TableColumn<Person, Boolean> p) -> {
CheckBoxTableCell<Person, Boolean> cell = new CheckBoxTableCell<>();
cell.getStyleClass().add("custom-cell");
cell.setAlignment(Pos.CENTER);
return cell;
});
Some custom style:
/**
* Just want to see an effect, doesn't matter what
*/
.custom-cell > .check-box {
-fx-background-color: blue;
}
.custom-cell > .check-box:selected {
-fx-background-color: red;
}
Related
We are running a JavaFX application that contains some editable table views. A new requested feature is: a button that adds a new row below the currently selected one and immediately starts to edit the first cell of the row.
We implemented this feature, which was not so complicated, but we experience a very strange behavior and after a couple of days investigating the issue we still have no idea what goes wrong.
What happens is that when one clicks the button it adds a new row but starts to edit to first cell not of the newly created row but on an arbitrary other row. Unfortunately, this issue is not 100% reproduceable. Sometimes it's working as expected but most often the row below the newly added row gets edited, but sometimes even completely different rows before and after the currently selected one.
Below you can find the source code of a stripped down version of a JavaFX TableView that can be used to see the issue. As already mentioned it is not 100% reproduceable. To see the issue you have to add a new row multiple times. Some times the issue occurs more often when scrolling the table up and down a couple of times.
Any help is appreciated.
Hint: we already played around with Platform.runlater() a lot, by placing the action implementation of the button inside a runlater(), but although the issue occurs less often then, it never disappeared completely.
The TableView:
package tableview;
import java.util.ArrayList;
import java.util.List;
import javafx.application.Application;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.event.ActionEvent;
import javafx.geometry.Insets;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.control.TableCell;
import javafx.scene.control.TableColumn;
import javafx.scene.control.TableView;
import javafx.scene.control.cell.PropertyValueFactory;
import javafx.scene.layout.VBox;
import javafx.scene.text.Font;
import javafx.stage.Stage;
import javafx.util.Callback;
#SuppressWarnings({ "rawtypes", "unchecked" })
public class SimpleTableViewTest extends Application {
private final ObservableList<Person> data = FXCollections.observableArrayList(createData());
private final TableView table = new TableView();
public static void main(String[] args) {
launch(args);
}
private static List<Person> createData() {
List<Person> data = new ArrayList<>();
for (int i = 0; i < 100; i++) {
data.add(new Person("Jacob", "Smith", "jacob.smith_at_example.com", "js_at_example.com"));
}
return data;
}
#Override
public void start(Stage stage) {
Scene scene = new Scene(new Group());
stage.setTitle("Table View Sample");
stage.setWidth(700);
stage.setHeight(550);
final Label label = new Label("Address Book");
label.setFont(new Font("Arial", 20));
// Create a customer cell factory so that cells can support editing.
Callback<TableColumn, TableCell> cellFactory = (TableColumn p) -> {
return new EditingCell();
};
// Set up the columns
TableColumn firstNameCol = new TableColumn("First Name");
firstNameCol.setMinWidth(100);
firstNameCol.setCellValueFactory(new PropertyValueFactory<Person, String>("firstName"));
firstNameCol.setCellFactory(cellFactory);
TableColumn lastNameCol = new TableColumn("Last Name");
lastNameCol.setMinWidth(100);
lastNameCol.setCellValueFactory(new PropertyValueFactory<Person, String>("lastName"));
lastNameCol.setCellFactory(cellFactory);
lastNameCol.setEditable(true);
TableColumn primaryEmailCol = new TableColumn("Primary Email");
primaryEmailCol.setMinWidth(200);
primaryEmailCol.setCellValueFactory(new PropertyValueFactory<Person, String>("primaryEmail"));
primaryEmailCol.setCellFactory(cellFactory);
primaryEmailCol.setEditable(false);
TableColumn secondaryEmailCol = new TableColumn("Secondary Email");
secondaryEmailCol.setMinWidth(200);
secondaryEmailCol.setCellValueFactory(new PropertyValueFactory<Person, String>("secondaryEmail"));
secondaryEmailCol.setCellFactory(cellFactory);
// Add the columns and data to the table.
table.setItems(data);
table.getColumns().addAll(firstNameCol, lastNameCol, primaryEmailCol, secondaryEmailCol);
table.setEditable(true);
// --- Here comes the interesting part! ---
//
// A button that adds a row below the currently selected one
// and immediatly starts editing it.
Button addAndEdit = new Button("Add and edit");
addAndEdit.setOnAction((ActionEvent e) -> {
int idx = table.getSelectionModel().getSelectedIndex() + 1;
data.add(idx, new Person());
table.getSelectionModel().select(idx);
table.edit(idx, firstNameCol);
});
final VBox vbox = new VBox();
vbox.setSpacing(5);
vbox.getChildren().addAll(label, table, addAndEdit);
vbox.setPadding(new Insets(10, 0, 0, 10));
((Group) scene.getRoot()).getChildren().addAll(vbox);
stage.setScene(scene);
stage.show();
}
}
The editable Table Cell:
package tableview;
import javafx.event.EventHandler;
import javafx.scene.control.ContentDisplay;
import javafx.scene.control.TableCell;
import javafx.scene.control.TextField;
import javafx.scene.input.KeyCode;
import javafx.scene.input.KeyEvent;
public class EditingCell extends TableCell<Person, String> {
private TextField textField;
public EditingCell() {
}
#Override
public void cancelEdit() {
super.cancelEdit();
setText(getItem());
setContentDisplay(ContentDisplay.TEXT_ONLY);
}
#Override
public void startEdit() {
super.startEdit();
if (textField == null) {
createTextField();
}
setGraphic(textField);
setContentDisplay(ContentDisplay.GRAPHIC_ONLY);
}
#Override
public void updateItem(String item, boolean empty) {
super.updateItem(item, empty);
if (empty) {
setText(null);
setGraphic(null);
} else {
if (isEditing()) {
if (textField != null) {
textField.setText(getString());
}
setGraphic(textField);
setContentDisplay(ContentDisplay.GRAPHIC_ONLY);
} else {
setText(getString());
setContentDisplay(ContentDisplay.TEXT_ONLY);
}
}
}
private void createTextField() {
textField = new TextField(getString());
textField.setMinWidth(this.getWidth() - this.getGraphicTextGap() * 2);
textField.setOnKeyPressed(new EventHandler<KeyEvent>() {
#Override
public void handle(KeyEvent t) {
if (t.getCode() == KeyCode.ENTER) {
commitEdit(textField.getText());
} else if (t.getCode() == KeyCode.ESCAPE) {
cancelEdit();
}
}
});
}
private String getString() {
return getItem() == null ? "" : getItem().toString();
}
}
A Data Bean:
package tableview;
import javafx.beans.property.SimpleStringProperty;
public class Person {
private final SimpleStringProperty firstName;
private final SimpleStringProperty lastName;
private final SimpleStringProperty primaryEmail;
private final SimpleStringProperty secondaryEmail;
public Person() {
this(null, null, null, null);
}
public Person(String firstName, String lastName, String primaryEmail, String secondaryEmail) {
this.firstName = new SimpleStringProperty(firstName);
this.lastName = new SimpleStringProperty(lastName);
this.primaryEmail = new SimpleStringProperty(primaryEmail);
this.secondaryEmail = new SimpleStringProperty(secondaryEmail);
}
public SimpleStringProperty firstNameProperty() {
return firstName;
}
public String getFirstName() {
return firstName.get();
}
public String getLastName() {
return lastName.get();
}
public String getPrimaryEmail() {
return primaryEmail.get();
}
public SimpleStringProperty getPrimaryEmailProperty() {
return primaryEmail;
}
public String getSecondaryEmail() {
return secondaryEmail.get();
}
public SimpleStringProperty getSecondaryEmailProperty() {
return secondaryEmail;
}
public SimpleStringProperty lastNameProperty() {
return lastName;
}
public void setFirstName(String firstName) {
this.firstName.set(firstName);
}
public void setLastName(String lastName) {
this.lastName.set(lastName);
}
public void setPrimaryEmail(String primaryEmail) {
this.primaryEmail.set(primaryEmail);
}
public void setSecondaryEmail(String secondaryEmail) {
this.secondaryEmail.set(secondaryEmail);
}
}
The correct code of the buttons action implementation has to look like below. The important line to fix the described issue is 'table.layout()'.
Many thanks to fabian!
addAndEdit.setOnAction((ActionEvent e) -> {
int idx = table.getSelectionModel().getSelectedIndex() + 1;
data.add(idx, new Person());
table.getSelectionModel().select(idx);
table.layout();
table.edit(idx, firstNameCol);
});
I've a JFXTreeTableView and i want to center the text of the data for each column.
there is one of my creating columns code :
JFXTreeTableColumn<TableData, String> DrinkColumn = new JFXTreeTableColumn<>("Drink");
DrinkColumn.setPrefWidth(100);
DrinkColumn.setCellValueFactory(new Callback<TreeTableColumn.CellDataFeatures<TableData, String>, ObservableValue<String>>() {
#Override
public ObservableValue<String> call(TreeTableColumn.CellDataFeatures<TableData, String> param) {
return param.getValue().getValue().Drink;
}
}
);
I don't use JFoenix, but using a standard TreeTableView, the following external CSS will center the text in tree table cells:
.tree-table-cell {
-fx-alignment: center ;
}
Here's a SSCCE (the code above goes in style.css):
import java.util.ArrayList;
import java.util.List;
import java.util.Random;
import javafx.application.Application;
import javafx.beans.property.IntegerProperty;
import javafx.beans.property.SimpleIntegerProperty;
import javafx.beans.property.SimpleStringProperty;
import javafx.beans.property.StringProperty;
import javafx.scene.Scene;
import javafx.scene.control.TreeItem;
import javafx.scene.control.TreeTableColumn;
import javafx.scene.control.TreeTableView;
import javafx.stage.Stage;
public class TreeTableViewTest extends Application {
#Override
public void start(Stage primaryStage) {
TreeTableView<Item> table = new TreeTableView<>();
TreeTableColumn<Item, String> col = new TreeTableColumn<>("Item");
col.setCellValueFactory(cellData -> cellData.getValue().getValue().nameProperty());
col.setPrefWidth(250);
table.getColumns().add(col);
TreeTableColumn<Item, Number> valueCol = new TreeTableColumn<>("Value");
valueCol.setCellValueFactory(cellData -> cellData.getValue().getValue().valueProperty());
valueCol.setPrefWidth(150);
table.getColumns().add(valueCol);
table.setRoot(createRandomTree(50));
Scene scene = new Scene(table);
scene.getStylesheets().add("style.css");
primaryStage.setScene(scene);
primaryStage.show();
}
private TreeItem<Item> createRandomTree(int nItems) {
Random rng = new Random();
TreeItem<Item> root = new TreeItem<>(new Item("Item 1", rng.nextInt(1000)));
root.setExpanded(true);
List<TreeItem<Item>> items = new ArrayList<>();
items.add(root);
for (int i = 2 ; i <= nItems ; i++) {
TreeItem<Item> item = new TreeItem<>(new Item("Item "+i, rng.nextInt(1000)));
item.setExpanded(true);
items.get(rng.nextInt(items.size())).getChildren().add(item);
items.add(item);
}
return root ;
}
public static class Item {
private final StringProperty name = new SimpleStringProperty();
private final IntegerProperty value = new SimpleIntegerProperty();
public Item(String name, int value) {
setName(name);
setValue(value);
}
public final StringProperty nameProperty() {
return this.name;
}
public final String getName() {
return this.nameProperty().get();
}
public final void setName(final String name) {
this.nameProperty().set(name);
}
public final IntegerProperty valueProperty() {
return this.value;
}
public final int getValue() {
return this.valueProperty().get();
}
public final void setValue(final int value) {
this.valueProperty().set(value);
}
}
public static void main(String[] args) {
launch(args);
}
}
If you want to center only specific columns, then use a cell factory on the column and set a CSS class or PseudoClass on the cell:
valueCol.setCellFactory(column -> {
TreeTableCell<Item, Number> cell = new TreeTableCell<Item, Number>() {
#Override
protected void updateItem(Number value, boolean empty) {
super.updateItem(value, empty);
if (empty) {
setText(null);
} else {
setText(value.toString());
}
}
};
cell.pseudoClassStateChanged(PseudoClass.getPseudoClass("centered"), true);
return cell ;
});
and modify the CSS accordingly:
.tree-table-cell:centered {
-fx-alignment: center ;
}
The latter version gives
I have TableView, and model class with only two property fields, name, and selected. I've tried to make TableCell with RadioButton that allows you to pick one and only one item. The problem is that when i click RadioButton it saves new value to the model class, but old value from unselected item is not overwriting, so i have two items with selected property true, but it displays like only one is selected. Here is my minimal executable code.
TableCell class RadioButtonTableCell.java
import javafx.geometry.Pos;
import javafx.scene.control.ContentDisplay;
import javafx.scene.control.RadioButton;
import javafx.scene.control.TableCell;
import javafx.scene.control.TableView;
import javafx.scene.layout.HBox;
import javax.swing.table.TableColumn;
public class RadioButtonTableCell extends TableCell<Model, Boolean> {
private RadioButton radioButton = new RadioButton();
private HBox hBox = new HBox();
public RadioButtonTableCell(javafx.scene.control.TableColumn<Model, Boolean> column) {
hBox.getChildren().add(radioButton);
hBox.setAlignment(Pos.CENTER);
radioButton.disableProperty().bind(column.editableProperty().not());
radioButton.setOnMouseEntered(event -> {
final TableView<Model> tableView = getTableView();
tableView.getSelectionModel().select(getTableRow().getIndex());
super.startEdit();
tableView.edit(tableView.getSelectionModel().getSelectedIndex(), column);
});
radioButton.selectedProperty().addListener((observable, oldValue, newValue) -> {
if (isEditing()) {
commitEdit(newValue);
}
});
setContentDisplay(ContentDisplay.GRAPHIC_ONLY);
}
#Override
protected void updateItem(Boolean item, boolean empty) {
super.updateItem(item, empty);
if (empty) setGraphic(null);
else {
radioButton.setSelected(item);
setContentDisplay(ContentDisplay.GRAPHIC_ONLY);
setGraphic(hBox);
}
}
public RadioButton getRadioButton() {
return this.radioButton;
}
}
Data model class Model.java
import javafx.beans.property.BooleanProperty;
import javafx.beans.property.SimpleBooleanProperty;
import javafx.beans.property.SimpleStringProperty;
import javafx.beans.property.StringProperty;
public class Model {
private StringProperty name = new SimpleStringProperty();
private BooleanProperty selected = new SimpleBooleanProperty();
public Model(String name, boolean selected) {
this.name.set(name);
this.selected.set(selected);
}
public BooleanProperty selectedProperty() {
return selected;
}
public StringProperty nameProperty() {
return name;
}
#Override
public String toString() {
return "Model{" +
"name=" + name +
", selected=" + selected +
'}';
}
}
Main class Main.java
import javafx.application.Application;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.scene.Scene;
import javafx.scene.control.*;
import javafx.stage.Stage;
public class Main extends Application {
#Override
public void start(Stage primaryStage) {
TableView<Model> tableView = new TableView<>();
tableView.setEditable(true);
ToggleGroup toggleGroup = new ToggleGroup();
TableColumn<Model, Boolean> selectedColumn = new TableColumn<>("selected");
selectedColumn.setCellValueFactory(item -> item.getValue().selectedProperty());
selectedColumn.setCellFactory(tableCell -> {
RadioButtonTableCell cell = new RadioButtonTableCell(selectedColumn);
toggleGroup.getToggles().add(cell.getRadioButton());
return cell;
});
selectedColumn.setEditable(true);
TableColumn<Model, String> nameColumn = new TableColumn<>("name");
nameColumn.setCellValueFactory(item -> item.getValue().nameProperty());
tableView.getColumns().addAll(nameColumn, selectedColumn);
Scene scene = new Scene(tableView);
ObservableList<Model> list = FXCollections.observableArrayList();
list.add(new Model("Alisa", true));
list.add(new Model("Bob", false));
list.add(new Model("Jonh", false));
list.add(new Model("Sam", false));
list.add(new Model("Maria", false));
tableView.setItems(list);
primaryStage.setScene(scene);
primaryStage.show();
primaryStage.setOnCloseRequest(event -> {
for (Model item : tableView.getItems()) {
System.out.println(item.toString());
}
});
}
public static void main(String[] args) {
launch(args);
}
}
I see in your custom TableCell an import to swing I didn't really got it why as I cannot see where do you use it, but I think that is not the problem. As I see, you never add them to a ToggleGroup, which groups them and if you select one of them the others will be deselected.
I wrote a simple example which uses RadioButtons in a TableCell, and I set for each RadioButton the ToggleGroup to handle the selection.
Here is te code for it:
public class Controller implements Initializable {
#FXML
private Label label;
#FXML
private TableView<MyModel> table;
#FXML
private TableColumn<MyModel, String> first;
#FXML
private TableColumn<MyModel, Boolean> second;
#Override
public void initialize(URL location, ResourceBundle resources) {
ToggleGroup toggleGroup = new ToggleGroup();
first.setCellValueFactory(data -> data.getValue().nameProperty());
second.setCellValueFactory(data -> data.getValue().selectedProperty());
second.setCellFactory(factory -> new RadioButtonTableCell(toggleGroup));
MyModel john = new MyModel("John");
MyModel andrew = new MyModel("Andrew");
table.getItems().addAll(john, andrew);
label.textProperty().bind(john.selectedProperty().asString()); // easy check if it works for the backing model.
}
private class MyModel {
private StringProperty name;
private BooleanProperty selected;
MyModel(String name) {
this.name = new SimpleStringProperty(name);
this.selected = new SimpleBooleanProperty(false);
}
StringProperty nameProperty() {
return name;
}
BooleanProperty selectedProperty() {
return selected;
}
}
private class RadioButtonTableCell extends TableCell<MyModel, Boolean> {
private RadioButton radioButton;
RadioButtonTableCell(ToggleGroup toggleGroup) {
this.radioButton = new RadioButton();
radioButton.setToggleGroup(toggleGroup);
// Since you don't edit the cell while select a radioButton, this is the simplest way to set the value to
// the backing model
radioButton.selectedProperty().addListener((observable, oldValue, newValue) ->
((MyModel) getTableRow().getItem()).selectedProperty().set(newValue));
}
#Override
protected void updateItem(Boolean item, boolean empty) {
super.updateItem(item, empty);
if (empty) {
setGraphic(null);
return;
}
setGraphic(radioButton);
}
}
}
I have TreeTableView with 2 columns, so I want to be able something like that:
user double click in cell -> Someclass.getType() returns type of editing field ->in cell I see this type of editing field(TextField or ChoiceBox)
wnen I need to use TextField only, i can use someshing like that
TreeColumn1.setCellFactory(TextFieldTreeTableCell.forTreeTableColumn());
TreeColumn1.setOnEditCommit(firstColumnCommitHandler);
commitHandler:
private EventHandler<TreeTableColumn.CellEditEvent<SomeClass, String>> firstColumnCommitHandler = event -> {
final SomeClass item = event.getRowValue().getValue();
item.setVariable(event.getNewValue());
};
but i need different types, and have no idea howto do this
For this you need to implement the table cell yourself, and display the appropriate components when you go in and out of editing state. Here's a basic idea. The ChoiceBoxs look odd, you may need to work with some CSS to get them looking correct. In this example, if the box in the first column is checked, the second column will use a ChoiceBox for editing; otherwise it will use a TextField.
import java.util.function.Function;
import java.util.stream.IntStream;
import javafx.application.Application;
import javafx.beans.property.BooleanProperty;
import javafx.beans.property.SimpleBooleanProperty;
import javafx.beans.property.SimpleStringProperty;
import javafx.beans.property.StringProperty;
import javafx.beans.value.ObservableValue;
import javafx.scene.Scene;
import javafx.scene.control.ChoiceBox;
import javafx.scene.control.ContentDisplay;
import javafx.scene.control.TableCell;
import javafx.scene.control.TableColumn;
import javafx.scene.control.TableView;
import javafx.scene.control.TextField;
import javafx.scene.control.cell.CheckBoxTableCell;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;
public class TableWithVaryingEditor extends Application {
#Override
public void start(Stage primaryStage) {
TableView<Item> table = new TableView<>();
table.setEditable(true);
IntStream.rangeClosed(1, 20).mapToObj(i -> new Item("Item "+i)).forEach(table.getItems()::add);
TableColumn<Item, Boolean> fixedCol = column("Fixed", Item::fixedProperty);
table.getColumns().add(fixedCol);
fixedCol.setCellFactory(CheckBoxTableCell.forTableColumn(fixedCol));
TableColumn<Item, String> nameCol = column("Name", Item::nameProperty);
table.getColumns().add(nameCol);
nameCol.setCellFactory(col -> new TableCell<Item, String>() {
private TextField textField = new TextField();
private ChoiceBox<String> choice = new ChoiceBox<>();
private boolean ignoreChoiceBoxChange = false ;
// anonymous constructor:
{
choice.valueProperty().addListener((obs, oldValue, newValue) -> {
if (! ignoreChoiceBoxChange) {
commitEdit(newValue);
}
});
choice.focusedProperty().addListener((obs, wasFocused, isNowFocused) -> {
if (! isNowFocused) {
cancelEdit();
}
});
choice.showingProperty().addListener((obs, wasShowing, isNowShowing) -> {
if (! isNowShowing) {
cancelEdit();
}
});
textField.setOnAction(e -> commitEdit(textField.getText()));
textField.focusedProperty().addListener((obs, wasFocused, isNowFocused) -> {
if (! isNowFocused) {
cancelEdit();
}
});
}
#Override
public void updateItem(String item, boolean empty) {
super.updateItem(item, empty);
if (isEditing()) {
updateEditor();
} else {
updateText();
}
}
#Override
public void startEdit() {
super.startEdit();
updateEditor();
}
#Override
public void cancelEdit() {
super.cancelEdit();
updateText();
}
#Override
public void commitEdit(String item) {
super.commitEdit(item);
updateText();
}
private void updateEditor() {
setContentDisplay(ContentDisplay.GRAPHIC_ONLY);
int index = getIndex();
Item item = getTableView().getItems().get(index);
if (item.isFixed()) {
ignoreChoiceBoxChange = true ;
choice.getItems().setAll(getItem(), "Choice 1", "Choice 2");
choice.getSelectionModel().select(getItem());
setGraphic(choice);
choice.show();
ignoreChoiceBoxChange = false ;
} else {
textField.setText(getItem());
setGraphic(textField);
}
}
private void updateText() {
setContentDisplay(ContentDisplay.TEXT_ONLY);
if (isEmpty()) {
setText(null);
} else {
setText(getItem());
}
}
});
primaryStage.setScene(new Scene(new BorderPane(table), 600, 400));
primaryStage.show();
}
private <S,T> TableColumn<S,T> column(String title, Function<S, ObservableValue<T>> property) {
TableColumn<S,T> col = new TableColumn<>(title);
col.setCellValueFactory(cellData -> property.apply(cellData.getValue()));
return col ;
}
public static class Item {
private final BooleanProperty fixed = new SimpleBooleanProperty();
private final StringProperty name = new SimpleStringProperty();
public Item(String name) {
setName(name);
}
public final BooleanProperty fixedProperty() {
return this.fixed;
}
public final boolean isFixed() {
return this.fixedProperty().get();
}
public final void setFixed(final boolean fixed) {
this.fixedProperty().set(fixed);
}
public final StringProperty nameProperty() {
return this.name;
}
public final String getName() {
return this.nameProperty().get();
}
public final void setName(final String name) {
this.nameProperty().set(name);
}
}
public static void main(String[] args) {
launch(args);
}
}
So I'm developing a "to-do list" application where there is a TableView containing the tasks to do and in my TableView there is a "deadline" column. I would like that if the deadline date of a task has been passed it makes that specific deadlines date red.
So if the user opens the app on the first of January/2015 and one of his tasks deadline was the 31st of December/2014, its corresponding deadline cell has its text colored in red.
The table is obviously associated to an ObservableList of "Task" objects which have an ObjectProperty "deadline" field.
How would I go about doing this?
Define a CSS PseudoClass to represent an overdue item. Use a cell factory that sets the pseudoclass state according to whether or not the deadline has passed. You didn't post any code, but the following should help:
TableColumn<Task, LocalDate> deadlineColumn = new TableColumn<>("Deadline");
deadlineColumn.setCellValueFactory( cellData -> cellData.getValue().deadlineProperty() ); // or similar...
PseudoClass overdue = PseudoClass.getPseudoClass("overdue");
deadlineColumn.setCellFactory(col -> new TableCell<Task, LocalDate>() {
#Override
public void updateItem(LocalDate deadline, boolean empty) {
super.updateItem(deadline, empty) ;
if (empty) {
pseudoClassStateChanged(overdue, false);
setText(null);
} else {
pseudoClassStateChanged(overdue, LocalDate.now().isAfter(deadline));
setText(deadline.toString());
}
}
});
And then in an external css file you can do
.table-cell:overdue {
-fx-text-fill: red ;
}
Update: here's a complete example, with the CSS shown above in a file called overdue.css:
import java.time.LocalDate;
import java.util.function.Function;
import javafx.application.Application;
import javafx.beans.property.ObjectProperty;
import javafx.beans.property.SimpleObjectProperty;
import javafx.beans.property.SimpleStringProperty;
import javafx.beans.property.StringProperty;
import javafx.beans.value.ObservableValue;
import javafx.css.PseudoClass;
import javafx.scene.Scene;
import javafx.scene.control.TableCell;
import javafx.scene.control.TableColumn;
import javafx.scene.control.TableView;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;
public class ToDoTable extends Application {
#Override
public void start(Stage primaryStage) {
TableView<ToDoItem> table = new TableView<>();
table.getColumns().add(createColumn("Name", ToDoItem::nameProperty));
TableColumn<ToDoItem, LocalDate> deadlineCol = createColumn("Deadline", ToDoItem::deadlineProperty);
PseudoClass overdue = PseudoClass.getPseudoClass("overdue");
deadlineCol.setCellFactory(col -> new TableCell<ToDoItem, LocalDate>() {
#Override
public void updateItem(LocalDate deadline, boolean empty) {
super.updateItem(deadline, empty);
if (empty) {
pseudoClassStateChanged(overdue, false);
setText(null);
} else {
pseudoClassStateChanged(overdue, LocalDate.now().isAfter(deadline));
setText(deadline.toString());
}
}
});
table.getColumns().add(deadlineCol);
for (int i=1; i <= 10; i++) {
LocalDate deadline = LocalDate.now().plusDays(i - 5);
ToDoItem item = new ToDoItem("Item "+i, deadline);
table.getItems().add(item);
}
BorderPane root = new BorderPane(table);
Scene scene = new Scene(root, 800, 600);
scene.getStylesheets().add("overdue.css");
primaryStage.setScene(scene);
primaryStage.show();
}
private static <S,T> TableColumn<S,T> createColumn(String title, Function<S, ObservableValue<T>> property) {
TableColumn<S,T> col = new TableColumn<>(title);
col.setCellValueFactory(cellData -> property.apply(cellData.getValue()));
return col ;
}
public static class ToDoItem {
private final StringProperty name = new SimpleStringProperty();
private final ObjectProperty<LocalDate> deadline = new SimpleObjectProperty<>();
public ToDoItem(String name, LocalDate deadline) {
this.name.set(name);
this.deadline.set(deadline);
}
public final StringProperty nameProperty() {
return this.name;
}
public final java.lang.String getName() {
return this.nameProperty().get();
}
public final void setName(final java.lang.String name) {
this.nameProperty().set(name);
}
public final ObjectProperty<LocalDate> deadlineProperty() {
return this.deadline;
}
public final java.time.LocalDate getDeadline() {
return this.deadlineProperty().get();
}
public final void setDeadline(final java.time.LocalDate deadline) {
this.deadlineProperty().set(deadline);
}
}
public static void main(String[] args) {
launch(args);
}
}