Esercizio: Creazione della prima app Power Apps come sviluppatore tradizionale

Completato

In questa unità si crea un'app per dispositivi mobili per aiutare le persone che lavorano sul campo a controllare l'inventario e ordinare le parti di ricambio, se necessario. Si usa Excel come origine dati per i "dati di sviluppo" per creare l'app senza dover ancora eseguire la connessione a sistemi esistenti come Microsoft SQL Server o Salesforce.

Esistono centinaia di connettori dati a cui Power Apps può connettersi immediatamente, per molti prodotti e servizi Microsoft e anche per servizi di terze parti. Se non è disponibile un connettore per ciò di cui si ha bisogno, uno sviluppatore può creare un connettore personalizzato per stabilire la connessione desiderata.

Nota

Power Apps richiede una licenza di Microsoft 365 o una versione di valutazione gratuita. Sono disponibili altre informazioni sulle opzioni di licenza. I prodotti Microsoft includono Microsoft Power Apps e Power Automate.

Connessione a un'origine dati

Per stabilire una connessione a un'origine dati, attenersi alla procedura indicata di seguito:

  1. Scaricare la cartella di lavoro Flooring Inventory e salvarla in OneDrive.

  2. Andare alla pagina https://make.powerapps.com e accedere con il proprio account aziendale.

  3. Dalla schermata iniziale selezionare il pulsante + Crea dal pannello di spostamento a sinistra.

  4. Selezionare Excel nelle opzioni "Inizia da".

  5. Potrebbe essere richiesto di selezionare una connessione esistente o di crearne una nuova. Assicurarsi di selezionare o creare una connessione OneDrive.

  6. Sul lato destro dello schermo verrà richiesto di Scegliere un file Excel. Trovare/selezionare FlooringInventory.xlsx.

  7. In Scegli una tabella selezionare FlooringEstimates, quindi selezionare il pulsante Connetti in basso a destra dello schermo.

Power Apps genera l'app esaminando i dati e trovando una corrispondenza con le funzionalità di Power Apps, in modo da ottenere un'app a tre schermate funzionante come punto di partenza.

Anteprima dell'app generata

Ora la nuova app a tre schermate si apre in Power Apps Studio.

Screenshot della finestra di sviluppo principale di Power Apps per Power Apps Studio.

Per visualizzare l'anteprima dell'app, selezionare il tasto F5 oppure l'icona Riproduci nell'angolo in alto a destra della barra dei comandi. Notare che l'app include tutti i dati della tabella e offre un'esperienza predefinita ottimale. È possibile usare il campo di ricerca in alto, selezionare un elemento per visualizzarne i dettagli e altro ancora.

Tutte le app generate a partire dai dati presentano lo stesso set di schermate visualizzabili dal pannello Visualizzazione struttura ad albero:

  • Schermata di esplorazione: questa schermata viene visualizzata per impostazione predefinita. In questa schermata è possibile esplorare, ordinare, filtrare e aggiornare i dati dall'origine dati. Per aggiungere elementi all'origine dati nella schermata di esplorazione, selezionare l'icona più (+).
  • Schermata dei dettagli: questa schermata presenta tutti i dettagli relativi a un singolo elemento. In questa schermata è possibile aprire un elemento per modificarlo o eliminarlo.
  • Schermata di modifica/creazione: in questa schermata è possibile modificare un elemento esistente oppure crearne uno nuovo.

Esplorazione dell'app generata

Selezionare l'icona (X) nell'angolo in alto a destra dell'anteprima per riportare l'app in modalità di modifica. Notare che l'app, anche in modalità di modifica, è attivamente in esecuzione, come se fosse in modalità espressione di controllo per un'applicazione tradizionale. Man mano che si apportano modifiche alle proprietà di controllo e alle formule Power fx, l'app risponderà automaticamente a tali modifiche, anche in modalità di modifica.

Suggerimento

