{"id":1650,"date":"2014-11-04T17:10:07","date_gmt":"2014-11-04T16:10:07","guid":{"rendered":"http:\/\/www.jensd.de\/wordpress\/?p=1650"},"modified":"2015-11-22T20:54:18","modified_gmt":"2015-11-22T19:54:18","slug":"properties-extractor-best-way-to-make-the-listview-instantly-updating-its-elements","status":"publish","type":"post","link":"https:\/\/www.jensd.de\/wordpress\/?p=1650","title":{"rendered":"Properties Extractor: Best way to get the ListView instantly updating its elements"},"content":{"rendered":"

This post is about how to deal with JavaFX ListViews and TableViews and how these controls are getting informed about changed content of the contained elements.
\nI wonder why I didn’t find anything about the following pattern in the relevant books as this is a really crucial mechanism.
\nMany posts out there suggest to force triggering a ChangeEvent getting a ListView to refresh by calling
\n
\nlist.remove(POJO);
\nlist.add(index,POJO);
\n<\/code>
\nafter each commited change! Brrr ;-)!<\/p>\n

But there is a much better way:<\/strong>
\nEnable your list to report changes on the element by providing an properties extractor.<\/p>\n

The Demo App<\/strong>
\nI have created a small demo app to play with for giving it a try.
\nBasically two TableViews and one ListView all sharing the same data.
\nTo change properties of the elements one TableView is editable:
\n\"PropertiesExtractor<\/a><\/p>\n

The DataModel<\/strong><\/p>\n

The compulsive PersonBean folling the JavaFX Bean Pattern\/Convention<\/a><\/strong>
\n[java]
\npublic class PersonBean {<\/p>\n

private StringProperty firstName;
\n private StringProperty lastName;
\n private ObjectProperty birthday;
\n private ObjectBinding age;<\/p>\n

public PersonBean() {
\n }<\/p>\n

public PersonBean(String firstName, String lastName, LocalDate birthday) {
\n setFirstName(firstName);
\n setLastName(lastName);
\n setBirthday(birthday);
\n }<\/p>\n

public final StringProperty firstNameProperty() {
\n if (firstName == null) {
\n firstName = new SimpleStringProperty();
\n }
\n return firstName;
\n }<\/p>\n

public final String getFirstName() {
\n return firstNameProperty().get();
\n }<\/p>\n

public final void setFirstName(final java.lang.String firstName) {
\n firstNameProperty().set(firstName);
\n }<\/p>\n

public final StringProperty lastNameProperty() {
\n if (lastName == null) {
\n lastName = new SimpleStringProperty();
\n }
\n return lastName;
\n }<\/p>\n

public final java.lang.String getLastName() {
\n return lastNameProperty().get();
\n }<\/p>\n

public final void setLastName(final java.lang.String lastName) {
\n lastNameProperty().set(lastName);
\n }<\/p>\n

public final ObjectProperty birthdayProperty() {
\n if (birthday == null) {
\n birthday = new SimpleObjectProperty<>();
\n }
\n return birthday;
\n }<\/p>\n

public final LocalDate getBirthday() {
\n return birthdayProperty().get();
\n }<\/p>\n

public final void setBirthday(final java.time.LocalDate birthday) {
\n birthdayProperty().set(birthday);<\/p>\n

}<\/p>\n

public String stringValue() {
\n return String.format(“%s %s %s”, getFirstName(), getLastName(), getBirthday().format(DateTimeFormatter.ISO_LOCAL_DATE));
\n }<\/p>\n

public final ObjectBinding ageBinding() {
\n if (age == null) {
\n age = new ObjectBinding() {
\n {
\n bind(birthdayProperty());
\n }<\/p>\n

@Override
\n protected Long computeValue() {
\n if (getBirthday() == null) {
\n return null;
\n }
\n return getBirthday().until(LocalDate.now(), ChronoUnit.YEARS);
\n }
\n };
\n }
\n return age;
\n }<\/p>\n

public static Callback extractor() {
\n return (PersonBean p) -> new Observable[]{p.lastNameProperty(), p.firstNameProperty(), p.birthdayProperty(), p.ageBinding()};
\n }
\n}
\n[\/java]<\/p>\n

DataModel containing a List of randomly created PersonBeans:
\n[java]
\npublic class DataModel {<\/p>\n

private ObservableList personFXBeans;<\/p>\n

public DataModel() {
\n init();
\n }<\/p>\n

private void init() {
\n personFXBeans = DataSource.getRandomPersonBeansList(100);
\n }<\/p>\n

public ObservableList getPersonFXBeans() {
\n return personFXBeans;
\n }
\n}
\n[\/java]<\/p>\n

As you may know to assign a DataModel e.g. to a TableView or a ListView in JavaFX you just have to use the setItems(ObvervableList) method.<\/p>\n

[java]
\n@FXML
\npublic void onFillWithDemoDataFXBeans() {
\n readOnlyListView.setItems(model.getPersonFXBeans());
\n readOnlyTableView.setItems(model.getPersonFXBeans());
\n editableTableView.setItems(model.getPersonFXBeans());
\n}
\n[\/java]<\/p>\n

Now getting a TableView informed about property changes of contained elements is already done you for by the binding either in two ways:
\nvia a PropertyValueFactory<\/strong><\/code> and by more or less direct property binding:<\/p>\n

[java]
\nreadOnlyFirstNameColumn.setCellValueFactory(new PropertyValueFactory<>(“firstName”));
\nreadOnlyLastNameColumn.setCellValueFactory(new PropertyValueFactory<>(“lastName”));
\nreadOnlyBirthdayColumn.setCellValueFactory(new PropertyValueFactory<>(“birthday”));
\nreadOnlyAgeColumn.setCellValueFactory(i -> i.getValue().ageBinding());<\/p>\n

editableFirstNameColumn.setCellValueFactory(i -> i.getValue().firstNameProperty());
\neditableLastNameColumn.setCellValueFactory(i -> i.getValue().lastNameProperty());
\neditableBirthdayColumn.setCellValueFactory(i -> i.getValue().birthdayProperty());
\nageColumn.setCellValueFactory(i -> i.getValue().ageBinding());
\n[\/java]<\/p>\n

But the ListView basically only observes the list and not the properties of each element of that list.<\/p>\n

When using a ObservableList created by FXCollections.observableArrayList() the ListView will only refresh on ListChange Events like remove() an add() of elements. Therefore
\n
\nlist.remove(POJO);
\nlist.add(index,POJO);
\n<\/code>
\nafter each commited change.<\/p>\n

But there is a much better way:<\/strong>
\nEnable your list to report changes on the element by providing an properties extractor.
\nYou don’t have to care about refreshing then!<\/p>\n

ObservableList persons = FXCollections.observableArrayList(PersonBean.extractor()<\/em>);
\n<\/strong><\/code><\/p>\n

See DataSource.getRandomPersonBeansList(int length)<\/strong><\/code>:<\/p>\n

[java]
\npublic static ObservableList<PersonBean> getRandomPersonBeansList(int length) {
\n ObservableList<PersonBean> persons = FXCollections.observableArrayList(PersonBean.extractor());
\n for (int i = 0; i < length; i++) {
\n persons.add(new PersonBean(getRandomName(), getRandomLastname(), getRandomLocalDate()));
\n }
\nreturn persons;
\n}
\n[\/java]<\/p>\n

This Extrator is basically a Callback containing an array of Obvervables which are then observed by the Obervablelist (more precicely: ObservableListWrapper):<\/p>\n

My PersonBean<\/strong><\/code> already provides it’s extrator callback:<\/p>\n

[java]
\npublic static Callback<PersonBean, Observable[]> extractor() {
\n return (PersonBean p) -> new Observable[]{p.lastNameProperty(), p.firstNameProperty(), p.birthdayProperty(), p.ageBinding()};
\n}
\n[\/java]<\/p>\n

Following this pattern all controls are updated instantly after applying the change.<\/p>\n

Edit data…<\/strong>
\n\"PropertiesExtractor<\/a><\/p>\n

and commit:<\/strong>
\n\"PropertiesExtractor<\/a><\/p>\n

THE CODE PLEASE! <\/strong>
\nYou can find the complete code at my BitBucket Repo<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"

This post is about how to deal with JavaFX ListViews and TableViews and how these controls are getting informed about changed content of the contained elements. I wonder why I didn’t find anything about the following pattern in the relevant books as this is a really crucial mechanism. Many posts out there suggest to force… <\/span>Continue Reading Properties Extractor: Best way to get the ListView instantly updating its elements<\/span><\/i><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"footnotes":"","_jetpack_memberships_contains_paid_content":false,"jetpack_publicize_message":"Properties Extractor - Best way to make the ListView instantly updating its elements http:\/\/wp.me\/p38FCL-qC","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","enabled":false},"version":2}},"categories":[51,52,10,4,8,7,49],"tags":[107,108,85,76,39,62,105],"jetpack_publicize_connections":[],"aioseo_notices":[],"jetpack_featured_media_url":"","jetpack_shortlink":"https:\/\/wp.me\/p38FCL-qC","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.jensd.de\/wordpress\/index.php?rest_route=\/wp\/v2\/posts\/1650"}],"collection":[{"href":"https:\/\/www.jensd.de\/wordpress\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.jensd.de\/wordpress\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.jensd.de\/wordpress\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.jensd.de\/wordpress\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1650"}],"version-history":[{"count":34,"href":"https:\/\/www.jensd.de\/wordpress\/index.php?rest_route=\/wp\/v2\/posts\/1650\/revisions"}],"predecessor-version":[{"id":2214,"href":"https:\/\/www.jensd.de\/wordpress\/index.php?rest_route=\/wp\/v2\/posts\/1650\/revisions\/2214"}],"wp:attachment":[{"href":"https:\/\/www.jensd.de\/wordpress\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1650"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.jensd.de\/wordpress\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1650"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.jensd.de\/wordpress\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1650"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}