Galerie sortieren

Apr 22, 2025

So machst du Power Apps Galerien mit anklickbaren Überschriften noch benutzerfreundlicher

Ich zeige dir Schritt für Schritt, wie du in deiner Power App Galerie anklickbare Überschriften integrierst. Damit kannst du deine Daten auf- oder absteigend sortieren – ganz intuitiv per Klick auf die Spaltenüberschrift. Das sorgt nicht nur für mehr Benutzerfreundlichkeit, sondern gibt deiner App auch einen professionellen Touch.

Warum Galerien sortieren?

Wenn du mit Daten in Power Apps arbeitest, möchtest du deinen Nutzer:innen eine einfache Möglichkeit geben, Inhalte zu sortieren – z. B. nach Erstellungsdatum oder Status. Mit dynamisch sortierbaren Spaltenüberschriften bietest du genau das: Klarheit, Kontrolle und ein besseres Nutzungserlebnis.

Schritt 1: Galerie erstellen

Starte mit einer Galerie, und verbinde diese mit deiner Datenquelle. Für dieses Beispiel nutze ich die Genehmigungs-App. Wie du dieses erstellst, zeige ich hier

Genehmigungs-App

Schritt 2: Button als Überschrift festlegen

Füge eine Schaltfläche (Button) über die gewünschte Spaltenüberschrift ein (z. B. „Erstellt am“). Passe den Button so an, dass er wie die Überschrift aussieht (Hintergrundfarbe, Schriftfarbe etc.). Über den Mauszeiger wird dem Benutzer jetzt angezeigt, dass dieser Bereich angeklickt werden kann.

Schritt 3: Sortierlogik erstellen

Per Klick auf den Button legst du zwei Bildschirmvariablen mit UpdateContext fest.

Button
OnSelect =
//Sortierreihenfolge festlegen
UpdateContext(
{
varSortierTyp: If(
varSortierTyp = SortOrder.Ascending;
SortOrder.Descending;
SortOrder.Ascending
)
}
);;
//Sortierspalte festlegen
UpdateContext({varSortierSpalte: "Erstellt"})

Schritt 4: Galerie sortieren

In der Galerie sortierst du deine Daten dynamisch mit der Sort-Funktion.

Galerie
Items = Sort('Genehmigungs App';Erstellt;varSortierTyp)

Schritt 5: Pfeile einfügen

Für eine erhöhte Nutzerfreundlichkeit zeigst du direkt in der Überschrift, wie aktuell sortiert wird. Nutze dazu Emojis wie ↑ und ↓:

CODE:

Button
Text =
If(
varSortierSpalte = "Erstellt";
If(
varSortierTyp = SortOrder.Ascending;
"Erstellt am ⬆";
"Erstellt am ⬇"
);
"Erstellt am"
)

BONUS Schritt 6: Mehrere Spalten sortieren

Um mehrere Spalten zu sortieren, kannst du den erstellen Button kopieren, anpassen und die Sortierlogik in der Galerie erweitern.

Button (Spalte 2)
OnSelect =
//Sortierreihenfolge festlegen
UpdateContext(
{
varSortierTyp: If(
varSortierTyp = SortOrder.Ascending;
SortOrder.Descending;
SortOrder.Ascending
)
}
);;
//Sortierspalte festlegen
UpdateContext({varSortierSpalte: "Status"})

Galerie
Items =
Switch(
varSortierSpalte;
"Erstellt";Sort('Genehmigungs App';Erstellt;varSortierTyp);
"Status";Sort('Genehmigungs App';Status.Value;varSortierTyp)
)