Skip to main content

Dynamische Layouts

Dynamische Layouts sind eine Layoutart, das von Ihnen ausgewählte Elemente anordnet, z. B. Felder und Steuerelemente, in einem flexiblen Format, das sich automatisch an die Bildschirmgröße anpasst. Dynamische Layouts unterstützen responsives Verhalten auf verschiedenen Geräten wie PCs, Tablets und Smartphones. Wenn sich die Bildschirmgröße ändert, passen dynamische Layouts die angezeigten Inhalte an, indem Elemente in die nächste Zeile umgebrochen werden. Dadurch entfällt das horizontale Scrollen auf kleineren Bildschirmen.

Hinweis: Dynamische Layouts sind nur für die UI-Darstellung im HTML5-Dokumenttyp verfügbar. Anwendungen, die vor Pega 7.0 erstellt wurden, verwenden möglicherweise nicht die neuesten dynamischen UI-Features der Pega-Plattform-Benutzeroberfläche. Mit der Startseite „HTML5 Application Readiness“ können Sie ein Update Ihrer Anwendung vornehmen. Weitere Informationen finden Sie unter dem Hilfethema Startseite „HTML5 Application Readiness“.

Prüfen Sie mit der folgenden Interaktion Ihr Wissen.

Design-Vorlagen für dynamische Layouts

Bei Design-Vorlagen handelt es sich um vorformatierte Layouts. Viele Design-Vorlagen bieten gängige Formatierungen für dynamische Layouts, z. B. die Anordnung von Inhalten in einer, zwei oder drei Spalten. Jede Design-Vorlage unterteilt ein Layout in einen oder mehrere Bereiche. Ein Entwickler kann in jedem Bereich Felder platzieren und so rasch den Inhalt einer Ansicht aufbauen. Basiert die Design-Vorlage auf einem dynamischen Layout, werden bei einem Wechsel der Bildschirmgröße die Inhalte einer Ansicht neu angeordnet.

Hinweis: Eine geringe Anzahl an Design-Vorlagen bietet andere Formatierungen als für dynamische Layouts.

Die folgende Abbildung zeigt einige Beispiels für von Pega angebotene Design-Vorlagen.

out-of-the-box layout templates

Jede Ansicht kann eine Design-Vorlage beinhalten. Sie können kleinere, modulare Ansichten in einer größeren Ansicht zusammenführen, wodurch der Einsatz mehrerer Vorlagen in einer einzigen Ansicht nachempfunden wird.

Beispiel: Die Ansicht „Customer Information“ enthält Informationen zur Wohn- und Rechnungsadresse. Die Standardvorlage für die Ansicht ist „1 Column“. Die Beteiligten wünschen aber eine zweispaltige Ansicht: eine Spalte für die Wohnadresse und die andere für die Rechnungsadresse.

Später entscheiden die Stakeholder, dass die Kundendaten aufgeschlüsselt werden sollen, da man dann nicht scrollen muss, um auf alle Felder zuzugreifen. Sie fordern eine zusätzliche Änderung: Das Bundesland oder die Region des Kunden und die Telefonnummer sollen in einer gesonderten Spalte gemeinsam mit den anderen Angaben zur Wohnadresse angezeigt werden. Ein Entwickler erstellt mit der Vorlage „2 Column“ eine Ansicht für die Wohnadresse und referenziert diese Ansicht in der ersten Spalte der ursprünglichen Ansicht, die ebenfalls diese zweispaltige Vorlage verwendet. Das Ergebnis ist eine Vorlage innerhalb einer Vorlage.

Verschieben Sie in der Mitte des folgenden Bildes die vertikale Linie, um den Übergang von der zweispaltigen Vorlage „2 Column“ zu einer Vorlage „2 Column“ zu sehen, die in die erste Spalte eingefügt wurde.

 

Prüfen Sie mit der folgenden Interaktion Ihr Wissen.


Dieses Thema ist in den folgenden Modulen verfügbar:

Wenn Probleme mit den Lerninhalten auftreten, lesen Sie bitte die Pega Academy Support FAQs.

Fanden Sie diesen Inhalt hilfreich?

100% fanden diesen Inhalt hilfreich

Möchten Sie uns dabei helfen, diesen Inhalt zu verbessern?

We'd prefer it if you saw us at our best.

Pega Academy has detected you are using a browser which may prevent you from experiencing the site as intended. To improve your experience, please update your browser.

Close Deprecation Notice