Definizione delle azioni della barra degli strumenti mediante un'infotable

Mashup Builder > Widget > Widget standard > Widget Barra degli strumenti (con tema applicabile) > Definizione delle azioni della barra degli strumenti mediante un'infotable

Utilizzare la data shape ToolbarAction per creare un'infotable che definisca le azioni da visualizzare sulla barra degli strumenti. Ogni riga dell'infotable corrisponde a un'azione sulla barra degli strumenti. È possibile creare un'infotable per configurare il widget nei modi descritti di seguito.

• Impostare il numero e il tipo di azioni da visualizzare.

• Controllare l'ordine e la posizione delle azioni.

• Controllare la visibilità di ogni azione in base a una condizione o a un evento.

• Impostare la larghezza massima per ciascuna azione.

Nella procedura riportata di seguito vengono illustrati i passi per aggiungere e configurare un widget Barra degli strumenti.

1. Impostare i requisiti funzionali e quindi progettare le azioni da visualizzare sulla barra degli strumenti.

2. In Composer creare un servizio di configurazione della barra degli strumenti formattato utilizzando la data shape ToolbarAction.

3. In Mashup Builder aggiungere il widget Barra degli strumenti al mashup, quindi aggiungere l'entità al servizio di configurazione della barra degli strumenti.

4. Associare la proprietà Tutti i dati del servizio della barra degli strumenti alla proprietà ActionsData del widget.

Le proprietà associabili per ciascuna azione sulla barra degli strumenti vengono visualizzate nel pannello Proprietà nel seguente formato:

• <ActionID>_<NomeProprietà>

5. Nel pannello Proprietà configurare il widget, quindi creare associazioni ad altri widget o ad altre funzioni.

Per ulteriori informazioni sulle proprietà del widget, vedere Widget Barra degli strumenti (con tema applicabile).

Definizioni di campo comuni

• actionID - ID dell'azione nell'infotable. Questo valore viene utilizzato per identificare ogni azione durante la configurazione del widget nel pannello Proprietà in Mashup Builder.

• actionMaxWidth - Definizione di campo che specifica una larghezza massima personalizzata per un'azione. Per default, ogni azione sulla barra degli strumenti viene visualizzata utilizzando una larghezza massima di 100 pixel.

• actionTooltip - Definisce il contenuto di un messaggio di descrizione comando. È possibile anche aggiungere un'icona alla descrizione comando utilizzando la proprietà actionTooltipIcon.

• actionVisible - Controlla la visibilità di un'azione sulla barra degli strumenti.

• actionDisabled - Disattiva un'azione. È possibile controllare questo valore a livello di programmazione per attivare o disattivare un'azione in base a una condizione nel mashup.

• actionLabel - L'etichetta da visualizzare per un'azione sulla barra degli strumenti. Per le azioni Pulsante e Pulsante interruttore, l'etichetta viene visualizzata all'interno dell'azione.

• alignRight - Allinea l'azione a destra.

Oltre alle proprietà comuni, la data shape contiene definizioni di campo che consentono di configurare le azioni Pulsante, Pulsante interruttore, Link ed Elenco a discesa. Nella sezione che segue sono elencate le proprietà disponibili per ciascun tipo di azione con un esempio.

Pulsante

buttonIcon - Specifica l'icona da visualizzare all'interno del pulsante facendo riferimento a un nome di entità multimediale.

È possibile visualizzare le icone SVG dalla libreria delle icone SVG utilizzando la sintassi seguente cds:<icon_name>

Per ulteriori informazioni sulle icone disponibili, vedere Utilizzo delle icone SVG.

buttonType - Specifica lo stile visivo da utilizzare per il pulsante. Opzioni: primary, secondary, tertiary, danger, transparent.

Pulsante interruttore

toggleChipIcon - Specifica se visualizzare un'icona che indica lo stato del pulsante interruttore. Opzioni: true, false.

toggleLabelPosition - Controlla la posizione dell'etichetta rispetto all'icona. Opzioni: left, right.

Se le dimensioni della finestra sono troppo ridotte per visualizzare tutte le azioni, l'azione del pulsante interruttore viene visualizzata come casella di controllo ed etichetta nel menu extra.

Link

linkTargetWindow - Specifica la modalità di apertura dell'URL collegato. Opzioni: new, same, popup.

linkType - Tipo di link.

Elenco a discesa

• dropdownSeelctedText - Consente di selezionare una voce dall'elenco a discesa per default utilizzando il testo del valore. Ad esempio, utilizzare l'espressione seguente per selezionare Item 2 per default:

dropdownSeelctedText: "value2";

• dropdownLabelPosition - Specifica la posizione dell'etichetta dell'elenco a discesa. Opzioni: top, left

• dropdownData - Valore JSON che contiene i dati per ciascuna voce di menu presente nell'elenco. Ogni elemento è rappresentato da un oggetto JSON contenente i nomi dei campi e i valori associati. Ad esempio:

[{label:"Item 1", value: "value1"}, {label:"Item 2", value: "value2"}, {label:"Item 3", value: "value3"}]

Pulsante menu

• menuButtonData - Valore JSON che contiene i dati per ciascuna voce di menu nel pulsante del menu. Ogni voce è rappresentata da un oggetto JSON contenente i nomi dei campi e i valori associati in base alla data shape MenuEntry. Ad esempio:

[
  {
    "menuId": "item1",
    "title": "Item 1",
    "linkType": "Mashup",
    "linkDestination": "Item1Mashup",
    "isDefault": false,
    "parentMenuId": "",
    "imageURL": "item1_icon.png",
    "linkTarget": "Replace",
    "description": "Description for Item 1"
  }
]

• DisplayMenuIcons - Se il valore è false, le icone per le voci dei pulsanti di menu sono nascoste.

• allowMissingMenuIcons - Se il valore è false e DisplayMenuIcons è true, viene visualizzata un'icona di default accanto alle voci di menu ma nei dati dei pulsanti del menu non è indicata alcuna icona specifica.

• selectedDataChanged - Evento associabile che si attiva quando si fa clic su una voce di menu nel pulsante del menu.

Aggiunta di un filtro dati

È possibile utilizzare le proprietà del widget per aggiungere e configurare un filtro sul lato sinistro o destro della barra degli strumenti. Per ulteriori informazioni, vedere Widget Barra degli strumenti (con tema applicabile).

Organizzazione delle azioni sulla barra degli strumenti

Utilizzare l'infotable del servizio dati del widget per disporre le azioni sulla barra degli strumenti. Le azioni vengono disposte secondo l'ordine in cui si presentano nell'infotable. Inoltre, è possibile allineare le azioni a destra della barra degli strumenti utilizzando l'opzione alignRight.

Data shape ToolbarAction

Nella tabella che segue sono elencate le definizioni di campo della data shape ToolbarAction.

Definizione di campo

Descrizione

Tipo di base

actionMaxWidth

La larghezza massima dell'azione sulla barra degli strumenti.

NUMBER

toggleState

Stato del pulsante interruttore.

BOOLEAN

toggleChipIcon

Mostra o nasconde l'icona del chip, che viene utilizzata per indicare la selezione.

BOOLEAN

actionTooltip

Descrizione comando dell'azione.

STRING

actionVisible

Controlla la visibilità dell'azione.

BOOLEAN

alignRight

Allinea l'azione al lato destro della barra degli strumenti. Per allineare l'azione al lato sinistro, impostare il valore su False o Empty.

BOOLEAN

actionLabel

Etichetta dell'azione.

STRING

actionTooltipIcon

L'icona visualizzata all'interno della descrizione comando dell'azione.

IMAGELINK

actionType

Tipo di elemento da visualizzare per l'azione della barra degli strumenti (pulsante, link, elenco a discesa, pulsante interruttore o pulsante di menu).

STRING

linkDestination

URL del link.

STRING

buttonIcon

Icona da visualizzare sul pulsante.

IMAGELINK

actionDisabled

Controlla se l'azione è interattiva o disattivata.

BOOLEAN

buttonType

Variante da visualizzare per i pulsanti e i pulsanti di menu. È possibile selezionare Principale, Secondario, Terziario, Avviso di pericolo o Trasparente.

STRING

dropdownData

Valore JSON contenente dati per ciascun elemento dell'elenco a discesa. Ogni elemento è rappresentato da un oggetto JSON, che contiene l'etichetta, il valore e lo stato (facoltativo) dell'elemento.

JSON

actionId

Questa definizione di campo viene utilizzata come chiave principale per l'infotable.

Identificatore univoco per ogni riga dell'infotable. Ogni ID viene utilizzato come prefisso per le proprietà dell'azione associabile nel pannello Proprietà in Mashup Builder.

STRING

linkTargetWindow

Controlla la modalità di apertura della finestra di destinazione del link. È possibile aprire il link in una nuova finestra, nella finestra corrente o in una finestra di dialogo popup (Nuova finestra, Stessa finestra o Finestra popup).

STRING

linkType

Tipo di link.

STRING

dropdownSelectedText

Valore stringa dell'elemento da selezionare nell'elenco a discesa.

STRING

toggleLabelPosition

Controlla la posizione dell'etichetta del pulsante interruttore rispetto all'icona di stato. Opzioni: left,right

STRING

menuButtonData

Valore JSON che contiene i dati per ciascuna voce di menu nel pulsante del menu. Ogni voce è rappresentata da un oggetto JSON contenente i nomi dei campi e i valori associati in base alla data shape MenuEntry.

JSON

displayMenuIcons

Se il valore è false, le icone per le voci dei pulsanti di menu sono nascoste.

BOOLEAN

allowMissingMenuIcons

Se il valore è false e DisplayMenuIcons è true, viene visualizzata un'icona di default accanto alle voci di menu ma nei dati dei pulsanti del menu non è indicata alcuna icona specifica.

BOOLEAN

È stato utile?