PowerApps Canvas-Komponente: Effiziente Benachrichtigung mit automatischem Löschen


Beschreibung

Diese PowerApps Canvas-Komponente wurde entwickelt, um Benachrichtigungen innerhalb der Anwendung effizienter darzustellen. Sie verfügt über mehrere nützliche Eigenschaften:

  • Automatisches Löschen von Nachrichten: Nutzer haben die Möglichkeit, festzulegen, welche Arten von Nachrichten – sei es Erfolgsmeldungen (Auto Remove Success Messages) oder Fehlermeldungen (Auto Remove Error Messages) – nach einem bestimmten Zeitintervall (Auto Remove Delay) automatisch entfernt werden sollen.
  • Anpassbare Verzögerungseinstellungen: Nutzer können eine spezifische Verzögerungsdauer einstellen, nach deren Ablauf ausgewählte Nachrichtentypen automatisch aus der Anzeige entfernt werden.
  • Screen-spezifische Nachrichtenunterscheidung: Die Komponente bietet die Möglichkeit, Nachrichten basierend auf dem aktiven Bildschirm differenziert darzustellen. Dies ist besonders hilfreich, wenn die Komponente gleichzeitig auf mehreren Bildschirmen eingesetzt wird.
  • Automatische Höhenanpassung der Komponente: Die Komponente berechnet ihre eigene Höhe, wobei die maximale Höhe auf die Größe des Bildschirms festgelegt ist.

Screenshots/Videos

Voraussetzungen

Um diese Komponente zu nutzen, muss die Aktivierung der modernen Steuerelemente in den Einstellungen unter Allgemein -> Moderne Steuerelemente und Themen erfolgen.

Eigenschaften der Komponente

  • CurrentScreen: Standardmäßig auf App.ActiveScreen gesetzt
  • Auto Remove Delay (in Millisekunden): Standardmäßig auf 3000 gesetzt
  • Auto Remove Success Messages: Standardmäßig auf true gesetzt
  • Auto Remove Error Messages: Standardmäßig auf false gesetzt

Aufbau der Sammlung (Collection)

In der Komponente wird colNotifyInformation als Sammlung zum Demonstrieren verwendet. Sie enthält folgende Elemente:

  • Screen (Type: Screen): Enthält den Bildschirm, auf dem die Benachrichtigung angezeigt werden soll
  • Icon (Type: String): FluentUI Icon-Name (wird vom Modern Control “Button” verwendet)
  • IconColor (Type: String): Hex-Farbwert, um die Hintergrundfarbe des Icons festzulegen
  • Text (Type: String): Text, der in der Benachrichtigung angezeigt werden soll
  • IsError (Type: Boolean): Legt fest, ob die bereitgestellte Benachrichtigung als Fehlermeldung behandelt werden soll

Beispiele

Erfolgsmeldung:

{
    Screen: App.ActiveScreen,
    Icon: "Checkmark",
    IconColor: "#2f9a22",
    Text: $"Die Daten wurden erfolgreich importiert.",
    IsError: false
}

Fehlermeldung:

{
    Screen: App.ActiveScreen,
    Icon: "Dismiss",
    IconColor: "#ff4219",
    Text: "Ein Fehler ist aufgetreten. Die Daten sind nicht korrekt, bitte versuchen Sie es erneut.",
    IsError: true
}

Anleitung

  • MSAPP Datei herunterladen
  • In der Canvas App auf den Reiter Komponenten(Components) wechseln und auf Komponenten importieren(Import Components) klicken
  • MSAPP Datei über Datei hochladen(Upload file) der App hinzufügen

Fazit

Die Implementierung dieser Komponente ermöglicht sowohl Entwicklern als auch Benutzern eine verbesserte Benutzererfahrung, da sie eine klare und konsistente Benachrichtigungsstrategie innerhalb der Anwendung bietet.