AlarmIndicator

Weist auf das Vorhandensein von Alarmen hin.

Symbol
Menüband	Start > Steuerelemente > System > Alarme > AlarmIndicator

Der "AlarmIndicator" visualisiert die Alarmklasse und den Alarmzustand des aktuellen Alarms sowie die Anzahl der Alarme in der angezeigten Alarmklasse. Das Steuerelement kann z. B. in der Kopfleiste oder einem anderen permanent sichtbaren Bereich der Applikation verwendet werden, um die Nutzer zu jedem Zeitpunkt auf das Auftreten von Alarmen hinzuweisen.

Der AlarmIndicator zeigt drei aktive Alarme in der Alarmklasse "Alarm" an.

Das Steuerelement unterstützt folgende Funktionalität:

Darstellung eines Alarmzählers
Darstellung von je nach Alarmklasse und Alarmzustand wechselnden Farben für Hintergrund und Grafik
Darstellung einer je nach Alarmklasse und Alarmzustand wechselnden oder einer statischen Grafik
Darstellung von gefilterten Alarmen
Anbindung an die Benutzerverwaltung zur Sperrung der Bedienbarkeit
Darstellung des Hintergrunds, des Rahmens, des Schattens etc.

Diese Funktionalitäten können Sie über die Eigenschaften im Fenster "Eigenschaften" konfigurieren, wenn Sie das Steuerelement im Designer oder in der Dokumentgliederung markieren.

Für das Steuerelement stehen keine System-Styles zur Verfügung. Sie können eigene Styles für das Steuerelement erstellen. Diese Styles stehen nach der Erstellung in der Eigenschaft "Style" zur Auswahl.

Das Steuerelement beinhaltet einen internen Container, auf dem die beiden Elemente "Indicator" (Anzeige der Grafik) und "Badge" (Alarmzähler) positioniert sind.

AlarmIndicator und seine Elemente

Der AlarmIndicator wird standardmäßig mit einem kreisförmigen Hintergrund dargestellt, der je nach Alarmklasse und Alarmzustand die Farbe wechseln kann.

Der Hintergrund kann über folgende Eigenschaften in der Kategorie "AlarmIndicator" konfiguriert werden.

CircularBackground

Ist die Eigenschaft aktiviert, wird der Hintergrund kreisförmig dargestellt, andernfalls rechteckig. Ob der Hintergrund farblich dargestellt wird, wird über die Eigenschaft "ShowBackground" festgelegt.

ShowBackground

Ist die Eigenschaft aktiviert, wird der Hintergrund je nach Alarmklasse und Alarmzustand farblich unterschiedlich dargestellt. Ist die Eigenschaft deaktiviert, wird der Hintergrund transparent dargestellt.

Der Alarmzähler (Badge) zeigt die Anzahl der Alarme der gerade angezeigten Alarmklasse.

In der Kategorie "AlarmIndicator" sind folgende Eigenschaften zur Konfiguration des Alarmzählers zu finden.

AutoScaleBadge

Skaliert die Breite und Höhe des Alarmzählers auf das 0,3-fache der Breite (Eigenschaft "Width") bzw. Höhe (Eigenschaft "Height") des Steuerelements. Sind die Höhe und die Breite des Steuerelements unterschiedlich, dann zählt für die Berechnung der Breite und Höhe des Alarmzählers die jeweils kürzere Strecke.

Ist diese Eigenschaft aktiviert, wird die Angabe in der Eigenschaft "BadgeSize" ignoriert.

Beispiel:

Width	Height	AutoScaleBadge	Berechnung	Größe des Badge
70 px	70 px	þ	70 px × 0,3 = 21 px	21 px × 21 px
80 px	70 px	þ	70 px × 0,3 = 21 px	21 px × 21 px
60 px	70 px	þ	60 px × 0,3 = 18 px	18 px × 18 px

Ist die Breite und die Höhe des AlarmIndicators auf jeweils 70px eingestellt und die Eigenschaft ""AutoScaleBadge aktiviert, dann beträgt die Breite/Höhe des Elements Badge 70 px × 0,3 = 21 px. Wird allein die Breite oder die Höhe z. B. auf 80 px vergrößert, beträgt die Breite/Höhe des Elements Badge immer noch 21 px, da für die Berechnung die kürzere Strecke verwendet wird. Wird allein die Breite oder die Höhe z. B. auf 60 px verringert, beträgt die Breite/Höhe des Alarmzählers dann 60 px × 0,3 = 18 px.

AutoScaleBadgeTextSize

Berechnet nach einer Formel die relative Schriftgröße (ausgedrückt in der Einheit "em"), die für die Skalierung der Schriftgröße im Badge verwendet wird. Das Ergebnis ist eine Schriftgröße, die in einem optisch angemessenen Verhältnis zur Größe des Badge steht. Verändert sich die Größe des Badge, wird auch die Schriftgröße im Badge verändert.

