Visual Live Bindings
Verbindung zwischen GUI-Komponenten
Wir beginnen direkt mit einem einfachen Beispiel, um einen Eindruck von den Möglichkeiten der Visual Live Bindings zu bekommen. Ein Wort noch vorweg: Die Visual Live Bindings gibt es sowohl für die VCL als auch für FireMonkey. Wir beginnen hier mit einer VCL-Anwendung.
Jetzt zu dem Beispiel. Es geht darum, Komponenten per Klick auf eine Checkbox zu deaktivieren. Dazu benötigen wir eine neue VCL-Anwendung mit beispielsweise einem TEdit und einem TButton – und einer TCheckbox natürlich.
Ohne Live Bindings hätten wir das OnClick-Ereignis der Checkbox implementiert und darin alle Komponenten einzeln auf Enabled := false gesetzt. Jetzt verwenden wir hingegen den Live Bindings Designer dafür. Um diesen zu öffnen gibt es mehrere Möglichkeiten:
Rechtsklick auf das Formular und Auswählen von „Visuell binden…“ oder Menü „Ansicht“ – „LiveBindings-Designer“.
Beim Öffnen des LiveBindings-Designers werden direkt alle sichtbaren Komponenten (Checkbox, Button und Edit) jeweils als Kästchen dargestellt. In jedem Kästchen steht als erstes der Name der Komponente, darunter folgt eine oder ggf. mehrere Komponenten, die sich für LiveBindings besonders eignen. Wer doch lieber eine andere Property verknüpfen möchte, klickt auf die drei Punkte und erhält daraufhin ein Dialogfenster mit einer Liste aller „bindbaren Members“.
Die Kästchen im Designer lassen sich beliebig positionieren. Wir ziehen sie etwas auseinander, um sie einfacher verknüpfen zu können. Wie schon erwähnt, soll die Eigenschaft „Enable“ von Edit1 und Button1 mit der Checked-Eigenschaft von Checkbox1 verbunden werden. Die Properties lassen sich direkt per Maus miteinander verbinden. Man klickt auf eine Property (z.B. Checked) und zieht eine Linie zu einer anderen Property, die sich automatisch anpassen soll, wenn sich die Start-Property ändert. Während man die Maustaste gedrückt hält, sieht man, wie sich die Farben der unter dem Cursor liegenden Properties verändern. Rot signalisiert, dass keine Verbindung möglich ist, z.B. wegen unterschiedlicher Datentypen, grün ist ok. In unserem Fall müssen wir auf die drei Punkte ziehen, weil die Property Enabled gar nicht dargestellt wird.
Wer genau aufgepasst hat, findet auf seinem Formular nun die Komponente BindingsList1. Auf diese kommen wir später noch zu sprechen. Für den Moment genügt das Pfeile-Ziehen mit der Maus. Wir starten unsere kleine Anwendung und probieren die Checkbox aus. Alles funktioniert – und das ohne eine Zeile Code!