JavaFX: DataBinding mit FXML

Der letzte Beitrag meiner Blog-Serie „JavaFX mit FXML programmieren“ umfasst das Thema DataBinding. Als DataBinding bezeichnet man die Verbindung zweier Variablen. Dabei kann die Verbindung unidirektional (in eine Richtung) oder bidirektional (in beider Richtungen) sein.
Allgemein werden DataBindings typischerweise im Viewmodel verwendet und in Form von Property-Variablen realisiert. Adam Bien hat dafür ein sehr kurzes und einfaches Tutorial geschrieben:

Adam Bien Ansatz

Wer Adam Bien kennt, weis dass er nicht um den heißen Brei rumerzählt. Taten statt Worte;-)
Hier ist seine Erklärung von DataBinding in Form eines JUnit Tests:

import javafx.beans.property.SimpleStringProperty;
import javafx.beans.property.StringProperty;
import static org.hamcrest.CoreMatchers.is;
import static org.junit.Assert.assertThat;
import org.junit.Test;

public class StringDataBindingTest {
    
    @Test
    public void bindUnidirectionally(){
        String expected = "DukeFX";

        StringProperty from = new SimpleStringProperty();
        StringProperty to = new SimpleStringProperty();

        to.bind(from);

        from.set(expected);

        String actual = to.get();

        assertThat(actual,is(expected));
    }
} 

Was haben wir gelernt? Wenn man zwei Property-Variablen mit der Methode „.bind()“ oder „.bindBidirectional()“ verbindet, verweisen beide Variablen auf den gleichen Inhalt. Vergleichbar ist das Verhalten mit Pointern in C++:

int  expected = 5;
int* from, to;

from = &expected;
to   = &expected;

Der Unterschied zwischen „.bind()“ und „.bindBidirectional()“ ist, dass bei „x.bind(y)“ eine „java.lang.RuntimeException: A bound value cannot be set.“ Exception fliegt, wenn „x“ geändert wird.

Was gibt es für Properties?

Neben unidirektional und bidirektional, muss man auch die richtige Property einsetzen. Properties sind eigentlich Interfaces, die nicht erzeugt werden können. Hierfür gibt es die Simple*-Klassen:

Das Programm

Ihr habt die Theorie überstanden! Nun geht es in die Praxis – mein Beispiel-Programm besteht aus 3 Dateien:

• Die Start-Klasse: zum initialisieren der JavaFX-Anwendung
• Die Controller-Klasse: Handling der DataBindings
• und die FXML-View: Definition der View

Am wichtigsten ist die Controller-Klasse!!!

Start-Klasse

Die FXML-View

Controller-Klasse

In Zeile 15 initialisiere ich die StringProperty mit dem Wert „Alexander“. Dieser Wert wird dann in der Oberfläche angezeigt.
In Zeile 23 bzw. 28 definiere ich die DataBindings. Drückt man jetzt auf einen der Buttons wird jeweils einer der Werte geändert und beide ausgegeben.

package de.axxg.fxml;

import javafx.beans.property.SimpleStringProperty;
import javafx.beans.property.StringProperty;
import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.scene.control.TextField;
import javafx.scene.input.MouseEvent;

public class Controller {

	@FXML
	private TextField vornameTF;

	private StringProperty vorname = new SimpleStringProperty("Alexander");
	
	
	// Diese Methode wird nach dem Inject aufgerufen!
	public void initialize(){	
		// nur vorname kann vornameTF aktuallisieren
		// ansonsten kommt eine Exception
		// java.lang.RuntimeException: A bound value cannot be set.
		vornameTF.textProperty().bind(vorname);
		
		// oder
		
		// Beide Seiten aktuallisieren sich
		vornameTF.textProperty().bindBidirectional(vorname);
	}
	
	@FXML
	protected void go(ActionEvent event) {
		vorname.setValue("Peter");
		
		System.out.println("Stringprop.: " + vorname.getValue());
		System.out.println("Textfeld: " + vornameTF.getText());
	}

	@FXML
	protected void enter(MouseEvent event) {
		vornameTF.setText("Die Maus ist über den Button!");
		
		System.out.println("Stringprop.: " + vorname.getValue());
		System.out.println("Textfeld: " + vornameTF.getText());
	}
}

Die Ausgabe könnte so aussehen:

Stringprop.: Peter
Textfeld: Peter
Stringprop.: Die Maus ist über den Button!
Textfeld: Die Maus ist über den Button!
Stringprop.: Die Maus ist über den Button!
Textfeld: Die Maus ist über den Button!
Stringprop.: Peter
Textfeld: Peter

Download

Für Faule gibt es hier ein fertiges Projekt…

Java Version	JDK 1.7.0_11	Inhalt	gepacktes Projekt
JavaFX Version	2.2.4	Größe	4.018 KB (~4 MB)
IDE	Eclipse IDE Version 3.8.1	Endung	*.zip
Preis	kostenlos	Lizenz

Blog-Serie

Dieser Beitrag ist ein Teil meiner Serie zu „JavaFX mit FXML programmieren„. In dieser Serie berichte, wie man in die Entwicklung mit FXML einsteigen und effektiv arbeiten kann. Weitere Beiträge sind:

• Quickstart mit FXML
• Controller, Events und UI-Elemente mit FXML
• @PostConstruct für FXML
• DataBinding mit FXML

Die Quellen und weiterführende Links

• Adam Bien’s Beispiel
• Oracle Doku 1
• Oracle Doku 2

Copyright © 2013 AxxG – Alexander Gräsel