Badges

Ninext erweitert die Ninox-Oberfläche, indem es bestimmten Reitern Badges hinzufügt, um wichtige Informationen hervorzuheben.

• Im Reiter „Dateien“ zeigt ein blaues Badge die Anzahl der dem Datensatz hinzugefügten Anhänge an.
• Im Reiter „Kommentare“ weist ein rotes Badge auf neue Nachrichten hin, während ein graues Badge ältere Kommentare anzeigt.
• In eigenen Reitern können Sie das Erscheinungsbild ändern (Farbe, Titel) und ein Badge hinzufügen, um die Aufmerksamkeit auf wichtige Informationen zu lenken.

Mit diesen Badges erkennen Sie neue Informationen auf einen Blick, ohne jeden Reiter öffnen zu müssen.

Die Badges lassen sich, wie auch die weiter unten beschriebene Anpassung der Reiter, in den Ninext Einstellungen ausschalten, Abschnitt „UI-Verbesserungen“: Badge für Dateien & Kommentare (standardmäßig aktiviert).

Badges in den Reitern „Dateien“ und „Kommentare“

Reiter „Dateien“

• Blaues Badge: Erscheint, wenn es Dateien gibt, die keinem Feld vom Typ „Datei“ zugeordnet sind, also unter dem Reiter „Anhänge“ zu finden sind. Die angezeigte Zahl entspricht diesen eigenständigen Anhängen.
• Kein Badge: Es wurden keine eigenständigen Anhänge gefunden.

Reiter „Kommentare“

• Rotes Badge: Gibt die Anzahl der neuen Kommentare an, also derjenigen, die vor weniger als 24 Stunden geschrieben wurden.
• Graues Badge: Wenn kein Kommentar jünger als 24 Stunden ist, gibt es die Gesamtzahl der Kommentare an.
• Kein Badge: Für diesen Datensatz gibt es keine Kommentare.

Die Badges informieren Sie über vorhandene Einträge unter den jeweiligen Symbolen:

Hier bedeutet die blaue 1, dass zu diesem Datensatz ein Anhang gespeichert ist, und die graue 1, dass es zu diesem Datensatz einen Kommentar gibt.

Eigene Badges

In der Formel „Display field only, if“ jedes Reiters können Sie eine Funktion onUpdate deklarieren, die ein JSON-Objekt zurückgibt, das den Reiter und sein Badge beschreibt. Das folgende Beispiel stammt aus der Tabelle „Badges“ der Demo-Datenbank: Caption, Color, 'badge.caption'… sind dort Felder dieser Tabelle.

function onUpdate(event : any) do
 debug(formatJSON(event));
 {
  caption: Caption,
  color: Color,
  backgroundColor: BackgroundColor,
  tooltip: Tooltip,
  badge: {
   caption: 'badge.caption',
   color: 'badge.color',
   backgroundColor: 'badge.backgroundColor'
  }
 }
end;
true

Reiter mit Ninext anpassen

Mit Ninext können Sie das Erscheinungsbild benutzerdefinierter Reiter in Ninox verändern, indem Sie in der Formel „Display field only, if“ des Reiters eine Funktion namens onUpdate definieren. Diese Funktion gibt ein Objekt zurück, das Ninext mitteilt, welche visuellen Elemente zu ändern sind. Sie können:

• Den Titel des Reiters (caption) und den Tooltip anpassen.
• Text- und Hintergrundfarben ändern (im normalen und im ausgewählten Zustand).
• Die Hintergrundfarbe des zugehörigen Formulars festlegen.
• Ein Badge auf dem Reiter anzeigen, um wichtige Informationen hervorzuheben.

Kurzüberblick über die JSON-Eigenschaften

Allgemeiner Ablauf

• Die Funktion onUpdate definieren
  Legen Sie in der Formel „Display field only, if“ des Reiters eine Funktion namens onUpdate an. Diese Funktion muss ein Objekt zurückgeben (JSON-artig), das beschreibt, welche Anzeigeelemente geändert werden sollen. Sie erhält als Parameter das Objekt, das sie beim vorherigen Aufruf zurückgegeben hat (beim ersten Mal ein leeres Objekt).
