Aggiungere e configurare un controllo in PowerAppsAdd and configure a control in PowerApps

È possibile aggiungere diversi elementi dell'interfaccia utente all'applicazione e configurarne l'aspetto e il comportamento direttamente dalla barra degli strumenti, nella scheda Proprietà o nella barra della formula.Add a variety of UI elements to your app, and configure aspects of their appearance and behavior directly, from the toolbar, in the Properties tab, or in the formula bar. Questi elementi dell'interfaccia utente sono denominati controlli e gli aspetti da configurare sono le relative proprietà.These UI elements are called controls, and the aspects that you configure are called properties.

PrerequisitiPrerequisites

  1. Iscriversi a PowerApps, installarlo, aprirlo e quindi accedervi fornendo le stesse credenziali utilizzate per l’iscrizione.Sign up for PowerApps, install it, open it, and then sign in by providing the same credentials that you used to sign up.
  2. In PowerApps Studio toccare o fare clic su Nuovo nel menu File (vicino al bordo sinistro).In PowerApps Studio, click or tap New on the File menu (near the left edge).

    Opzione Nuovo nel menu File

  3. Nel riquadro App vuota toccare o fare clic su Layout del telefono.On the Blank app tile, click or tap Phone layout.

    Creare un'app da zero

  4. Se viene richiesto di seguire la presentazione introduttiva, toccare o fare clic su Avanti per acquisire familiarità con le aree principali dell'interfaccia di PowerApps (oppure toccare o fare clic su Ignora).If you're prompted to take the intro tour, click or tap Next to get familiar with key areas of the PowerApps interface (or click or tap Skip).

    Schermata iniziale della presentazione

    È possibile seguire la presentazione in un secondo momento toccando o facendo clic sull'icona con il punto interrogativo nell'angolo in alto a destra e quindi scegliendo Take the intro tour (Presentazione introduttiva).You can always take the tour later by clicking or tapping the question-mark icon near the upper-right corner and then clicking or tapping Take the intro tour.

Aggiungere un controlloAdd a control

È possibile aggiungere qualsiasi controllo in un'ampia gamma di categorie facendo clic o toccando la scheda Inserisci della barra degli strumenti, facendo clic o toccando una categoria e quindi facendo clic o toccando il controllo da aggiungere.You can add any control in a variety of categories by clicking or tapping the Insert tab of the toolbar, clicking or tapping a category, and then clicking or tapping the control that you want. Questa sezione illustra i controlli di ogni categoria e consente di acquisire familiarità con i tipi di controlli che è possibile aggiungere e di sapere dove reperire ogni tipo.In this section, review the controls in each category to get familiar with the types of controls that you can add and where you might find each type.

  • Nella scheda Inserisci fare clic o toccare una di queste categorie e quindi fare clic o toccare il controllo da aggiungere:On the Insert tab, click or tap any of these categories, and then click or tap the control that you want to add:

    Text: Etichetta, Input di testo, Testo HTML, Input pennaText: Label, Text input, HTML Text, Pen input
    Controlli: Pulsante, Elenco a discesa, Selezione data, Casella di riepilogo, Casella di controllo, Radio, Attiva/Disattiva, Dispositivo di scorrimento, Valutazione, TimerControls: Button, Drop down, Date picker, List box, Check box, Radio, Toggle, Slider, Rating, Timer
    Raccolta: Verticale, Orizzontale, Altezza dinamica, Vuota verticale, Vuota orizzontale, Vuota ad altezza dinamicaGallery: Vertical, Horizontal, Flexible height, Blank vertical, Blank horizontal, Blank flexible height
    Tabella di datiData table
    Moduli: Modifica, Visualizzazione, EntitàForms: Edit, Display, Entity form
    Supporti: Immagine, Fotocamera, Codice a barre, Video, Audio, Microfono, Aggiungi immagineMedia: Image, Camera, Barcode, Video, Audio, Microphone, Add picture
    Grafici: grafico a barre, a linee, a tortaCharts: Column chart, Line chart, Pie chart
    IconeIcons

Suggerimento: se è necessario più spazio per i controlli, aggiungere un'altra schermata.Tip: If you need more space for controls, add another screen.

Configurare direttamente un controlloConfigure a control directly

