Badge

Ninext arricchisce l'interfaccia di Ninox aggiungendo dei badge su alcune schede per mettere in evidenza informazioni importanti.

• Sulla scheda File, un badge blu indica il numero di file allegati aggiunti al record.
• Sulla scheda Commenti, un badge rosso segnala i nuovi messaggi, mentre un badge grigio mostra i commenti più vecchi.
• Sulle schede personalizzate, è possibile modificare l'aspetto (colore, titolo) e aggiungere un badge per attirare l'attenzione su un'informazione chiave.

Questi badge permettono di individuare rapidamente le novità senza dover aprire ogni scheda.

I badge, come la personalizzazione delle schede descritta più avanti, si disattivano nelle Impostazioni Ninext, sezione «Miglioramenti interfaccia»: Badge su file e commenti (attivato per impostazione predefinita).

Badge sulle schede «File» e «Commenti»

Scheda File

• Badge blu: compare se esistono file non collegati ad alcun campo «File», cioè reperibili nella scheda degli allegati. Il numero mostrato corrisponde a questi allegati autonomi.
• Nessun badge: non è stato rilevato alcun allegato autonomo.

Scheda Commenti

• Badge rosso: indica il numero di nuovi commenti, cioè pubblicati da meno di 24 ore.
• Badge grigio: quando nessun commento ha meno di 24 ore, indica il numero totale di commenti.
• Nessun badge: non ci sono commenti per questo record.

I badge vi informano delle voci presenti sotto le icone corrispondenti:

In questo caso l'1 blu significa che c'è un allegato salvato in questo record e l'1 grigio che c'è un commento per questo record.

Badge personalizzati

Nella formula «Display field only, if» di ogni scheda potete dichiarare una funzione onUpdate che restituisce un oggetto JSON che descrive la scheda e il suo badge. L'esempio qui sotto proviene dalla tabella «Badges» del database dimostrativo: Caption, Color, 'badge.caption'… sono campi di questa tabella.

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

Personalizzare le schede con Ninext

Con Ninext è possibile modificare l'aspetto delle schede definite dall'utente in Ninox, definendo una funzione chiamata onUpdate nella formula «Display field only, if» della scheda. Questa funzione restituisce un oggetto che indica a Ninext quali elementi visivi cambiare. Si può:

• Regolare il titolo della scheda (caption) e il tooltip.
• Cambiare i colori del testo e dello sfondo (stato normale o selezionato).
• Impostare il colore di sfondo del modulo associato.
• Visualizzare un badge sulla scheda per evidenziare un'informazione importante.

Panoramica rapida delle proprietà JSON

Svolgimento generale

• Definire la funzione onUpdate
  Nella formula «Display field only, if» della scheda, create una funzione chiamata onUpdate. Questa funzione deve restituire un oggetto (in forma di JSON) che descrive quali elementi di visualizzazione modificare. Riceve come parametro l'oggetto che ha restituito alla chiamata precedente (un oggetto vuoto la prima volta).
• Restituire un booleano per la visibilità
  La formula «Display field only, if» deve terminare restituendo true o false per indicare se la scheda vada visualizzata o meno.
• Ninext applica le modifiche
  Ogni volta che l'utente apre o aggiorna il record, Ninext esegue la funzione onUpdate, legge l'oggetto restituito e applica dinamicamente alla scheda le modifiche di aspetto.

Esempi di implementazione

Esempio completo (più proprietà)

"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

Commenti:

• La funzione non contiene return: questa parola non esiste nel linguaggio di Ninox. Restituisce il valore della sua ultima espressione, qui l'oggetto.
• caption cambia il titolo della scheda in base a NumberTest.
• tooltip mostra un messaggio di testo al passaggio del mouse.
• color e backgroundColor definiscono i colori nello stato non selezionato.
• selected contiene i colori dello stato di scheda attiva.
• badge aggiunge un indicatore (numero o punto esclamativo) per dare risalto; negli altri casi, la sua etichetta è vuota e il badge non compare.

Esempio minimo (solo 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

Commenti:

• Viene restituita solo la proprietà badge.
• Se NewClients è maggiore di 0, ne viene mostrato il valore, convertito in testo da text(); altrimenti l'etichetta è vuota e il badge non compare.
• Il badge ha testo bianco su sfondo blu.

Punti importanti

• Restituzione booleana finale
  Senza restituire true o false alla fine, la scheda non sarà visibile.
• Un'etichetta del badge sempre in testo
  Ninext mostra il badge solo se badge.caption è un testo non vuoto. Un numero (3 invece di "3") lascia il badge nascosto: usate text().
• Una funzione valutata a parte
  Ninext estrae la sola funzione onUpdate dalla formula, poi la valuta a parte, nel contesto del record. Non vede quindi né le variabili né le altre funzioni dichiarate altrove in «Display field only, if»: dichiarate all'interno di onUpdate tutto ciò di cui ha bisogno. Può leggere i campi del record (this.NumberTest) e chiamare le funzioni globali del database.