Per passare temporaneamente alla modalità di anteprima mentre è attiva la modalità di modifica, tenere premuto ALT. Notare che quando si tiene premuto quel tasto, se si seleziona l'app, questa funzionerà come se fosse in modalità di anteprima. Quando si rilascia il tasto, si tornerà automaticamente alla modalità di modifica e sarà possibile selezionare l'app per usare i controlli normalmente.

Aggiunta della schermata di richiesta di scorte

L'app generata include una schermata per l'aggiunta di righe di dati basata sulla schermata di modifica dei dati riadattata, ma usa l'icona (+) per consentire all'utente di richiedere l'aggiunta di ulteriori scorte al magazzino dall'ufficio domestico.

  1. Selezionare la schermata EditScreen1 screen dal pannello Visualizzazione struttura ad albero sul lato sinistro della schermata.

  2. Selezionare ... sul lato destro dove EditScreen1 è ora evidenziato, quindi selezionare Duplica la schermata.

  3. Fare clic con il pulsante destro del mouse su EditScreen1_1 nella visualizzazione struttura ad albero e selezionare Rinomina. Digitare InventoryRequest come nuovo nome della schermata, quindi premere INVIO per salvarla.

  4. Selezionare BrowseScreen1 nella visualizzazione struttura ad albero per tornare alla prima schermata, quindi usare l'icona (+) in alto a destra della schermata dell'app per selezionarla.

  5. Ora si procederà a modificare la proprietà OnSelect. Per impostazione predefinita, dovrebbe essere visualizzata nella barra della formula; se così non fosse, è possibile trovare/selezionare questa proprietà dall'elenco a discesa a sinistra della barra della formula. Sostituire il contenuto della barra della formula con l'espressione seguente:

        Navigate(InventoryRequest, ScreenTransition.None)
    
  6. Tenere premuto ALT e selezionare l'icona (+) per testare la funzione Navigate appena scritta: l'app dovrebbe caricare la schermata InventoryRequest da poco creata.

  7. Ora selezionare EditForm1_1 nella visualizzazione struttura ad albero e premere CANC per eliminare il controllo.

Aggiunta di controlli alla nuova schermata

  1. Selezionare il pulsante Inserisci dalla barra dei comandi per visualizzare il pannello Inserisci.

  2. Selezionare Etichetta di testo, quindi Input di testo per aggiungere entrambi i tipi di controllo alla schermata.

  3. Trascinare i due controlli sulla schermata in modo che si trovino sotto l'intestazione e siano allineati con il centro dello schermo. Notare come Power Apps aiuta ad allineare le cose tra loro mentre si trascinano i controlli.

  4. Selezionare l'etichetta nella schermata dell'app e nel pannello Proprietà sul lato destro modificare il valore della proprietà Text in Motivo della richiesta.

  5. Selezionare la casella di testo nella schermata dell'app e nel pannello Proprietà sul lato destro modificare il valore della proprietà Default in Scorte necessarie per soddisfare le esigenze dei clienti.

  6. Usare Inserisci per aggiungere un'altra Etichetta di testo alla schermata.

  7. Selezionare nuovamente Inserisci e usare la casella di ricerca per cercare un controllo a discesa. Immettere "discesa" e selezionare Elenco a discesa per aggiungere un controllo a discesa alla schermata.

  8. Selezionare e trascinare entrambi i controlli per allinearli con gli altri controlli e l'uno con l'altro, quindi modificare il testo sulla nuova etichetta in Articolo di magazzino.

  9. Selezionare il controllo a discesa, quindi nel pannello delle proprietà a destra selezionare il menu a discesa della proprietà Items e scegliere FlooringEstimates. Quindi, selezionare il menu a discesa della proprietà Value e scegliere Name.

  10. Selezionare l'etichetta della proprietà Items e notare che il cursore è ora attivo nella barra della formula, con la proprietà Items selezionata.

  11. Ordinare gli elementi per nome immettendo la seguente formula:

        Sort(FlooringEstimates, Name, SortOrder.Ascending)
    

    Finestra di modifica di Power Apps Studio che mostra gli errori nell'app dopo l'ultimo passaggio

