Condividi tramite


Aggiungere e spostarsi tra le schermate delle app canvas

Crea app moderne e reattive aggiungendo schermate predefinite per gli scenari applicativi più comuni. Gli schermi sono dotati di contenitori reattivi e controlli moderni che si adattano a schermi di diverse dimensioni. È anche possibile aggiungere schermate personalizzate con layout e controlli diversi.

Sono disponibili nuove schermate predefinite:

Screenshot del menu Nuova schermata in Power Apps Studio che mostra layout disponibili.

Aggiungere una nuova schermata

  1. Accedere a Power Apps.

  2. Creare un'app canvas o aprirne una per la modifica.

  3. Nella barra dei comandi, seleziona Nuova schermata, quindi seleziona un layout della schermata.

  4. Visualizza in anteprima l'app per vedere come appare su diversi dispositivi. Per ulteriori informazioni, consulta la sezione Anteprima di un'app.

Suggerimento

Per fare in modo che l'app si adatti alle dimensioni del display del dispositivo su cui viene eseguita, disattiva l'opzione Ridimensiona e adatta.

Schermata iniziale

La schermata di benvenuto è ideale per la prima schermata di un'app, in cui è possibile personalizzare riquadri come un'immagine, un titolo e una descrizione. È possibile modificare il numero di elementi aggiungendoli o rimuovendoli nel contenitore principale. Utilizza i riquadri per indirizzare gli utenti verso altre parti dell'app.

La Schermata iniziale presenta il seguente modello per i controlli:

  • Contenitore schermata
    • Contenitore intestazione
      • Intestazione
    • Contenitore principale
      • Contenitore
        • Contenitore immagine
          • Image
        • Contenitore titolo
          • Pulsante elemento funzione
          • Testo descrizione

Screenshot che mostra cosa appare quando si aggiunge un layout della schermata di benvenuto dal pulsante Nuova schermata.

Aggiungi e personalizza la Schermata iniziale

  1. Seleziona Nuova schermata>Schermata iniziale.

  2. Per modificare l'immagine di un riquadro, selezionala, quindi seleziona Modifica.

  3. Seleziona il controllo pulsante Elemento in evidenza e aggiungi il tuo testo nel riquadro Proprietà.

    Screenshot che mostra dove modificare il testo del riquadro dell'elemento in evidenza.

  4. Seleziona il testo Breve descrizione o messaggio descrittivo e aggiungi il tuo.

  5. Aggiungere e rimuovere gli stessi riquadri se necessario.

    • Per aggiungere riquadri nella visualizzazione ad albero, copia e incolla un elemento Contenitore.

    • Per rimuovere un riquadro nella visualizzazione ad albero, fai clic con il pulsante destro del mouse su un Contenitore, quindi seleziona Elimina.

Utilizza la schermata Intestazione e galleria per mostrare una serie di informazioni su prodotti o servizi, come un catalogo di prodotti. Quando connetti un controllo Raccolta a un'origine dati, viene creato automaticamente un catalogo con una personalizzazione minima richiesta.

Il controllo galleria nella schermata Intestazione e galleria è un controllo classico. Quando viene rilasciato il controllo moderno della galleria, la schermata Intestazione e galleria lo utilizza. Per ulteriori informazioni, consulta la Panoramica dei controlli e dei temi moderni nelle app canvas.

La schermata Intestazione e galleria presenta il seguente modello per i controlli:

  • Contenitore dello schermo
    • Contenitore intestazione
      • Intestazione
    • Contenitore principale
      • Raccolta
        • Contenitore della galleria
          • Contenitore immagine
            • Image
          • Contenitore titolo
            • Testo del titolo
            • Testo descrizione
          • Contenitore Pulsante
            • Button