In questa procedura verrà aggiunto e configurato un controllo Etichetta, ma è possibile applicare molti degli stessi principi ad altri controlli.In this procedure, you'll add and configure a Label control, but you can apply many of the same principles to other controls.

  1. Toccare o fare clic sulla scheda Inserisci e quindi toccare o fare clic su Etichetta.Click or tap the Insert tab, and then click or tap Label.

    Scheda Inserisci

    Quando si aggiunge un controllo viene selezionato per impostazione predefinita.When you add a control, it's selected by default. È anche possibile selezionare un controllo esistente toccando o facendo clic su di esso.You can also select an existing control by clicking or tapping it. Quando un controllo è selezionato, è racchiuso in una casella di selezione e altre aree dell'interfaccia utente cambiano in modo da consentire la configurazione del controllo selezionato.When a control is selected, a selection box surrounds it, and other areas of the UI change so that you can configure the selected control. Ad esempio, un controllo Etichetta selezionato è simile a questa immagine.For example, a selected Label control resembles this graphic.

    Etichetta selezionata

    Importante: se un controllo è selezionato quando si seleziona un altro controllo o un'area vuota della schermata, il primo elemento non è più selezionato.Important: If a control is selected when you select another control or a blank area of the screen, the first element is no longer selected.

  2. Per ridurre le dimensioni del controllo Etichetta, trascinare verso sinistra un quadratino sul bordo destro della casella di selezione.Make the Label control narrower by dragging a handle on the right edge of the selection box to the left. Il quadratino intermedio appare solo se si fa zoom avanti.(The middle handle appears only if you zoom in.)

    Etichetta ridimensionata

    È anche possibile ridimensionare un controllo modificandone l'altezza, la larghezza o entrambe le proprietà, come descritto più avanti in questo argomento.You can also resize a control by modifying its Height, Width, or both properties, as this topic describes later.

  3. Spostare il controllo Etichetta trascinando la casella di selezione o modificando X, Y o entrambe le proprietà, come descritto più avanti in questo argomento.Move the Label control by dragging the selection box itself (or by modifying the X, Y, or both properties, as this topic describes later).
  4. Fare tre volte clic sul testo visualizzato nel controllo Etichetta e quindi digitare Hello, world.Triple-click the text that appears in the Label control, and then type Hello, world.

    Etichetta con testo personalizzato

    È anche possibile modificare questo testo impostando la proprietà Text di questo controllo, come descritto più avanti in questo argomento.You can also modify this text by setting the Text property of this control, as this topic describes later.

Configurare un controllo dalla barra degli strumentiConfigure a control from the toolbar

Configurando un controllo dalla barra degli strumenti è possibile specificare più opzioni rispetto alla configurazione diretta del controllo.By configuring a control from the toolbar, you can specify a wider variety of options than you can by configuring a control directly.

  1. Con il controllo Etichetta selezionato, scegliere o toccare la scheda Home della barra degli strumenti.With the Label control selected, click or tap the Home tab of the toolbar.

    Scheda Home

  2. Toccare o fare clic su Riempimento e quindi selezionare o toccare un colore, ad esempio verde acqua.Click or tap Fill, and then click or tap a color such as aquamarine.

    Opzione Riempimento

    Il controllo Etichetta riflette la selezione.The Label control reflects your selection.

    Un'etichetta con riempimento verde acqua

  3. Modificare la famiglia di caratteri e la dimensione del testo (ad esempio, 18 pt.Change the font family and the size of the text (for example, to 18 pt. Georgia).Georgia).

    Controlli dei caratteri

    Il controllo Etichetta riflette la selezione.The Label control reflects your selection.

    18-point Georgia

  4. Scegliere o toccare la scheda Etichetta, scegliere o toccare AllineamentoVerticale e quindi scegliere o toccare In alto.Click or tap the Label tab, click or tap VerticalAlign, and then click or tap Top.

    Scheda della casella di testo

    Il controllo Etichetta riflette la selezione.The Label control reflects your selection.

    Un'etichetta con testo allineato alla parte superiore della casella

Configurare un controllo dalla scheda ProprietàConfigure a control from the Properties tab

Usando la scheda Proprietà è possibile configurare un controllo senza scrivere una formula.By using the Properties tab, you can configure a control without writing a formula. In questa procedura verrà aggiunto e configurato un altro controllo Etichetta, ma è possibile applicare molti degli stessi principi ad altri controlli.In this procedure, you'll add and configure another Label control, but you can apply many of the same principles to other controls.

  1. Aggiungere un altro controllo Etichetta come descritto in precedenza in questo argomento.Add another Label control as described earlier in this topic.
  2. Con il nuovo controllo selezionato, scegliere o toccare la scheda Proprietà nel riquadro di destra.With the new control selected, click or tap the Properties tab in the right-hand pane.

    Pannello Proprietà

  3. Nella casella testo digitare Scheda Proprietà.In the Text box, type Properties tab.

    Testo etichetta pannello Proprietà

    Il controllo Etichetta mostra il testo immesso.The Label control shows the entered text.

    Testo area di disegno pannello Proprietà

  4. Fare clic o toccare l'icona Riempimento nel pannello Proprietà, quindi fare clic o toccare un colore.Click or tap the Fill icon in the Properties panel, and then click or tap a color.

    Testo colore pannello Proprietà

    Il controllo Etichetta riflette la selezione.The Label control reflects your selection.

    Colore area di disegno pannello Proprietà

  5. Fare clic o toccare la proprietà Colore nel pannello Proprietà.Click or tap the Color property in the properties panel.

    Proprietà del pannello Proprietà

    Il valore della proprietà Colore è evidenziato nella barra della formula.The value of the Color property is highlighted in the formula bar.

    Espressione proprietà del pannello Proprietà

    1. Per eliminare il secondo controllo Etichetta, scegliere o toccare il controllo e quindi premere CANC.Delete the second Label control by clicking or tapping it and then pressing Delete.

