Aggiungere una casella di riepilogo, un elenco a discesa, una casella combinata e pulsanti di opzione a un'app canvas

Visualizza una singola colonna di dati (ad esempio, da una tabella a più colonne) in un'app canvas in modo che gli utenti possano selezionare uno o più elementi in un elenco.

  • Aggiungi una casella di riepilogo per consentire agli utenti di selezionare più di un'opzione.
  • Aggiungere un elenco a discesa o una casella combinata per occupare meno spazio in una schermata.
  • Aggiungi un set di pulsanti di opzione per un effetto di progettazione specifico.

Questo argomento è incentrato su caselle di riepilogo e pulsanti di opzione, ma gli stessi principi valgono per gli elenchi a discesa.

Prerequisiti

  1. Crea un'app canvas da modello vuoto.
  2. Informazioni su come aggiungere e configurare i controlli.

Creare un elenco semplice

  1. Aggiungi un controllo Casella di riepilogo denominato MyListBox e imposta la relativa proprietà Items su questa espressione:

    ["circle","triangle","rectangle"]

    La finestra di progettazione è simile alla seguente:

    Schermata con controllo Casella di riepilogo

  2. Nella scheda Inserisci seleziona Icone, seleziona il cerchio e spostalo sotto MyListBox:

    Aggiungi icona

  3. Aggiungi un triangolo e un rettangolo, quindi disponi le forme in una riga sotto MyListBox:

    Aggiungi forme

  4. Imposta la proprietà Visible delle forme sulle funzioni seguenti:

    Forma Imposta funzione Visible su
    cerchio If("circle" in MyListBox.SelectedItems.Value, true)
    triangolo If("triangle" in MyListBox.SelectedItems.Value, true)
    rettangolo If("rectangle" in MyListBox.SelectedItems.Value, true)
  5. Tenendo premuto il tasto ALT, seleziona una o più forme in MyListBox.

    Appariranno solo la forma o le forme selezionate.

In questa procedura viene usata un'espressione per creare un elenco di elementi. Puoi applicare la stessa procedura ad altri elementi all'interno dell'azienda. Ad esempio, puoi usare un controllo Elenco a discesa per visualizzare le immagini dei prodotti, le descrizioni dei prodotti e così via.

Aggiungere pulsanti di opzione

  1. Nella scheda Home seleziona Nuova schermata e quindi Vuoto.

  2. Nella scheda Inserisci seleziona Controlli e quindi Pulsante di opzione.

    Aggiungi pulsante di opzione

  3. Assegna al controllo Pulsante di opzione il nome Choices e imposta la relativa proprietà Items su questa formula:
    ["red","green","blue"]

    Rinominare il controllo

    Se necessario, ridimensiona il controllo per visualizzare tutte le opzioni.

  4. Nella scheda Inserisci seleziona Icone e quindi il cerchio.

  5. Imposta la proprietà Fill del cerchio sulla funzione seguente:
    If(Choices.Selected.Value = "red", Red, Choices.Selected.Value = "green", Green, Choices.Selected.Value = "blue", Blue)

    In questa formula il colore del cerchio cambia in base al pulsante di opzione scelto.

  6. Sposta il cerchio sotto il controllo Pulsante di opzione, come nel seguente esempio:

    Sposta il cerchio sotto il pulsante di opzione

  7. Tenendo premuto il tasto ALT, seleziona un altro pulsante di opzione per modificare il colore del cerchio.

Aggiungere un elemento a un elenco esistente

  1. Aggiungi un controllo Pulsante e denominalo "btnReset".

    Non sai come aggiungere un controllo, assegnargli un nome e configurarlo?

  2. Imposta la proprietà OnSelect di btnReset su questa formula:

    ClearCollect(MyItems, {value: "circle"},{value: "triangle"},{value: "rectangle"})
    
  3. Imposta la proprietà Text in btnReset su "Reset".

  4. Aggiungi un controllo Casella di riepilogo denominato lbItems, quindi imposta la relativa proprietà Items su MyItems.

  5. Seleziona il pulsante Reimposta tenendo premuto il tasto ALT.

    Nota

    La casella di riepilogo dovrebbe essere popolata con gli elementi della raccolta "MyItems".

  6. Disponi la casella di riepilogo e il pulsante in modo che siano allineati verticalmente.

    Pulsante Casella di riepilogo.

  7. Aggiungi un controllo Input di testo e denominalo "txtAdd".

  8. Imposta la proprietà Text di txtAdd su "".

  9. Aggiungi un controllo Pulsante e denominalo "btnAdd".

  10. Imposta la proprietà Text di btnAdd su "Add".

  11. Imposta la proprietà OnSelect di btnAdd sulla formula seguente:

    Collect(MyItems,{value: txtAdd.Text}); Reset(txtAdd)
    

    Nota

    • La funzione collect aggiungerà il testo dall'input di testo come elemento nella raccolta.
    • La funzione di ripristino ripristinerà l'input di testo al suo stato predefinito.
  12. Disponi txtAdd e btnAdd in modo che siano allineati verticalmente sotto lbItems e btnReset.

    Tutti i controlli - prima di aggiungere.

  13. Visualizza l'anteprima dell'app premendo F5.

  14. Aggiungi un valore al controllo Input di testo txtAdd.

  1. Premi il pulsante Aggiungi.

    Nota

    La casella di riepilogo dovrebbe essere popolata con gli elementi della raccolta MyItems.

(Facoltativo) Rimuovere un elemento da un elenco esistente

  1. Aggiungi un controllo Pulsante e denominalo "btnDelete".

  2. Imposta la proprietà Text di btnDelete su "Delete".

  3. Imposta la proprietà OnSelect di btnDelete sulla formula seguente:

    Remove(MyItems, lbItems.Selected)
    
  4. Disponi btnDelete in modo che sia allineato verticalmente sotto btnReset

    Tutti i controlli con il pulsante Elimina.

  5. Visualizza l'anteprima dell'app premendo F5.

  6. Premi il pulsante Reimposta per reimpostare la casella di riepilogo.

  7. Premi un elemento nella casella di riepilogo per selezionarlo.

  1. Premere il pulsante Elimina per eliminare l'elemento.

Nota

Puoi indicarci le tue preferenze di lingua per la documentazione? Partecipa a un breve sondaggio. (il sondaggio è in inglese)

Il sondaggio richiederà circa sette minuti. Non viene raccolto alcun dato personale (Informativa sulla privacy).