Trennzeichenkomponenten in adaptiven Formularen separator-component-in-adaptive-forms
Adobe empfiehlt, die modernen und erweiterbaren Kernkomponentenzur Datenerfassung zu verwenden, um neue adaptive Formulare zu erstellenoder adaptive Formulare zu AEM Sites-Seiten hinzuzufügen. Diese Komponenten stellen einen bedeutenden Fortschritt bei der Erstellung adaptiver Formulare dar und sorgen für beeindruckende Anwendererlebnisse. In diesem Artikel wird ein älterer Ansatz zum Erstellen adaptiver Formulare mithilfe von Foundation-Komponenten beschrieben.
Sie können die Trennzeichenkomponente verwenden, um Bereiche eines Formulars visuell zu trennen. Sie können die Gesamtdarstellung und den Stil einer Trennzeichenkomponente definieren, indem Sie die folgenden Eigenschaften einer Trennzeichenkomponente angeben:
-
Elementname: Gibt den Namen der Komponente an. Die SOM-Ausdrücke richten sich an die Komponente mit einem Wert, der im Feld „Elementname“ angegeben ist.
-
Stärke: Gibt die Stärke der Trennzeichenkomponente in Pixel an.
-
CSS-Klasse: Gibt die benutzerdefinierte CSS-Klasse für die Trennzeichenkomponente an.
-
Inline-Stile: Mit AEM Forms können Sie jetzt CSS-Inline-Stile auf individuelle adaptive Formularkomponenten anwenden und eine Vorschau der Änderungen in Echtzeit anzeigen.
Im Layout-Modus können Sie die Anzahl der Spalten festlegen, die die Trennzeichenkomponente umfasst. Weitere Informationen finden Sie unter Verwenden des Layout-Modus, um die Größe von Komponenten anzupassen.
Angeben der Eigenschaften einer Trennzeichenkomponente:
- Wählen Sie eine Trennzeichenkomponente aus und wählen Sie
- Klicken Sie auf eine Registerkarte im Abschnitt „Inline-CSS-Eigenschaften“, um CSS-Eigenschaften festzulegen. Beispiel: Klicken Sie auf der Registerkarte „Feld“ auf Element hinzufügen. Es wird eine Zeile mit zwei Feldern hinzugefügt.
- Geben Sie im ersten Feld von links eine CSS3-Eigenschaft an, die Sie anwenden möchten. Beispielsweise Rahmen. Sie können eine Eigenschaft auch auswählen, indem Sie auf den Pfeil nach unten klicken. Die Dropdown-Liste ist nicht vollständig und Sie können einen beliebigen unterstützten CSS3-Eigenschaftennamen in dieses Feld eingeben.
- Geben Sie im angrenzenden Feld einen gültigen Wert für die angegebene CSS3-Eigenschaft an. Beispielsweise 3px solid black.
- Klicken Sie auf Element hinzufügen, um eine andere Eigenschaft und deren Wert anzugeben.
- Klicken Sie auf Vorschau, um eine Vorschau der Änderungen im Formular anzuzeigen.
- Klicken Sie auf OK, um die Änderungen zu bestätigen, oder auf Abbrechen, um das Dialogfeld ohne Änderungen zu schließen.