Configurare un controllo nella barra della formulaConfigure a control in the formula bar

Usando la barra della formula è possibile impostare le proprietà che non si possono impostare direttamente nella scheda Proprietà né dalla barra degli strumenti.By using the formula bar, you can set properties that you can't set directly, in the Properties tab, or from the toolbar. Ad esempio, è possibile impostare una descrizione comando che appare quando un utente seleziona il controllo ma non lo tocca o non fa clic.For example, you can set a tooltip that appears when a user points to the control but doesn't click or tap it. È anche possibile specificare formule complesse che aumentano la potenza dell'app.You can also specify complicated formulas that increase the power of your app.

Ogni modifica apportata in precedenza in questo argomento ha aggiornato il valore di una proprietà per il controllo configurato.Each change that you made earlier in this topic updated the value of a property for the control that you configured.

  • Quando si ridimensiona il controllo, si modifica la proprietà Width.When you resized the control, you changed its Width property.
  • Quando si sposta il controllo, si modificano le proprietà X e Y.When you moved the control, you changed its X and Y properties.
  • Quando si modifica il testo visualizzato dal controllo, si modifica la relativa proprietà Text.When you changed the text that the control displays, you changed its Text property.

Anziché configurare un controllo direttamente nella scheda Proprietà o dalla barra degli strumenti, è anche possibile aggiornare il valore di una proprietà selezionandolo nell'elenco delle proprietà e quindi specificando un valore nella barra della formula.Instead of configuring a control directly, in the Properties tab, or from the toolbar, you can also update the value of a property by selecting it in the property list and then specifying a value in the formula bar. Adottando questo approccio, è possibile eseguire la ricerca di una proprietà in ordine alfabetico e specificare più tipi di valori.By taking this approach, you can search for a property alphabetically, and you can specify more types of values.

  1. Con il rimanente controllo Etichetta selezionato, scegliere o toccare Text nell'elenco delle proprietà, quindi digitare "My Company Name" (incluse le virgolette) nella barra della formula.With the remaining Label control selected, click or tap Text in the property list, and then type "My Company Name" (including the quotation marks) in the formula bar.

    Una stringa letterale in un'etichetta

    Quando si racchiudere una stringa di testo tra virgolette, si specifica che deve essere trattata esattamente come è stata digitata.When you surround a string of text with quotation marks, you specify that it should be treated exactly as you typed it. In alternativa, è possibile impostare il valore di una proprietà su una formula.As an alternative, you can set the value of a property to a formula.

  2. Con il controllo Etichetta selezionato, scegliere o toccare Text nell'elenco delle proprietà, quindi digitare Today() (senza virgolette) nella barra della formula.With the Label control selected, click or tap Text in the property list, and then type Today() (without quotation marks) in the formula bar.

    Il controllo visualizza la data corrente.The control shows the current date.

    Funzione Today

    Suggerimento: è possibile formattare date e ore in vari modi, oltre ad eseguire calcoli su di esse.Tip: You can format dates and times in various ways, in addition to performing calculations on them.

Configurare due controlli in modo che interagiscano tra loroConfigure two controls to interact with each other

