Da sich die UI-Komponenten in ihrer Fähigkeit Daten anzuzeigen zum Teil stark unterscheiden, stehen in RapidClipse 3 verschiedene Daten-Container Typen zur Verfügung:

...

Container 

Ein Container kann eine Liste mit beliebig vielen Datensätzen (BeanItems) aufnehmen. RapidClipse bietet mit dem XdevLazyEntityContainer und dem XdevBeanItemContainer 2 verschiedene Container-Varianten.

Image Removed

...

Der XdevLazyEntityContainer ist eine Erweiterung von Container.

• Wird i.d.R. nur von RapidClipse intern verwendet, wenn Property > Auto query data selektiert wird.
  Image Removed

• Bietet Lazy-Loading zwischen Datenbank und Server. Es werden immer nur so viele Datensätze zwischen Datenbank und Server übertragen, wie vom Client durch Scrollen oder Paging angefordert werden.

• Nimmt keine dynamischen SQLs entgegen (automatisch immer SELECT * FROM ...)
• Manuelles Hinzufügen von BeanItems nicht möglich.

Model für:

• XdevTable
• XdevComboBox
• XdevListSelect
• XdevTwinColSelect
• XdevTree
• XdevTreeTable

...

Der XdevBeanItemContainer ist eine Erweiterung, die von Container ableitet.

• Wird von RapidClipse automatisch verwendet, wenn Property > Data > findAll oder eine eigene Query-Methode ausgewählt wird.
  Image Removed
• Bietet kein Lazy-Loading zwischen Datenbank und Server. Das Abfrageergebnis wird vollständig an den XdevBeanItemContainer (Server) übertragen.
• Manuelles Hinzufügen von Datensätzen (BeanItems) möglich.

Examples:

...

GUI-Komponente wie die Grid oder der Binder können programmatisch mit einem Entity verknüpft werden.

Liste an GUI-Komponente, welche Databinding benötigen:

• Grid
• Binder
• CheckboxGroup
• RadioButtonGroup
• ComboBox
• Select
• ListBox

Databinding mit CheckboxGroup, RadioButtonGroup, ComboBox, Select oder ListBox:

• Zuerst muss die Komponente typisiert werden, dazu im GUI-Builder die Komponente anwählen und dann in den Properties auf Property > Object > Type Arguments klicken z.B. java.lang.String
• Im folgenden Dialog den Typ auswählen, welchen Sie anzeigen wollen.
• Danach können Sie auswählen, welche Information pro Eintrag angezeigt werden soll. 

Um die Komponente jetzt zu befüllen, können Sie folgenden Code schreiben:

...

this.theComponent.

...

setItems(

...

myListWithItems);

...

Im Hintergrund erstellt Vaadin dann für die übergebene Liste einen DataProvider. Wenn ein Element also in der Liste geupdated wird, muss diese dann auch der DataProvider geupdated werden:

...

XdevBeanItemContainer<Products> productsContainer = table.getContainerDataSource();

...

this.theComponent.getDataProvider().refreshItem(itemFromTheListThatChanged);

Falls Sie ein Element löschen oder neu hinzufügen, müssen Sie die refreshAll-Methode aufrufen:

...

XdevBeanItemContainer<Products> productsContainer = new XdevBeanItemContainer<Products>(Products.class);

BeanItem

Das BeanItem ist eine Erweiterung, die von Item ableitet. Ein BeanItem kann eine Liste mit Properties (einzelne Werten) und damit 1 Datensatz aufnehmen. 

...

Model für:

•  XdevTextField

...

this.theComponent.getDataProvider().refreshAll();

Mit getValue() können Sie nach den ausgewählte(n) Elemente abfragen.

Databinding mit Binder:

Mit dem Binder lassen sich ganz einfach Formulare erstellen. Dafür einfach ein Entity per Drag and Drop auf den GUI-Builder ziehen. Danach öffnet sich ein Dialog, wo Sie die Attribute auswählen können, die angezeigt werden sollen.

Ein Entity kann jetzt wie folgt gebunden werden:

BeanItem<Products> product = new BeanItem<Products>(null);

Häufiger Anwendungsfall:

...

this.binder.writeBean(myBean);

Jetzt sind die Werte des Beans in die Felder des Binders übertragen worden.

Die Werte können jetzt wie folgt wieder geholt werden:

BeanItem<Products> product = table.getSelectedItem(this.binder.readBean(myBean);

Zuweisung:

...

Databinding mit Grid:

Das Grid lässt sich ähnlich wie CheckboxGroup etc. binden. Zuerst das Entity per Drag and Drop in den GUI-Builder ziehen. Danach öffnet sich aber ein komplexerer Dialog. Dort können Sie die Attribute auswählen, die angezeigt werden sollen. Sie können aber auch Column per Code einfügen wie folgt:

fieldGroupthis.grid.setItemDataSource(product);

Property

Eine Property kann nur einen einzelnen Wert (Datenfeld) aufnehmen.   

...

Model für: 

• XdevTextField
• XdevPasswordField
• XdevInlineDateField
• XdevPopupDateField
• XdevNativeSelect
• XdevRichTextArea

Instanzierung:

addColumn(Customer::getAddress).setHeader("Addressen").setAutoWidth(true);

Es müssen aber nicht Methoden des Entities genutzt werden:

Property<String> productName = new ObjectProperty<String>("Chai");

Häufiger Anwendungsfall:

Auslesen eines Datenfeldes aus einem Item, z.B. der selektierten Zeile einer Table:

Property<String> productName = product.getItemProperty("productname");

Zuweisung:

Erfolgt mit der Methode setPropertyDataSource:

textField.setPropertyDataSource(productName);

In der Praxis wird jedoch i.d.R. die Methode setValue verwendet: 

textField.setValue(productName);

Image Removed

...

this.grid.addColumn(customer -> "Address is: " + customer.getAddress()).setHeader("Addressen").setAutoWidth(true);

Das setzen der Items, sowie das Refreshen des Dataproviders ist identisch zu der CheckboxGroup etc.