Icona

Aggiunge un'icona personalizzata all'applicazione. È possibile programmare l'icona come un pulsante selezionabile.

La vista Icona è simile alla vista Badge. È più comunemente utilizzato per i seguenti scopi:

Aggiunta di un carattere estetico a una pagina dell'interfaccia utente
Servire come un pulsante cliccabile

Bind dei dati

Impostare o modificare il bind dei dati per la vista nella scheda delle proprietà Generale . Quando la vista Icona viene utilizzata come pulsante selezionabile, il bind dei dati registra se si fa clic sull'istanza del pulsante. Il tipo di dati è Boolean.

Proprietà di configurazione

In Configurazione, impostare o modificare le proprietà di aspetto e comportamento per la vista.

Dimensione schermo: Una proprietà di configurazione che ha l'icona Dimensioni schermo accanto al nome proprietà può avere valori differenti per ciascuna dimensione schermo. Se non si imposta un valore, la dimensione dello schermo eredita il valore della dimensione dello schermo successivo più grande come valore predefinito.

Definizioni del tema: Le definizioni dei temi specificano i colori e gli stili per una vista e ne determinano l'aspetto. È possibile visualizzare l'anteprima dell'aspetto delle viste nell'editor del tema. Consultare Temi.

Le proprietà di configurazione dell'aspetto per la vista Icona sono visualizzate nella seguente tabella:

Tabella 1. Proprietà di configurazione dell'aspetto per l'icona
Proprietà di configurazione dell'aspetto	Descrizione	Tipo di dati
Stile colore	Specifica uno stile di colore per la vista. I colori corrispondono alle variabili del tema specificato. Lo stile del colore predefinito è Predefinito (grigio).	`IconColorStyle`
Dimensione icona	Specifica la dimensione dell'icona in unità pixel o em. Ad esempio, `43px` o `43em`. Se viene specificato solo un numero senza alcuna unità, il numero viene interpretato come il numero di pixel. Il valore predefinito è `43`.	`String`
Solo contorno	Specifica se la vista visualizza solo il suo stile basato sul colore quando si passa con il cursore su di esso. Per impostazione predefinita, questa proprietà non è selezionata.	Booleano
Icona	Specifica il nome di un'icona accettabile dal sito Web Font Awesome V4.7.0 . Ad esempio, `calendar`, `clock-o`e `camera`. (Il prefisso Font Awesome `fa-` è facoltativo.) Per impostazione predefinita, non è specificata alcuna icona, ma è necessario specificarne una.	`String`
Raggio del bordo	Specifica il raggio della curvatura per un'icona. È possibile arrotondare perfettamente un'icona impostandola su almeno la metà della larghezza specificata per la proprietà Larghezza . Per impostazione predefinita, non viene specificato alcun raggio del bordo.	`String`
Larghezza	Specifica la larghezza di un'icona in pixel, percentuale o unità em. Ad esempio: `50px` o `20%` o `0.4em`. Se viene specificato solo un numero senza alcuna unità, il numero viene interpretato come il numero di pixel. Per impostazione predefinita, non viene specificata alcuna larghezza.	`String`

Le proprietà di configurazione del comportamento per la vista Icona sono riportate nella tabella seguente:

Tabella 2. Proprietà di configurazione del comportamento per Icon
Proprietà di configurazione del comportamento	Descrizione	Tipo di dati
Impedisci clic multipli	Impedisce a un utente di fare clic su un'icona più di una volta quando l'icona viene utilizzata come pulsante. Per impostazione predefinita, questa proprietà non è selezionata.	`Boolean`

Esempio

In questo esempio, le seguenti proprietà di configurazione dell'aspetto sono impostate per la vista Icona:

Stile colore è impostato su Danger.
Dimensione icona è impostata su 43.
Icona è impostata su gear.

Queste proprietà e i relativi valori risultano in un'icona a forma di ingranaggio simile alla seguente figura:

Tuttavia, se l'icona è nidificata all'interno di una sezione che è stata impostata su "sola lettura", come un layout orizzontale, un layout verticale o una vista, l'icona diventa leggermente più nitida. Ad esempio:

Immagine di un'icona di ingranaggio dimmer nidificata all'interno di una sezione di sola lettura

L'icona dimmer può essere un problema se altre viste di icone al di fuori della sezione di sola lettura sono impostate sullo stesso colore. Per assicurarsi che il colore dell'icona non cambi quando è nidificata in una sezione di sola lettura, è possibile impostare il gestore eventi On load per utilizzare il metodo setEnabled . Ad esempio:

me.setEnabled(true)

Eventi

Impostare o modificare i gestori eventi per la vista nelle proprietà Eventi . È possibile impostare gli eventi da attivare in modo programmatico o quando un utente interagisce con la vista. Per informazioni su come definire e codificare gli eventi, vedere Eventi definiti dall'utente. La vista Icona ha i seguenti tipi di gestori eventi:

On load: attivato quando la pagina viene caricata. Ad esempio:
```
me.setIcon("gears")
```
On click: attivato quando si fa clic sul link, prima di uscire dalla pagina. Se l'espressione valutata restituisce false, il clic non attiva l'evento di limite. Ad esempio:
```
return ${Text1}.isValid();
```
On boundary event: attivato quando è presente un evento limite. Questo gestore eventi funziona al meglio con gli eventi di limite che terminano con un evento Stay on Page , poiché la logica in questo evento viene attivata quando si ritorna alla pagina. Il gestore eventi On boundary event è utile in quelle situazioni in cui la logica deve verificarsi dopo la logica lato server attivata dall'evento di limite. Ad esempio:
```
alert("Stay on Page status '" + status + "'")
```

Metodi

Per informazioni dettagliate sui metodi disponibili per Icon, consultare Icona JavaScript API.

Ulteriori risorse

Per informazioni su come creare un coach o una pagina, consultare Creazione di coach.
Per informazioni sulle proprietà standard (Generale, Configurazione, Posizionamento, Visibilitàe Attributi HTML), consultare Visualizza proprietà.