Screenshot che mostra l'intestazione e la schermata Raccolta.

  1. Seleziona Nuova schermata>Intestazione e raccolta.

  2. Nella visualizzazione ad albero, seleziona Raccolta e collegala a un'origine dati Dataverse.

  3. Seleziona controlli specifici all'interno della raccolta come l'immagine, il testo del titolo e la descrizione del testo. Nelle proprietà del controllo, utilizzare la sintassi ThisItem per impostare l'immagine desiderata, il testo del titolo e la descrizione.

    Ad esempio, per aggiungere Nome account al controllo del testo del titolo, trovalo digitando ThisItem nella barra delle formule per visualizzare un elenco di elementi disponibili da aggiungere dal tuo set di dati.

    Screenshot che mostra dove utilizzare ThisItem nella barra della formula.

Schermata richiesta di approvazione

La schermata Richiesta di approvazione presenta un'intestazione, un modulo con un pulsante di invio e una galleria con fasi predefinite. La schermata Richiesta di approvazione è utile negli scenari in cui le azioni vengono attivate dall'invio di moduli, ad esempio l'invio di una richiesta di approvazione o la visualizzazione di un flusso di lavoro per un'azienda.

Suggerimento

Quando aggiungi una schermata di richiesta di approvazione, ti viene chiesto di connetterlo a un'origine dati. L'origine dati determina i nomi dei campi nel modulo di richiesta.

La schermata Richiesta di approvazione presenta il seguente modello per i controlli:

  • Contenitore dello schermo
    • Contenitore intestazione
      • Intestazione
    • Contenitore principale
      • Contenitore modulo
        • Testo titolo modulo
        • Modulo di approvazione
        • Pulsante Invia
      • Contenitore intestazione laterale
        • Testo revisori
        • Raccolta revisori

Screenshot che mostra la schermata Richiesta di approvazione.

Aggiungi e personalizza la schermata Richiesta di approvazione

  1. Seleziona Nuova schermata>Richiesta di approvazione.

  2. Nella visualizzazione ad albero in ApprovalForm, ti viene chiesto di connetterti a un'origine dati, ad esempio Dataverse.

  3. Scegli un'origine dati.

  4. Per visualizzare i dettagli delle fasi di approvazione, nella visualizzazione ad albero, nel nodo SidebarContainer, seleziona ReviewersGallery. Quindi nel riquadro delle proprietà, seleziona la scheda Avanzate e vai a Elementi.

    Le fasi di approvazione presentano i seguenti dettagli:

    • Nome: nome della fase o del responsabile delle approvazioni
    • Titolo: sottotitolo della fase o del responsabile delle approvazioni
    • Stato: stato fase
    • Corrente: se questa fase è la fase corrente della richiesta di approvazione

    Screenshot che mostra la proprietà avanzata Elementi.

È possibile aggiungere un flusso di lavoro di approvazione di Power Automate nel pulsante per avvisare il responsabile dell'approvazione. Ulteriori informazioni in Creare e testare un flusso di lavoro di approvazione con Power Automate.

Intestazione e modulo

La schermata Intestazione e modulo presenta un'intestazione, un modulo e due pulsanti per inviare il modulo o annullare l'invio del modulo. Questa schermata è ideale per utilizzare un modulo a schermo intero.

La schermata Intestazione e modulo ha il seguente modello per i controlli:

  • Contenitore dello schermo
    • Contenitore intestazione
      • Intestazione
    • Contenitore principale
      • Contenitore modulo
        • Modulo
      • Contenitore Pulsante
        • Pulsante Annulla
        • Pulsante Invia

Screenshot che mostra la schermata Intestazione e modulo.

Aggiungere e personalizzare la schermata Intestazione e modulo

  1. seleziona Nuova schermata>Intestazione e modulo.

  2. Nella visualizzazione ad albero, viene visualizzato il Modulo selezionato e viene visualizzato un messaggio che ti chiede di collegare il modulo a un'origine dati.

  3. Scegli un'origine dati.

  4. Facoltativamente, per garantire la migliore reattività dello schermo, seleziona ogni scheda dati sul modulo e imposta la sua proprietà Adatta larghezza su Attivo nella scheda Visualizzazione del riquadro Proprietà .

Intestazione e tabella

