I m trying to implement a Paginated TableView that allows sorting by all items in JavaFX. I implemented the paginated tableview from here: https://stackoverflow.com/a/25424208/12181863. provided by jewelsea and tim buthe.
I was thinking that because the table view is only accessing a sublist of items, i wanted to extend the sorting from the table columns to the full list based on what i understand on the section about sorting on the Java Docs: https://docs.oracle.com/javase/8/javafx/api/javafx/scene/control/TableView.html#setItems-javafx.collections.ObservableList-
// bind the sortedList comparator to the TableView comparator
//i m guessing it extends the sorting from the table to the actual list?
sortedList.comparatorProperty().bind(tableView.comparatorProperty());
and then refresh the tableview for the same sublist indexes (which should now be sorted since the whole list is sorted).
Basically, I want to use the table column comparator to sort the full list, and then "refresh" the tableview using the new sorted list. Is this feasible? Or is there a simpler way to go about this?
I also referred to other reference material such as : https://incepttechnologies.blogspot.com/p/javafx-tableview-with-pagination-and.html but i found it hard to understand since everything was all over the place with vague explanation.
A quick extract of the core components in my TouchDisplayEmulatorController class
import javafx.beans.property.SimpleStringProperty;
import javafx.collections.FXCollections;
import javafx.scene.Node;
import javafx.scene.Scene;
import javafx.scene.control.Pagination;
import javafx.scene.control.TableCell;
import javafx.scene.control.TableColumn;
import javafx.scene.control.TableView;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.GridPane;
import javafx.scene.paint.Color;
import javafx.stage.Stage;
import javafx.util.Callback;
import java.util.ArrayList;
import java.util.List;
public class TouchDisplayEmulatorController extends Application {
public TableView sensorsTable;
public List<Sensor> sensors;
public int rowsPerPage = 14;
public GridPane grids = new GridPane();
public long timenow;
public void start(final Stage stage) throws Exception {
grids = new GridPane();
setGridPane();
Scene scene = new Scene(grids, 1024, 768);
stage.setScene(scene);
stage.setTitle("Table pager");
stage.show();
}
//public static void main(String[] args) throws Exception {
// launch(args);
//}
public void setGridPane(){
processSensors();
sensorsGrid();
}
public void sensorsGrid(){
buildTable();
int numOfPages = 1;
if (sensors.size() % rowsPerPage == 0) {
numOfPages = sensors.size() / rowsPerPage;
} else if (sensors.size() > rowsPerPage) {
numOfPages = sensors.size() / rowsPerPage + 1;
}
Pagination pagination = new Pagination((numOfPages), 0);
pagination.setPageFactory(this::createPage);
pagination.setMaxPageIndicatorCount(numOfPages);
grids.add(pagination, 0, 0);
}
private Node createPage(int pageIndex) {
int fromIndex = pageIndex * rowsPerPage;
int toIndex = Math.min(fromIndex + rowsPerPage, sensors.size());
sensorsTable.setItems(FXCollections.observableArrayList(sensors.subList(fromIndex, toIndex)));
return new BorderPane(sensorsTable);
}
public void processSensors(){
sensors = new ArrayList<>();
// long timenow = OffsetDateTime.now(ZoneOffset.UTC).toInstant().toEpochMilli()/1000;
// StringTokenizer hildetoken = new StringTokenizer(msg);
for (int i=0; i<20; i++) {
sensors.add(new Sensor(String.valueOf(i), "rid-"+i, "sid-"+i, "0", "0", "no condition"));
}
}
public void buildTable() {
sensorsTable = new TableView();
TableColumn<Sensor, String> userid = new TableColumn<>("userid");
userid.setCellValueFactory(param -> param.getValue().userid);
userid.setPrefWidth(100);
TableColumn<Sensor, String> resourceid = new TableColumn<>("resourceid");
resourceid.setCellValueFactory(param -> param.getValue().resourceid);
resourceid.setPrefWidth(100);
TableColumn<Sensor, String> column1 = new TableColumn<>("sid");
column1.setCellValueFactory(param -> param.getValue().sid);
column1.setPrefWidth(100);
TableColumn<Sensor, String> column2 = new TableColumn<>("timestamp");
column2.setCellValueFactory(param -> param.getValue().timestamp);
column2.setPrefWidth(100);
TableColumn<Sensor, String> column3 = new TableColumn<>("reading");
column3.setCellValueFactory(param -> param.getValue().reading);
column3.setPrefWidth(100);
TableColumn<Sensor, String> column4 = new TableColumn<>("last contacted");
column4.setCellFactory(new Callback<TableColumn<Sensor, String>, TableCell<Sensor, String>>() {
@Override
public TableCell<Sensor, String> call(TableColumn<Sensor, String> sensorStringTableColumn) {
return new TableCell<Sensor, String>() {
public void updateItem(String item, boolean empty) {
super.updateItem(item, empty);
if (!isEmpty()) {
this.setTextFill(Color.WHITE);
if (item.contains("@")) {
this.setTextFill(Color.BLUEVIOLET);
} else if (item.equals("> 8 hour ago")) {
this.setStyle("-fx-background-color: red;");
} else if (item.equals("< 8 hour ago")) {
this.setStyle("-fx-background-color: orange;");
//this.setTextFill(Color.ORANGE);
} else if (item.equals("< 4 hour ago")) {
this.setStyle("-fx-background-color: yellow;");
this.setTextFill(Color.BLACK);
} else if (item.equals("< 1 hour ago")) {
this.setStyle("-fx-background-color: green;");
//this.setTextFill(Color.GREEN);
}
setText(item);
}
}
};
}
});
column4.setCellValueFactory(param -> param.getValue().condition);
column4.setPrefWidth(100);
sensorsTable.getColumns().addAll(userid, resourceid, column1, column2, column3, column4);
}
}
class Sensor {
public SimpleStringProperty userid;
public SimpleStringProperty resourceid;
public SimpleStringProperty sid;
public SimpleStringProperty timestamp;
public SimpleStringProperty reading;
public SimpleStringProperty condition;
public Sensor(String userid, String resourceid, String sid, String timestamp, String reading, String condition){
this.userid = new SimpleStringProperty(userid);
this.resourceid = new SimpleStringProperty(resourceid);
this.sid = new SimpleStringProperty(sid);
this.timestamp = new SimpleStringProperty(timestamp);
this.reading = new SimpleStringProperty(reading);
this.condition = new SimpleStringProperty(condition);
//we can use empty string or condition 3 here
}
public Sensor(String sid, String timestamp, String reading, String condition){
this.userid = new SimpleStringProperty("-1");
this.resourceid = new SimpleStringProperty("-1");
this.sid = new SimpleStringProperty(sid);
this.timestamp= new SimpleStringProperty(timestamp);
this.reading= new SimpleStringProperty(reading);
this.condition = new SimpleStringProperty(condition);
}
public String getUserid() { return this.userid.toString(); }
public String getResourceid() { return this.resourceid.toString(); }
public String getSid() { return this.sid.toString(); }
public String getTimestamp() { return this.timestamp.toString(); }
public String getReading() { return this.reading.toString(); }
public String getCondition() { return this.condition.toString(); }
public String toString() { return "userid: "+getUserid()+" resourceid: "+getResourceid()+" sid: "+getSid()+
"\ntimestamp: "+getTimestamp()+" reading: "+getReading()+" condition: "+getCondition();}
}
separate class:
public class tester {
public static void main(String[] args) {
Application.launch(TouchDisplayEmulatorController.class, args);
}
}
First off, it's not clear that Pagination
is the correct control for this, although the UI for page selection is really nice. Your problems might stem from the fact that you're putting the TableView
into a new BorderPane
each time, or it might come from the fact that you're using TableView.setItems()
.
An approach that works is to use FilteredList
to handle the pagination, and just keep the TableView
as a static element in the layout, not in the dynamic graphic area of the Pagination. To satisfy the need to have the Pagination
do something, a Text
with the page number was created.
A new property was added to Sensor - ordinalNumber
. This is used to control the filter for the paging. The filter will dynamically change to select only those Sensor's with an ordinalNumber
in a particular range. The range is controlled by the Pagination's currentPageIndexProperty
. There's a listener on that property that regenerates the FilteredList
's predicate property each time the page is changed.
That handles the page changes, but what about sorting the whole list? First, the FilteredList
is wrapped in a SortedList
, and it's the SortedList
that's set into the TableView
. The SortedList
's Comparator
is bound to the TableView
's Comparator
.
But the SortedList
only sees the Sensors included under the current filter. So a listener was added to the TableView
's comparatorProperty
. The action for this listener Streams the underlying ObservableList
, sorts it using the new Comparator
, and resets each Sensor's ordinalNumber
according to the new sort order.
Finally, in order to have the FilteredList
re-evaluate the ObservableList
, these ordinalNumber
changes need to trigger a ListChange
event. So an extractor was added to the ObservableList
based on the ordinalNumber
.
The result works pretty well, except for the goofy page numbering Text
sliding onto the screen with each page change.
The entire code was cleaned up for readability and unused stuff was stripped out to keep the example minimal.
Here's the Sensor class:
class Sensor {
public SimpleStringProperty userid;
public SimpleStringProperty resourceid;
public SimpleStringProperty sid;
public SimpleStringProperty timestamp;
public SimpleStringProperty reading;
public IntegerProperty ordinalNumber = new SimpleIntegerProperty(0);
public Sensor(int userid, String resourceid, String sid, String timestamp, String reading, String condition) {
this.userid = new SimpleStringProperty(Integer.toString(userid));
this.resourceid = new SimpleStringProperty(resourceid);
this.sid = new SimpleStringProperty(sid);
this.timestamp = new SimpleStringProperty(timestamp);
this.reading = new SimpleStringProperty(reading);
this.ordinalNumber.set(userid);
}
}
Here's the layout code:
public class PaginationController extends Application {
public TableView<Sensor> sensorsTable = new TableView<>();
public ObservableList<Sensor> sensorObservableList = FXCollections.observableArrayList(sensor -> new Observable[]{sensor.ordinalNumber});
public FilteredList<Sensor> sensorFilteredList = new FilteredList<>(sensorObservableList);
public SortedList<Sensor> sensorSortedList = new SortedList<>(sensorFilteredList);
public IntegerProperty currentPage = new SimpleIntegerProperty(0);
public int rowsPerPage = 14;
public void start(final Stage stage) throws Exception {
processSensors();
stage.setScene(new Scene(buildScene(), 1024, 768));
stage.setTitle("Table pager");
stage.show();
}
public Region buildScene() {
buildTable();
int numOfPages = calculateNumOfPages();
Pagination pagination = new Pagination((numOfPages), 0);
pagination.setPageFactory(pageIndex -> {
Text text = new Text("This is page " + (pageIndex + 1));
return text;
});
pagination.setMaxPageIndicatorCount(numOfPages);
currentPage.bind(pagination.currentPageIndexProperty());
sensorFilteredList.predicateProperty().bind(Bindings.createObjectBinding(() -> createPageFilter(pagination.getCurrentPageIndex()), pagination.currentPageIndexProperty()));
return new VBox(sensorsTable, pagination);
}
@NotNull
private Predicate<Sensor> createPageFilter(int currentPage) {
int lowerLimit = (currentPage) * rowsPerPage;
int upperLimit = (currentPage + 1) * rowsPerPage;
return sensor -> (sensor.ordinalNumber.get() >= lowerLimit) &&
(sensor.ordinalNumber.get() < upperLimit);
}
private int calculateNumOfPages() {
int numOfPages = 1;
if (sensorObservableList.size() % rowsPerPage == 0) {
numOfPages = sensorObservableList.size() / rowsPerPage;
} else if (sensorObservableList.size() > rowsPerPage) {
numOfPages = sensorObservableList.size() / rowsPerPage + 1;
}
return numOfPages;
}
public void processSensors() {
Random random = new Random();
for (int i = 0; i < 60; i++) {
sensorObservableList.add(new Sensor(i, "rid-" + i, "sid-" + i, Integer.toString(random.nextInt(100)), "0", "no condition"));
}
}
public void buildTable() {
addStringColumn("userid", param1 -> param1.getValue().userid);
addStringColumn("resourceid", param1 -> param1.getValue().resourceid);
addStringColumn("sid", param1 -> param1.getValue().sid);
addStringColumn("timestamp", param1 -> param1.getValue().timestamp);
addStringColumn("reading", param1 -> param1.getValue().reading);
TableColumn<Sensor, Number> ordinalCol = new TableColumn<>("ordinal");
ordinalCol.setCellValueFactory(param -> param.getValue().ordinalNumber);
ordinalCol.setPrefWidth(100);
sensorsTable.getColumns().add(ordinalCol);
sensorsTable.setItems(sensorSortedList);
sensorSortedList.comparatorProperty().bind(sensorsTable.comparatorProperty());
sensorSortedList.comparatorProperty().addListener(x -> renumberRecords());
}
private void renumberRecords() {
AtomicInteger counter = new AtomicInteger(0);
Comparator<Sensor> newValue = sensorsTable.getComparator();
if (newValue != null) {
sensorObservableList.stream().sorted(newValue).forEach(sensor -> sensor.ordinalNumber.set(counter.getAndIncrement()));
} else {
sensorObservableList.forEach(sensor -> sensor.ordinalNumber.set(counter.getAndIncrement()));
}
}
@NotNull
private void addStringColumn(String columnTitle, Callback<TableColumn.CellDataFeatures<Sensor, String>, ObservableValue<String>> callback) {
TableColumn<Sensor, String> column = new TableColumn<>(columnTitle);
column.setCellValueFactory(callback);
column.setPrefWidth(100);
sensorsTable.getColumns().add(column);
}
}
For demonstration purposes, the timestamp field in the Sensor was initialized to a random number so that it would give an obvious change when that column was sorted. Also, the ordinalNumber field was added to the table so that it could be easily verified that they had been re-evaluated when a new sort column was chosen.