Skip to main content

Responsive UI und Tabellendaten

Responsives Design bei Tabellen

In der Pega-Plattform zeigt eine Tabelle automatisch Daten aus einer Datenbeziehung an. Sie können die Responsivität für Tabellen so konfigurieren, dass bei wechselnder Displaygröße weniger Informationen angezeigt werden. Beim responsiven Tabellendesign wird das horizontale Scrollen minimiert, da weniger wichtige Informationen von der Benutzeroberfläche entfernt werden. 

Beim Konfigurieren von responsivem Verhalten hat es sich bewährt, die angezeigten Informationen auf die Business-Anforderungen abzustimmen. Die Reihenfolge, in der Informationen dem Endbenutzer präsentiert werden, wirkt sich auf die Benutzererfahrung aus. Nehmen wir als Beispiel die folgende Tabelle: Die Spalten „Part number“ und „Name“ sollten immer angezeigt werden. Zudem sollte die Spalte „Line total“ immer am Ende der angezeigten Informationen erscheinen.

table example

    Spaltenpriorität

    Eine Tabelle besteht aus einer oder mehreren Spalten. Für jede Spalte wird eine Prioritätseinstellung konfiguriert. Die Spaltenpriorität gibt an, wie die Pega-Plattform die Spalten bei unterschiedlichen Display-Größen anzeigt. Optionen für die Spaltenpriorität sind Primary, Secondary und Other. Standardmäßig wird die erste Spalte von links auf „Primary“ gesetzt und erhält damit die höchste Priorität.

    Die Spaltenpriorität wird in Dev Studio konfiguriert. Sie können jedoch in App Studio die Priorität einer Spalte auf „Primary“ setzen oder ändern, wenn Sie die Formularkonfiguration zur Laufzeit bearbeiten. Dies geschieht, indem Sie die Spalte in der Tabelle an die erste Position von links verschieben. Wenn Sie die Spaltenreihenfolge in einer Tabelle ändern, setzt die Pega-Plattform die erste Spalte von links automatisch auf „Primary“ und die übrigen Spalten auf „Secondary“.

    Klicken Sie auf die Pluszeichen (+) in der folgenden Abbildung, um mehr über die Spaltenpriorität zu erfahren.

    Standardmäßige Breakpoint-Einstellungen in responsiven Tabellen

    Standardmäßig werden für Tabellen zwei responsive Breakpoints gesetzt. Am ersten, breiteren Breakpoint werden Spalten mit der Wichtigkeit „Other“ nicht angezeigt. Am zweiten, schmaleren Breakpoint wird die Tabelle als Liste dargestellt. Für jede Zeile der Tabelle werden die Inhalte der einzelnen Spalten vertikal gestapelt, sodass das horizontale Scrollen entfällt.

    responsive-table-ph-tablet

     

    Klicken Sie in der folgenden Tabelle auf die Pluszeichen (+) bei jeder Prioritätseinstellung, um mehr darüber zu erfahren, wie Spalten mit unterschiedlichen Prioritätseinstellungen auf den verschiedenen Gerätetypen angezeigt werden.

    If you are having problems with your training, please review the Pega Academy Support FAQs.

    Fanden Sie 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