Die Berechnung der relativen Schriftgröße erfolgt nach der Formel "Badgegröße / Faktor = relative Schriftgröße". Der Faktor liegt bei einstelliger Anzahl der Alarme bei 20, bei zweistelliger bei 25, bei dreistelliger bei 35 und bei vierstelliger Anzahl bei 40. Für die Skalierung wird die Standardeinstellung für die Schriftgröße verwendet (16 px).

Ist diese Eigenschaft aktiviert, wird die Angabe in der Eigenschaft "BadgeTextSize" ignoriert.

Beispiel:

Größe des Badge	Anzuzeigende Anzahl	Relative Schriftgröße des Badge	Skalierte (absolute) Schriftgröße des Badge
21 px*21 px	einstellig (1 … 9)	21 px / 20 = 1,05 em	16 px × 1,05 em=16,8 px
21 px*21 px	zweistellig (10 … 99)	21 px / 25 = 0,84 em	16 px × 0,84 em=13,44 px
21 px*21 px	dreistellig (100 … 999)	21 px / 35 = 0,6 em	16 px × 0,06 em=9,6 px
21 px*21 px	vierstellig (1000 … 9999)	21 px / 40 = 0,525 em	16 px × 0,525 em=8,4 px

BadgeSize

Legt die Breite und die Höhe des Alarmzählers fest. Der Alarmzähler wird kreisförmig dargestellt, ist jedoch eigentlich eine quadratische Box, d. h. die Höhe und die Breite des Alarmzählers sind immer gleich.

Die Angabe in "BadgeSize" wird ignoriert, wenn die Eigenschaft "AutoScaleBadge" aktiviert ist.

BadgeTextSize

Legt die Schriftgröße des Alarmzählers fest.

Die Angabe in "BadgeTextSize" wird ignoriert, wenn die Eigenschaft "AutoScaleBadgeTextSize" aktiviert ist.

ShowBadge

Legt fest, ob der Alarmzähler angezeigt wird.

Außerdem können über die Eigenschaften "BadgeBackgroundColor" und "BadgeForegroundColor" (Kategorie "Colors") Farben für den Hintergrund und die Schrift des Alarmzählers festgelegt werden.

Ein "AlarmIndicatorItem" gibt die Alarmklasse an, die im Steuerelement AlarmIndicator angezeigt werden soll. Im AlarmIndicator sind bereits drei AlarmIndicatorItems für die drei standardmäßig in jedem Projekt vom Typ Server oder Single vorhandenen Alarmklassen "Alarm", "Message" und "Hint" angelegt.

Um neue AlarmIndicatorItems hinzuzufügen, wenn Sie zusätzliche Alarmklassen im Projekt angelegt haben, die Sie im AlarmIndicator darstellen wollen, oder um die AlarmIndicatorItems zu konfigurieren, öffnen Sie den Collection Editor über die Eigenschaft "AlarmIndicatorItems (Collection)" des AlarmIndicators.

Ein AlarmIndicatorItem unterstützt folgende Funktionalität:

Anbindung an die Alarmklasse über die Eigenschaft "AlarmClassName"
Priorisierung der Alarmklasse
Farbliche Darstellung des Hintergrunds und der Grafik für diese Alarmklasse
Darstellung einer speziellen Grafik für diese Alarmklasse

Sie können eine über einen AlarmIndicatorItem angebundene Alarmklasse für die Anzeige im Steuerelement priorisieren. Dazu stehen im AlarmIndicatorItem in der Kategorie "Sonstiges" folgende Eigenschaften zur Verfügung:

UseCustomPriority

Legt fest, dass die in der Eigenschaft "AlarmClassName" angegebene Alarmklasse im Steuerelement gegenüber anderen über die AlarmIndicatorItems angebundenen Alarmklassen priorisiert werden soll. Die Priorität wird in der Eigenschaft "Priority" festgelegt.

Priority

Legt den Wert für die Wichtigkeit der in der Eigenschaft "AlarmClassName" angegebenen Alarmklasse gegenüber den Alarmklassen fest, die in den anderen AlarmIndicatorItems angegeben sind. Je höher der Wert, desto wichtiger ist die Alarmklasse. Der Wert kann im Bereich 0 bis 2³¹-1 (=2.147.483.647) liegen.

Um die Auswirkung der Eigenschaft "Priority" auf das Verhalten des AlarmIndicators zu verstehen, führen Sie folgendes Beispiel mit einem Web UI Single- oder Webclient-Server-Projekt durch:

Legen Sie im Systemmodul "Alarme" drei neue Alarmklassen an ("Alarmklasse1", "Alarmklasse2", "Alarmklasse3").
Legen Sie für jede Alarmklasse eine Hintergrundfarbe fest, um die Alarmklassen optisch voneinander unterscheiden zu können, z. B. Rot für "Alarmklasse1", Orange für "Alarmklasse2" und Grün für "Alarmklasse3".
So können Sie die Farben für die verschiedenen Alarmzustände in einer Alarmklassendefinition festlegen:
1. Markieren Sie eine Alarmklassendefinition im Tabelleneditor.
2. Klicken Sie auf den Tab "Erweitert" der Eigenschaftenseiten.
In den Parametern Hintergrundfarbe und Vordergrundfarbe (Farbe der Grafik) können Sie die Farben für die verschiedenen Alarmzustände dieser Alarmklasse einstellen. Wenn Sie den Parameter Quittierungsart auf der Einstellung "Zurücksetzen" belassen (Tab "Allgemein"), brauchen Sie nur die Farben für den Zustand "Gekommen" zu ändern, da die anderen Alarmzustände bei dieser Quittierungsart nicht eintreten.
Legen Sie im Systemmodul "Variablen" drei Variablen, z. B. im Kanal "Intern", an ("Variable1", "Variable2", "Variable3"), die Sie im nächsten Schritt als Alarm auslösende Variablen verwenden werden.
Legen Sie im Systemmodul "Alarme" eine neue Alarmgruppe an, in der Sie drei Alarme anlegen. Geben Sie für jeden Alarm im Parameter Ereignisvariable jeweils "Variable1", "Variable2" und "Variable3" an.

Öffnen Sie "Page1.html" des Projekts im Designer und platzieren Sie einen AlarmIndicator auf der Page. Öffnen Sie den Collection Editor über die Eigenschaft "AlarmIndicatorItems (Collection)" und ändern Sie die Eigenschaften der drei bereits vorhandenen AlarmIndicatorItems wie folgt:

Eigenschaft	AlarmIndicatorItem0	AlarmIndicatorItem1	AlarmIndicatorItem2
AlarmClassName	Alarmklasse1	Alarmklasse2	Alarmklasse3
Priority	0	0	0
UseCustomPriority	o	o	o

Platzieren Sie drei Steuerelemente vom Typ Switch auf "Page1". Binden Sie über die Eigenschaft "VariableName" jeweils "Variable1", "Variable2" und "Variable3" an. Über diese Switches können Sie zur Laufzeit die Alarme auslösen, um die Auswirkung auf den AlarmIndicator zu beobachten.
Drücken Sie F5, um das Projekt im Browser zu starten.

Aktivieren Sie wahllos die Switches nacheinander. Sie können beobachten, dass der jeweils zuletzt aktivierte Alarm im "AlarmIndicator" angezeigt wird, da die jeweiligen Prioritäten der Alarmklassen, denen diese Alarme angehören, gleich sind, nämlich 0.

"Alarm3" wurde zuletzt aktiviert, der "AlarmIndicator" zeigt die Farbe seiner Alarmklasse an (grün).

Beenden Sie die Ausführung des Projekts, indem Sie den Brower bzw. den Browsertab schließen.

Erhöhen Sie in der IDE die Priorität für die Alarmklasse1:

Eigenschaft	AlarmIndicatorItem0	AlarmIndicatorItem1	AlarmIndicatorItem2
AlarmClassName	Alarmklasse1	Alarmklasse2	Alarmklasse3
Priority	1	0	0
UseCustomPriority	þ	o	o

Drücken Sie F5, um das Projekt im Browser zu starten.

Aktivieren Sie den ersten Switch. "Alarm1" ist nun aktiv und wird durch die rote Farbe im "AlarmIndicator" angezeigt. Aktivieren Sie die anderen Switches. Der "AlarmIndicator" zeigt immer noch die Alarmklasse des "Alarm1" an, da Sie diese Alarmklasse höher priorisiert haben.

Die Klasse des "Alarm1" wird im "AlarmIndicator" so lange angezeigt (rot), bis der Alarm inaktiv wird, da die Priorität seiner Klasse im "AlarmIndicator" höher gesetzt wurde als die der anderen Alarmklassen.

Über die AlarmIndicatorItems können Sie je nach Alarmklasse und Alarmzustand wechselnde Farben für Hintergrund und Grafik festlegen.

Standardmäßig gelten für die AlarmIndicatorItems die Farbeinstellungen der entsprechenden Alarmklassendefinition aus dem Systemmodul Alarme (siehe Tipp). Diese Farbeinstellungen gelten systemweit.

Wenn Sie andere Farben zur Darstellung der Alarmklassen im AlarmIndicator verwenden wollen als die im Systemmodul Alarme festgelegten Farben, stehen Ihnen folgende Eigenschaften in jedem AlarmIndicatorItem in der Kategorie Colors zur Verfügung:

BackgroundColorActive

Legt die Hintergrundfarbe für den Alarmzustand Gekommen fest.

BackgroundColorInactive

Legt die Hintergrundfarbe für den Alarmzustand Gegangen fest.

ForegroundColorActive

Legt die Farbe der Grafik für den Alarmzustand Gekommen fest.

ForegroundColorInactive

Legt die Farbe der Grafik für den Alarmzustand Gegangen fest.

Tipp: Legen Sie gleich alle vier Farben fest, um unerwartete Farbkombinationen zu vermeiden.

Wo ist das Symbol hin? Eine missglückte Kombination aus rotem Symbol auf rotem Hintergrund. Die Symbolfarbe wurde im AlarmIndicatorItem festgelegt (ForegroundColorActive), die Hintergrundfarbe kommt aus der Alarmklassendefinition (Tab "Erweitert", Parameter Hintergrundfarbe für den Zustand "Gekommen").

Die Farben für den Hintergrund und die Grafik im Alarmzustand "Inaktiv" (Cleared) werden über die Eigenschaften "DefaultBackgroundColor" und "DefaultForegroundColor" (Kategorie "Colors") des AlarmIndicators festgelegt.

Über die AlarmIndicatorItems können Sie je nach Alarmklasse und Alarmzustand wechselnde Grafiken für das Steuerelement festlegen.

Zur Konfiguration der wechselnden Grafiken stehen folgende Eigenschaften in den AlarmIndicatorItems in der Kategorie "Symbol" zur Verfügung:

IconFont

Legt die Grafikensammlung für den Grafiktyp "Icon" fest.

material-icons

Legt fest, dass im Grafikauswahldialog (Schaltfläche hinter der Eigenschaft "Symbol", "LeadingSymbol", "TrailingSymbol" etc.) die Material Icons von Google zur Auswahl angeboten werden.
winjs-icons

Legt fest, dass im Grafikauswahldialog (Schaltfläche hinter der Eigenschaft "Symbol", "LeadingSymbol", "TrailingSymbol" etc.) die WinJS Icons von Microsoft zur Auswahl angeboten werden.

SymbolActive

Legt die Grafik für den Alarmzustand "Gekommen" fest.

SymbolInactive

Legt die Grafik für den Alarmzustand "Gegangen" fest.

SymbolType

Legt den Grafiktyp und die Quelle der Grafik fest.

Icon

Die Grafik soll ein Icon sein und aus dem Ordner imagesWiconfonts des Projektverzeichnisses bezogen werden.
Svg

Die Grafik soll eine Vektorgrafik im Format SVG aus dem Ordner imagesWsvgs sein.
Bitmap

Die Grafik soll eine Pixelgrafik (BMP, PNG, GIF, JPG) aus dem Ordner imagesWbitmaps sein.

Werden in einem AlarmIndicatorItem keine Grafiken festgelegt, wird die Grafik verwendet, die in der Eigenschaft "DefaultSymbol" des AlarmIndicators angegeben ist. Diese statische Grafik wird auch für alle anderen Alarmzustände ("Inaktiv", "Gekommen quittiert", "Quittiert gegangen") verwendet.

Für alle anzuzeigenden Grafiken gemeinsam kann über die Eigenschaft "AutoScale" die automatische Größenanpassung konfiguriert werden:

AutoScale

Skaliert die Breite und Höhe der Grafik auf das 0,6-fache der Breite (Eigenschaft "Width") bzw. Höhe (Eigenschaft "Height") des Steuerelements. Sind die Höhe und die Breite des Steuerelements unterschiedlich, dann zählt für die Berechnung der Breite und Höhe der Grafik die jeweils kürzere Strecke.

Ist diese Eigenschaft aktiviert, wird die Angabe in der Eigenschaft "SymbolSize" ignoriert.

Beispiel:

Width	Height	Berechnung	Größe der Grafik
70 px	70 px	70 px × 0,6 = 42 px	42 px × 42 px
80 px	70 px	70 px × 0,6 = 42 px	42 px × 42 px
60 px	70 px	60 px × 0,6 = 36 px	36 px × 36 px

Ist die Breite und die Höhe des AlarmIndicators auf jeweils 70 px eingestellt und die Eigenschaft "AutoScale" aktiviert, dann beträgt die Breite/Höhe der Grafik 70 px × 0,6 = 42 px. Wird allein die Breite oder die Höhe z. B. auf 80 px vergrößert, beträgt die Breite/Höhe der Grafik immer noch 42 px, da für die Berechnung die kürzere Strecke verwendet wird. Wird allein die Breite oder die Höhe z. B. auf 60 px verringert, beträgt die Breite/Höhe der Grafik dann 60 px × 0,6 = 36 px.

Verwandte Themen:

Layout