La schermata Intestazione e tabella presenta due controlli, un controllo intestazione e un controllo tabella. Questo modello è ottimo per mostrare una tabella dati dettagliata su uno schermo.

La schermata Intestazione e tabella presenta i seguenti controlli:

  • Contenitore intestazione
    • Intestazione
  • Contenitore principale
    • Table

Aggiungi e personalizza la schermata Intestazione e tabella

  1. Seleziona Nuova schermata>Intestazione e tabella.

  2. Nella visualizzazione ad albero, seleziona Tabella e collegala a un'origine dati.

Tabella e modulo

La schermata Tabella e modulo contiene due controlli principali: il controllo Tabella moderno e il controllo Modulo moderno. Questo modello contiene formule Power Fx integrate per consentire una facile connessione e personalizzazione dei dati. Questo modello è ideale per selezionare e modificare un record utilizzando un modulo.

La schermata Tabella e modulo contiene i seguenti controlli:

  • Contenitore schermata
    • Contenitore intestazione
      • Controllo Intestazione
    • Contenitore del corpo
      • Input testo (ricerca)
      • Controllo tabella
      • Controllo Modulo
      • Pulsante
        • Nuovo
        • Modifica
        • Elimina
        • Invio
        • Annullamento

Screenshot che mostra la schermata Tabella e modulo.

Aggiungi e personalizza la schermata Tabella e modulo

In Power Apps Studio:

  1. Seleziona Nuova schermata>Tabella e modulo.

  2. Seleziona Dati nella barra delle azioni inline.

  3. Seleziona l'origine dati desiderata.

    Screenshot che mostra la posizione del pulsante Dati, dove puoi selezionare un'origine dati da un elenco.

    Una volta connesso, sia i controlli della tabella che quelli del modulo vengono associati all'origine dati.

È possibile selezionare un record nel controllo tabella e il modulo visualizzerà i dettagli del record selezionato.

Tutti i pulsanti in questo modello hanno una funzione Power Fx predefinita, quindi non c'è bisogno di ulteriori personalizzazioni. Una volta collegato lo schermo alla sorgente dati selezionata, lo schermo è ora pienamente funzionante.

Screenshot che mostra la visualizzazione dello schermo quando si è connessi a un'origine dati: un elenco di dati e i relativi elementi del modulo con un pulsante di invio.

Riordinare le schermate

Se nella tua app sono presenti più schermate, puoi disporle in un ordine diverso nella visualizzazione ad albero.

Seleziona il menu di scorrimento di una schermata che desideri riordinare, quindi seleziona Sposta su o Sposta giù.

Screenshot che mostra dove si trova il menu di overflow per spostare una schermata verso l'alto o verso il basso nella visualizzazione ad albero.

Utilizzare la proprietà StartScreen per calcolare la schermata da visualizzare per prima.

Aggiungere l'esplorazione

Se la tua app contiene più schermate, puoi aggiungere una navigazione per consentire agli utenti di spostarsi tra di esse.

  1. Con la schermata selezionata, seleziona Inserisci. Nella casella di ricerca, digita Freccia avanti quindi selezionala.

  2. Sposta la freccia nel punto in cui vuoi che appaia sullo schermo.

  3. Con la freccia selezionata, imposta la proprietà OnSelect sulla funzione Esplora; ad esempio, Navigate(Target, Fade).

    Sostituisci Destinazione con il nome della schermata in cui vuoi spostarti.

    Screenshot della proprietà OnSelect impostata sulla funzione Esplora.

    In questo esempio, quando un utente seleziona la freccia, viene applicata la dissolvenza in entrata alla schermata di destinazione.

  4. Nello stesso modo, nella schermata Destinazione, aggiungi un'icona Freccia indietro. Imposta la sua proprietà OnSelect , ad esempio, Navigate(Target, ScreenTransition.Fade).

    Sostituisci Destinazione con il nome della schermata a cui vuoi tornare.

Informazioni di riferimento sul controllo dello schermo