• Einen booleschen Wert für die Sichtbarkeit zurückgeben
  Die Formel „Display field only, if“ muss abschließend true oder false zurückgeben, um festzulegen, ob der Reiter angezeigt wird.
• Ninext wendet die Änderungen an
  Jedes Mal, wenn der Benutzer den Datensatz öffnet oder aktualisiert, führt Ninext die Funktion onUpdate aus, liest das zurückgegebene Objekt und wendet die Darstellungsänderungen dynamisch auf den Reiter an.

Umsetzungsbeispiele

Vollständiges Beispiel (mehrere Eigenschaften)

"Declaration of the onUpdate function";
function onUpdate(tabValues : any) do
    let nb := this.NumberTest;
    {
        caption: if nb > 0 then "To Invoice" else "View Invoice" end,
        tooltip: "Click to view details",
        color: "#333333",
        backgroundColor: "#ededed",
        formBackgroundColor: "#fafafa",
        selected: {
            color: "#ffffff",
            backgroundColor: "#4970ff"
        },
        badge: {
            caption: if nb = 3 then "3" else if nb = -1 then "!" else "" end,
            color: "#ffffff",
            backgroundColor: if nb = 3 then "#4970ff" else if nb = -1 then "#ff0000" else "#cccccc" end
        }
    }
end;

"Determine whether the tab is displayed: shown if NumberTest > 0";
if this.NumberTest > 0 then
    true
else
    false
end

Anmerkungen:

• Die Funktion enthält kein return: Dieses Wort gibt es in der Sprache von Ninox nicht. Sie gibt den Wert ihres letzten Ausdrucks zurück, hier das Objekt.
• caption ändert den Titel des Reiters je nach NumberTest.
• tooltip zeigt beim Überfahren einen Hinweistext an.
• color und backgroundColor legen die Farben im nicht ausgewählten Zustand fest.
• selected enthält die Farben für den aktiven Zustand des Reiters.
• badge fügt zur Hervorhebung einen Indikator hinzu (Zahl oder Ausrufezeichen); in den übrigen Fällen ist seine Beschriftung leer und das Badge erscheint nicht.

Minimalbeispiel (nur Badge)

"Declaration of the onUpdate function";
function onUpdate(tabValues : any) do
 let newClients := this.NewClients;
 {
  badge: {
   caption: if newClients > 0 then text(newClients) else "" end,
   color: "#ffffff",
   backgroundColor: "#4970ff"
  }
 }
end;
"The tab is always displayed";
true

Anmerkungen:

• Es wird ausschließlich die Eigenschaft badge zurückgegeben.
• Ist NewClients größer als 0, wird der Wert angezeigt, durch text() in Text umgewandelt; andernfalls ist die Beschriftung leer und das Badge erscheint nicht.
• Das Badge hat weißen Text auf blauem Hintergrund.

Wichtige Hinweise

• Abschließender boolescher Rückgabewert
  Ohne ein abschließendes true oder false ist der Reiter nicht sichtbar.
• Eine Badge-Beschriftung immer als Text
  Ninext zeigt das Badge nur an, wenn badge.caption ein nicht leerer Text ist. Eine Zahl (3 statt "3") lässt das Badge ausgeblendet: Verwenden Sie text().
• Eine separat ausgewertete Funktion
  Ninext entnimmt der Formel nur die Funktion onUpdate und wertet sie dann separat aus, im Kontext des Datensatzes. Sie sieht also weder die Variablen noch die anderen Funktionen, die an anderer Stelle in „Display field only, if“ deklariert sind: Deklarieren Sie innerhalb von onUpdate alles, was sie benötigt. Sie kann die Felder des Datensatzes lesen (this.NumberTest) und die globalen Funktionen der Datenbank aufrufen.