Formularassistent - Layout

Modul Applikationen Applikationsstruktur / Seite markieren Hauptmenü Neu / Formularassistent



Über den Formular-Assistenten werden auf die umgebende Gruppierung Styleklassen geschrieben, die Auswirkungen auf die Anordnung der Elemente und der zugehörigen Titel in der Gruppierung haben. Im Dialog sehen Sie rechts neben den vier möglichen Optionen jeweils eine Vorschau.

Option 1




In allen Ausgabegrößen (SMALL, MEDIUM, LARGE) werden die Titel ausgeblendet. Die Einstellung "Titel in Kontrolle anzeigen", die Sie in den Eigenschaften von Eingabe-Elementen erreichen, wird dabei vom Formularassistent automatisch gesetzt.

Option 2




In allen Ausgabegrößen werden Titel und Eingabe-Elemente in einer eigenen Reihe untereinander dargestellt.

Option 3




In der Abbildung oben sehen Sie Option 3 für kleine Bildschirme. Auf kleinen Displays werden die Titel ausgeblendet und dafür wie bei Option 1 Platzhalter angezeigt. Auf mittleren und großen Bildschirmen werden Titel und Eingabe-Element wie in Option 2 in jeweils eigenen Zeilen gerendert.

Option 4




In der Abbildung oben sehen Sie Option 4 für große Bildschirme. Auf kleinen Displays werden die Titel ausgeblendet und dafür eventuell vorhandene Platzhalter angezeigt. Auf mittleren Bildschirmen werden Titel und Eingabe-Elemente in eigenen Reihen angezeigt. Auf großen Bildschirmen werden Titel und zugehöriges Eingabe-Element nebeneinander dargestellt.

Ansichtsseiten

Auf Ansichtsseiten werden keine Platzhalter in den Ansichts-Elementen angezeigt. Statt dessen werden hier die Titel ggfs. tatsächlich ausgeblendet.

Styleklassen

Weitere Kombinationen können durch manuelle Angabe der Styleklassen erzeugt werden. Die folgenden Styleklassen sind für Eingabe- bzw. Ansichts-Elemente innerhalb einer vom Formularassistenten erzeugten Gruppierung definiert. Die Styleklasse "Container_ResponsiveForm", die Ausgangsklasse für die Gruppierungen, muss vorhanden sein, damit die "ix-ViewPort-label-Position" Klassen greifen. Die Styles vererben sich dabei von der kleineren zur größeren Displaygröße, also von SMALL nach MEDIUM und von MEDIUM nach LARGE. Um z.B. Option 1 abzubilden, schreibt der Formularassistent die Styleklasse ix-small-label-inline auf die Container_Responsive-Gruppierung, für Option 3 wird zusätzlich noch ix-medium-label-top geschrieben, um die Einstellungen für mittlere und große Bildschirme wieder zu überschreiben. Es wäre aber auch denkbar, z.B. mit der Klasse Container_ResponsiveGroup ix-small-label-left eine Gruppierung anzulegen, in der Titel und Eingabe-Elemente auf kleinen Bildschirmen immer nebeneinander dargestellt werden. Die zuletzt gewählte Layout-Option für den jeweiligen Typ (z.B. DIV-Layout der Eingabeseite) wird in der Datei manager.properties gespeichert.