In questa procedura verrà aggiunta un'etichetta e verrà configurata l'etichetta già creata in modo che appaia solo quando è selezionata la casella di controllo.In this procedure, you'll add a check box and then configure the label that you already have to appear only when the check box is selected.

  1. Toccare o fare clic sulla scheda Inserisci.Click or tap the Insert tab.

    Scheda Inserisci

  2. Toccare o fare clic su Controlli, quindi selezionare o toccare Casella di controllo.Click or tap Controls, and then click or tap Check box.

    Inserire una casella di controllo

  3. Spostare il controllo Casella di controllo in modo che sia visualizzato sotto il controllo Etichetta e impostare la proprietà Text del controllo Casella di controllo in modo che appaia Show text.Move the Check box control so that it appears below the Label control, and set the Text property of the Check box control so that Show text appears.

    Configurare la casella di controllo

  4. Con il controllo Casella di controllo ancora selezionato, fare clic o toccare il nome sopra alla scheda Proprietà, quindi digitare MyCheckboxWith the Check box control still selected, click or tap its name just above the Properties tab, and then type MyCheckbox

    Rinominare la casella di controllo

  5. Toccare o fare clic sul controllo Etichetta per selezionarlo.Click or tap the Label control to select it.
  6. Nella scheda Proprietà fare clic o toccare la proprietà Visibile.On the Properties tab, click or tap the Visible property.

    Proprietà Visible

  7. Nella barra della formula eliminare true, quindi digitare o incollare questa formula:In the formula bar, delete true, and then type or paste this formula:

    If(MyCheckbox.Value = true, true, false)If(MyCheckbox.Value = true, true, false)

    Questa funzione If indica che l'etichetta deve apparire solo quando è selezionata la casella di controllo.This If function states that the label should appear only when the check box is selected. Dato che la casella di controllo è deselezionata, il controllo Etichetta scompare (tranne la casella di selezione).Because the check box is cleared, the Label control disappears (except for the selection box).

    Formula Visible

  8. Fare clic o toccare il controllo Casella di controllo per aggiungere la casella di selezione e quindi fare clic o toccare di nuovo il controllo per aggiungere un segno di spunta.Click or tap the Check box control to add the selection box to it, and then click or tap it again to add a check mark.

    L'Etichetta riappare:The Label reappears:

    Etichetta visualizzata quando è selezionata la casella di controllo

  9. Deselezionare il controllo Casella di controllo per nascondere il controllo Etichetta.Clear the Check box control to hide the Label control.

    L'etichetta scompare quando la casella di controllo è deselezionata

Questo esempio è semplice, ma è possibile configurare il comportamento e l'aspetto dell'app creano una o più formule da semplici a complesse.This example is basic, but you can configure the behavior and appearance of your app by building one or more formulas from simple to complex.

Rinominare una schermata o un controlloRename a screen or a control

Rinominando una schermata o un controllo è possibile creare formule più facili da leggere e gestire.By renaming a screen or control, you can build formulas that are easier to read and maintain.

  1. Fare clic o toccare la schermata o il controllo da rinominare.Click or tap the screen or the control that you want to rename.
  2. Nel riquadro di destra, fare clic o toccare il nome del controllo (sopra la scheda Proprietà), quindi digitare il nome desiderato.In the right-hand pane, click or tap the name of the control (just above the Properties tab), and then type the name that you want.

    Rinominare la casella di controllo

Individuare e selezionare una schermata o un controlloFind and select a screen or a control

È possibile trovare e selezionare una schermata o un controllo, anche se è nascosto o sovrapposto a un altro controllo, eseguendo una ricerca nel riquadro a sinistra.You can find and select a screen or a control, even if it's hidden or overlaps with another control, by searching for it in the left-hand pane. Questo riquadro mostra un'anteprima di ogni schermata nell'app o una visualizzazione gerarchica di ogni schermata e dei controlli in essa contenuti.This pane shows either a thumbnail of each screen in the app or a hierarchical view of each screen and the controls that it contains.

  • Per alternare le anteprime e la visualizzazione gerarchica, fare clic o toccare un'icona nell'angolo superiore destro del riquadro.To switch between the thumbnails and the hierarchical view, click or tap an icon in the upper-right corner of the pane.

    Attivare o disattivare le visualizzazioni

  • Per trovare un controllo, digitare uno o più caratteri per evidenziare i nomi dei controlli che contengono il testo digitato.To find a control, type one or more characters to highlight the control names that contain the text that you typed.

    Se si fa clic o si tocca un risultato della ricerca, selezionare il controllo nell'app.If you click or tap a search result, you select that control in the app.

    Ricerca nella visualizzazione struttura ad albero

  • Per spostare una schermata verso l'alto o verso il basso, duplicarla, eliminarla o rinominarla, fare clic con il pulsante destro del mouse oppure fare clic o toccare i puntini di sospensione accanto ad esso e quindi fare clic o toccare l'opzione desiderata.To move a screen up or down, duplicate it, delete it, or rename it, right-click it (or click or tap the ellipsis next to it), and then click or tap the option that you want.

    Menu di scelta rapida della visualizzazione struttura ad albero

  • Per copiare e incollare un controllo, eliminarlo o rinominarlo, fare clic con il pulsante destro del mouse oppure fare clic o toccare i puntini di sospensione accanto ad esso e quindi fare clic o toccare l'opzione desiderata.To copy/paste a control, delete it, or rename it, right-click it (or click or tap the ellipsis next to it), and then click or tap the option that you want.