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 und – sofern vorhanden – Platzhalter angezeigt. Die Einstellung Titel in Kontrolle anzeigen, die Sie in den Eigenschaften von Eingabelementen erreichen, wird dabei vom Formularassistent automatisch gesetzt.



Hier die Ansicht im Web:

Option 2

In allen Ausgabegrößen werden Titel und Eingabeelemente in einer eigenen Reihe untereinander dargestellt. Hier die Ansicht im Web:

Option 3

Auf kleinen Displays werden die Titel ausgeblendet und dafür wie in Option 1 Platzhalter angezeigt. Auf mittleren und großen Bildschirmen werden Titel und Eingabeelement wie in Option 2 in jeweils eigenen Zeilen gerendert. Hier die Ansicht im Web für eine kleine Bildschirmgröße:

Option 4

Auf kleinen Displays werden die Titel ausgeblendet und dafür eventuell vorhandene Platzhalter angezeigt. Auf mittleren Bildschirmen werden Titel und Eingabeelemente in eigenen Reihen angezeigt. Auf großen Bildschirmen werden Titel und zugehöriges Eingabeelement nebeneinander dargestellt. Hier die Ansicht im Web für große Bildschirme:

Ansichtsseiten

Auf Ansichtsseiten werden keine Platzhalter in den Ansichtselementen 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. Ansichtselemente 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 Eingabeelemente auf kleinen Bildschirmen immer nebeneinander dargestellt werden. Die zuletzt gewählte Layout-Option für den jeweiligen Typ (z.B. div-Layout Eingabeseite) wird in der Datei manager.properties gespeichert.