Correzione degli errori e aggiunta di una connessione dati

  1. Selezionare l'icona in alto a destra della schermata dell'app. La proprietà OnSelect dell'icona viene mostrata nella barra della formula. Modificare la formula in Back(). Il messaggio di errore verrà annullato.

  2. Selezionare l'icona dei dati sul lato sinistro della schermata per visualizzare il pannello Dati. La connessione OneDrive con cui è stata avviata l'app è inclusa nell'elenco.

  3. Selezionare ➕ Aggiungi dati per aprire il pannello di ricerca delle connessioni e cercare Office 365 Outlook.

  4. Se si è già definita una connessione, selezionarla per aggiungerla. Se l'elenco non include alcuna connessione, selezionare Aggiungi una connessione; quando si apre il pannello per la nuova connessione sul lato destro, selezionare Connetti per aggiungere la connessione.

  5. Selezionare l'icona ✔ nell'intestazione dell'app. La proprietà OnSelect dell'icona è stata selezionata per la barra della formula.

  6. Modificare la formula OnSelect dell'icona con la formula seguente. Questa formula invia un messaggio e-mail a se stessi (o all'utente dell'app), con la richiesta di ordinare più scorte.

Office365Outlook.SendEmailV2(
    User().Email,
    "New Request: " & TextInput1.Text,
    User().FullName & " has requested more inventory for " &
        Dropdown1.Selected.Name & " be ordered. There is currently " &
        Dropdown1.Selected.InventoryInSquareFeet & " square feet left in stock."
);
Back()

Nota

Per aggiungere più istruzioni in un evento, usare un punto e virgola (;) per separarle.

Un esempio dell'e-mail inviata quando una richiesta viene salvata nell'app

Salvataggio e pubblicazione dell'app

Per rendere visibile l'app sul telefono, è necessario salvarla e pubblicarla. Sulla barra multifunzione, in alto a destra, selezionare la freccia del menu a discesa accanto all'icona Salva e scegliere Salva con nome. Sostituire il titolo corrente "App" con Inventario pavimentazione e selezionare Salva. Ora selezionare l'icona Pubblica dalla barra multifunzione e dopo pochi minuti sarà possibile accedere e utilizzare l'app sul telefono.

La prima volta che si salva una nuova app, viene richiesto di procedere alla pubblicazione, rendendo "live" questa versione. Dopo il primo, i salvataggi aggiuntivi non vengono pubblicati automaticamente, ma vengono salvati come nuove versioni. In futuro, è necessario selezionare il pulsante Pubblica che appare nella schermata di salvataggio dopo aver fatto clic su Salva.

Installazione dell'app sul dispositivo

Per vedere come viene eseguita l'app sul dispositivo mobile, installare l'app Power Apps Mobile sul telefono. Quando si crea un'app, è necessario testarla nello stesso fattore di forma usato dagli utenti.

  1. Scaricare Power Apps Mobile dall'app store per la piattaforma che si desidera usare.

  2. Accedere usando nome utente e password di Office 365.

  3. Sul telefono o tablet eseguire l'app Inventario pavimentazione in Power Apps Mobile. Se non si vuole installare l'app, è possibile eseguirla in un browser.

  4. Se non si vede l'app Inventario pavimentazione, nell'app Power Apps Mobile, selezionare il menu a forma di hamburger nella parte superiore sinistra dello schermo e attivare Mostra app non di produzione.

Come abbiamo visto, creare e modificare un'app da una tabella Excel è estremamente semplice. Non è stata necessaria una codifica complessa da parte dell'utente ed è stato possibile apportare rapidamente alcune modifiche con poco codice per soddisfare meglio le proprie esigenze.