Esercizio - Introduzione alle formule nelle app canvas

  • 8 minuti

È possibile aggiungere formule ai controlli in Power Apps. Occorre ricordare che un'etichetta di testo ha bisogno solo di testo e un controllo immagine ha bisogno di un'immagine, ad esempio. Se si fornisce l'input che Power Apps sta cercando, si può inserire qualsiasi variante purché la formula rifletta il tipo di input previsto dal controllo.

Nell'esercizio seguente, si modificherà la raccolta in modo che "Machine Price" mostri un valore in valuta e si modificherà il colore del testo del campo "Type" in modo che appaia come il colore della macchina da caffè. Quest'app si basa sull'app creata nell'ultima unità, quindi se non è stata ancora completata, tornare all'ultima unità per completarla.

Una volta aperta l'app "Macchine Contoso Coffee", continuare con i passaggi seguenti:

  1. Selezionare "Catalog Screen" dal pannello Visualizzazione struttura ad albero.

    Nota

    È possibile passare tra le schermate anche tramite il menu a discesa che si trova nell'angolo in basso della schermata di visualizzazione corrente. Se si seleziona il menu a discesa, si noterà che la schermata corrente è indicata con un segno di spunta ed è evidenziata in grigio scuro.

  2. Selezionare la Raccolta, quindi selezionare il controllo Subtitle1 e cercare la proprietà Text, che visualizza ThisItem.'Machine Price'.

  3. Per aggiungere il simbolo di valuta del dollaro USA, impostare la proprietà Text su:

    Text(Value(ThisItem.'Machine Price'), "$ ##.00")

    Tenere a mente l'ordine delle operazioni matematiche quando si usa una formula. Tutto ciò che è all'interno delle parentesi viene elaborato per primo. La formula prende il valore di "Machine Price", poiché nella tabella dati è stato inserito come testo. Si dichiara questo valore come numerico racchiudendolo nella funzione Value(). Quindi si formatta il risultato come Testo aggiungendo il simbolo del dollaro insieme al numero e ai valori in centesimi, anche se il valore in centesimi è zero.

    Nota

    Se la formula restituisce un errore, è possibile che l'impostazione della lingua dell'ambiente Power Apps influisca su alcuni separatori e operatori. Ad esempio, la formula precedente è espressa in una lingua e una regione che usano il punto come separatore decimale, come il Giappone o il Regno Unito.

    Tuttavia, questa stessa formula in una lingua e in una regione in cui viene usata una virgola come separatore decimale, come Francia o Spagna, dovrà essere: Text(Value(ThisItem.'Machine Price'); "$ ##,00")

    L'operatore di selezione della proprietà "." (punto) in ThisItem.Price è sempre lo stesso, indipendentemente dal separatore decimale, ma notare che il separatore decimale e il separatore dell'operazione di concatenamento sono cambiati rispettivamente in virgola e punto e virgola. Internamente la formula non cambia. Cambia solo il modo in cui viene visualizzata e modificata dall'autore.

  4. Si cambia ora la proprietà Color dell'etichetta Body1 nella raccolta. Selezionare il controllo Body1 e cercare la proprietà Text, che viene visualizzata come ThisItem.Type.

  5. Trovare la proprietà Color per Body1. La formula indica "Black". Se si seleziona all'interno del campo di input della formula, viene visualizzato "Color.Black". Subito sotto il campo di input della formula, Power Apps mostra una formula che indica Color.Black = e un quadrato riempito di nero. Dichiara inoltre che il Tipo di dati è Colore.

    Nota

    Alcuni campi, come i campi Colore, mostrano solo il valore completo della formula quando si seleziona il campo di input della formula. Quando si inserisce un valore di colore, è necessario includere tutte le parti della formula in modo che Power Apps comprenda il significato dell'input. In questo caso la formula deve essere Color.Black.

  6. Proviamo ora a modificare la proprietà Color dell'etichetta Body1 in Color.Purple. È possibile che si sia notato che non appena si è digitata la parola "Color", Power Apps ha iniziato a suggerire automaticamente i possibili valori per il resto del campo sotto la barra della formula. In questa sintassi, Power Apps riconoscerà tutti i colori HTML disponibili.

  7. Se si guarda ora il controllo del modulo a destra della raccolta (senza selezionarlo), si noterà la presenza di un campo denominato "Primary Color". I dati in uso sono scritti in modo da poter utilizzare il valore di questo campo nella formula. Nel campo della proprietà Color per l'etichetta Body1, modificare l'input nella formula seguente:

    ColorValue(ThisItem. 'Primary Color')

    Si noterà che il colore del testo nell'etichetta Body1 corrisponde al valore di Primary Color della macchina da caffè. Power Apps può utilizzare la formula ColorValue per sostituire il nome testuale di un colore in un valore di colore. Si può vedere subito sotto la barra della formula che Power Apps visualizza il tipo di dati come Colore e cambia il colore di tutti gli elementi della raccolta in base al colore primario della macchina.

    Screenshot delle proprietà.

  8. Si aggiungono ora alcune intestazioni alle nuove schermate create. A tal fine, si copieranno alcuni controlli dalla schermata Catalog Screen e li si incollerà nelle nuove schermate. Tenendo premuto il testo MAIUSC, selezionare i controlli Rectangle1 e Label1 nella parte superiore della schermata "Catalog Screen" (sono selezionabili anche dal pannello Visualizzazione struttura ad albero). Fare clic con il pulsante destro del mouse e selezionare "Copia" oppure utilizzare la combinazione di tasti CTRL+C per copiare i controlli negli Appunti del proprio dispositivo.

    Suggerimento

    Sono disponibili alcune funzionalità interessanti quando si fa clic con il pulsante destro del mouse su un controllo o su più controlli selezionati. Queste funzionalità verranno visualizzate accanto ai controlli selezionati. Non è solo possibile tagliare e copiare, ma si può anche raggruppare, riordinare, allineare o aggiungere commenti (per altri utenti). A seconda del tipo di controllo, saranno disponibili caratteristiche come il carattere, la dimensione, il colore e il riempimento.

    Screenshot della selezione di Label1 e Rectangle1 e del successivo clic con il pulsante destro del mouse per copiare.

  9. Selezionare ora la schermata "Home Screen" e incollarvi i due controlli. Riposizionarli in modo che siano entrambi centrati nella parte superiore della schermata.

  10. Successivamente, selezionare la schermata "Admin Screen" e ripetere l'operazione di incolla. Riposizionare anche qui i controlli.

  11. Successivamente, utilizzando la proprietà Text dei controlli etichetta inseriti, si cambierà il nome in modo che rifletta i nomi nella schermata. Selezionare il controllo etichetta nell'intestazione della schermata "Admin Screen". Ricordarsi che tutto ciò di cui ha bisogno un controllo etichetta è il testo. Inserire quanto segue nella proprietà Text del controllo etichetta dell'intestazione:

    ‘Admin Screen’.Name

    Suggerimento

    È possibile che si sia notato che quando si è iniziato a digitare "Admin Screen", Power Apps ha visualizzato alcune informazioni potenziali di "Admin Screen" che si potrebbero utilizzare come testo in questa etichetta. Le etichette sono un controllo di vitale importanza da aggiungere all'app durante lo sviluppo perché possono visualizzare informazioni che altrimenti non si potrebbero vedere. Le si può aggiungere/rimuovere dall'app in base alle esigenze.

    Screenshot della ridenominazione dell'etichetta dell'intestazione nella proprietà del nome della schermata.

  12. È stata usata semplicemente la proprietà Name da "Admin Screen". A questo punto si esegue la stessa operazione con la Home Screen inserendo quanto segue nella formula Text:

    ‘Home Screen’.Name

L'app sta prendendo forma man mano che si migliora la UX con le formule. La prossima unità illustra come aggiungere funzionalità di spostamento nell'app.