Das XdevFormLayout funktioniert ähnlich wie das XdevVerticalLayout, bietet jedoch weniger Einstellungsmöglichkeiten. Alle UI-Komponenten eines XdevFormLayout werden vertikal untereinander im Parent-Container angeordnet. Die UI-Komponente wird fest in ihrer Zelle vertikal zentriert. Die Zelle nimmt den gesamten, in der Höhe verfügbaren Platz ein. Falls sich mehrere UI-Komponenten im XdevFormLayout befinden, wird der verfügbare Platz automatisch gleichmäßig aufgeteilt. Die UI-Komponente wird i.d.R. durch die Einstellung % über die gesamte Breite gestreckt.

Image Removed 

Hinweis: 

...

Layout-Optionen 

• Width 
  Image Removed
  
  • ? - Die Breite der UI-Komponente wird automatisch durch ihren Content definiert.  
  • px - Die Breite der UI-Komponente wird fest in Pixel definiert. 
  • % - Die UI-Komponente streckt sich über die gesamte verfügbare Zellen-Breite.

 Mit dem FormLayout werden Komponente gleichmäßig in einen Gitter angereiht. Wenn eine Komponente in ein FormLayout hinzugefügt wird, wird automatisch ein FormItem erstellt.

Ein FormLayout kann automatisch erzeugt werden, indem ein Entity per Drag and Drop auf die View gezogen wird. Dann öffnet sich ein Dialog, in welchen Sie die die Properties auswählen können, die angezeigt werden sollen.

Image Added

Die Anzahl der Spalten, kann mit der ResponsiveSteps Property angepasst werden. Hier können mehrere Spaltenkonfigurationen angegeben werden, je nachdem, wie groß das FormLayout auf dem Bildschirm gerade ist.

• Min Width - Die minimale Breite, die das Layout haben muss, um diese Spaltenkonfiguration zu benutzen
• Columns - Die Anzahl der Spalten, die bei dieser Konfiguration angezeigt werden soll
• Labels Position - Gibt an, wo sich der Label für das FormItem befinden soll

Image Added