Controllo pulsante in Power Apps

Controllo che l'utente può fare clic o toccare per interagire con l'app.

Description

Configurare la proprietà OnSelect di un controllo Button per eseguire una o più formule quando l'utente fa clic o tocca il controllo.

Proprietà chiave

OnSelect : azioni da eseguire quando l'utente tocca o fa clic su un controllo.

Testo : testo visualizzato in un controllo o digitato dall'utente in un controllo .

Proprietà aggiuntive

Allinea : posizione del testo rispetto al centro orizzontale del relativo controllo.

AutoDisableOnSelect : disabilita automaticamente il controllo durante l'esecuzione del comportamento OnSelect .

BorderColor : colore del bordo di un controllo.

BorderStyle : indica se il bordo di un controllo è Solido, Tratteggiato, Tratteggiato o Nessuno.

BorderThickness : spessore del bordo di un controllo.

Color : colore del testo in un controllo .

ContentLanguage : lingua del contenuto del controllo, se diversa dal contenitore del controllo.

DisplayMode : indica se il controllo consente l'input dell'utente (Modifica), visualizza solo i dati (visualizzazione) o è disabilitato (Disabilitato).

DisabledBorderColor : colore del bordo di un controllo se la proprietà DisplayMode del controllo è impostata su Disabled.

DisabledColor : colore del testo in un controllo se la relativa proprietà DisplayMode è impostata su Disabled.

DisabledFill : colore di sfondo di un controllo se la relativa proprietà DisplayMode è impostata su Disabled.

FocusedBorderColor : colore del bordo di un controllo quando il controllo è attivo.

FocusedBorderThickness : spessore del bordo di un controllo quando il controllo è attivo.

Riempimento : colore di sfondo di un controllo.

Font : nome della famiglia di tipi di carattere in cui viene visualizzato il testo.

FontWeight : spessore del testo in un controllo: Grassetto, Semibold, Normale o Più chiaro.

Altezza : distanza tra i bordi superiore e inferiore di un controllo.

HoverBorderColor : colore del bordo di un controllo quando l'utente mantiene il puntatore del mouse su tale controllo.

HoverColor : colore del testo in un controllo quando l'utente mantiene il puntatore del mouse su di esso.

HoverFill : colore di sfondo di un controllo quando l'utente mantiene il puntatore del mouse su di esso.

Corsivo : indica se il testo in un controllo è in corsivo.

PaddingBottom : distanza tra il testo in un controllo e il bordo inferiore di tale controllo.

PaddingLeft : distanza tra il testo in un controllo e il bordo sinistro di tale controllo.

PaddingRight : distanza tra il testo in un controllo e il bordo destro di tale controllo.

PaddingTop : distanza tra il testo in un controllo e il bordo superiore di tale controllo.

Premuto : true mentre viene premuto un controllo, false in caso contrario.

PressedBorderColor : colore del bordo di un controllo quando l'utente tocca o fa clic su tale controllo.

PressedColor : colore del testo in un controllo quando l'utente tocca o fa clic su tale controllo.

PressedFill : colore di sfondo di un controllo quando l'utente tocca o fa clic su tale controllo.

RadiusBottomLeft : grado in cui viene arrotondato l'angolo inferiore sinistro di un controllo.

RadiusBottomRight : grado in cui viene arrotondato l'angolo inferiore destro di un controllo.

RadiusTopLeft : grado in cui viene arrotondato l'angolo superiore sinistro di un controllo.

RadiusTopRight : grado in cui viene arrotondato l'angolo superiore destro di un controllo.

Dimensioni : dimensioni del carattere del testo visualizzato in un controllo.

Barrato : indica se una riga viene visualizzata attraverso il testo visualizzato in un controllo .

TabIndex : ordine di spostamento tramite tastiera in relazione ad altri controlli.

Descrizione comando : testo esplicativo visualizzato quando l'utente passa il mouse su un controllo.

Sottolineatura : indica se una riga viene visualizzata sotto il testo visualizzato in un controllo .

VerticalAlign : posizione del testo in un controllo rispetto al centro verticale di tale controllo.

Visibile : indica se viene visualizzato o nascosto un controllo.

Width : distanza tra i bordi sinistro e destro di un controllo.

X: distanza tra il bordo sinistro di un controllo e il bordo sinistro del contenitore padre o della schermata se non c'è un contenitore padre.

Y: distanza tra il bordo superiore di un controllo e il bordo superiore del contenitore padre o della schermata se non c'è un contenitore padre.

Funzioni correlate

Navigate( ScreenName, ScreenTransitionValue )

Esempi

Aggiungere una formula di base a un pulsante

1. Aggiungi un controllo Text input e denominarlo Source.

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

2. Aggiungere un controllo Button , impostarne la proprietà Text su "Add" e impostarne la proprietà OnSelect su questa formula:
   UpdateContext({Total:Total + Value(Source.Text)})

   Per altre informazioni sulla funzione UpdateContext o su altre funzioni,

3. Aggiungere un controllo Label , impostarne la proprietà Text nella barra della formula su Value(Total) e quindi premere F5.

4. Deselezionare il testo predefinito da Origine, digitare un numero in esso e quindi toccare o fare clic su Aggiungi.

   Il controllo Etichetta mostra il numero digitato.

5. Deselezionare il numero da Origine, digitare un altro numero in esso e quindi fare clic o toccare Aggiungi.

   Il controllo Etichetta mostra la somma dei due numeri digitati.

6. (facoltativo) Ripetere uno o più volte il passaggio precedente.

7. Per tornare all'area di lavoro predefinita, premere ESC oppure toccare o fare clic sull'icona di chiusura nell'angolo superiore destro.

Configurare un pulsante con più formule

Aggiungere una formula che cancella il controllo Input di testo tra le voci.

1. Impostare la proprietà HintText di Source su "Enter a number".

2. Impostare la proprietà OnSelect di Add a questa formula:

   UpdateContext({Total:Total + Value(Source.Text)});
   UpdateContext({ClearInput: ""})

   Annotazioni

   Separare più formule con un punto e virgola ";".

3. Impostare la proprietà Default di Source su ClearInput.

4. Premere F5 e quindi testare l'app aggiungendo più numeri.

Aggiungere un altro pulsante per reimpostare il totale

Aggiungere un secondo pulsante per cancellare il totale tra i calcoli.

1. Aggiungere un altro controllo Button , impostarne la proprietà Text su "Clear" e impostarne la proprietà OnSelect su questa formula:

   UpdateContext({Total:0})

2. Premere F5, aggiungere più numeri insieme e quindi fare clic o toccare Cancella per reimpostare il totale.

Modificare l'aspetto di un pulsante

Modificare la forma di un pulsante

Per impostazione predefinita, Power Apps crea un controllo Pulsante rettangolare con angoli arrotondati. È possibile apportare modifiche di base alla forma di un controllo Button impostando le relative proprietà Height, Width e Radius .

Annotazioni

Icone e forme offrono un'ampia gamma di progettazioni e possono eseguire alcune delle stesse funzioni di base eseguite dai controlli Button . Tuttavia, icone e forme non dispongono di una proprietà Text .

1. Aggiungere un controllo Button e impostarne le proprietà Height e Width su 300 per creare un pulsante quadrato grande.

2. Modificare le proprietà RadiusTopLeft, RadiusTopRight, RadiusBottomLeft e RadiusBottomRight per regolare la quantità di curvatura in ogni angolo. Ecco alcuni esempi di forme diverse, ognuna a partire da un pulsante quadrato 300 x 300:

   • Impostare tutti e quattro i valori Radius su 150 per creare un cerchio.
   • Impostare i valori per RadiusTopLeft e RadiusBottomRight su 300 per creare un pulsante a forma di foglia.
   • Impostare i valori per RadiusTopLeft e RadiusTopRight su 300 e i valori per RadiusBottomLeft e RadiusBottomRight su 100 per creare un pulsante a forma di tabulazione.

Modificare il colore di un pulsante quando si passa il puntatore del mouse su di esso

Per impostazione predefinita, il colore di riempimento di un controllo Pulsante sminuerà di 20% quando si passa il puntatore del mouse su di esso. È possibile modificare questo comportamento modificando la proprietà HoverFill , che usa la funzione ColorFade . Se si imposta la formula ColorFade su una percentuale positiva, il colore diventa più chiaro quando si passa il puntatore del mouse sul pulsante, mentre una percentuale negativa rende il colore più scuro.

• Modificare la percentuale ColorFade nella proprietà HoverFill di uno dei pulsanti creati e osservare gli effetti.

È anche possibile specificare il colore di un controllo Button impostando la relativa proprietà HoverFill su una formula che contiene la funzione ColorValue anziché la funzione ColorFade , come in ColorValue("Red").

Annotazioni

Il valore del colore può essere qualsiasi definizione di colore CSS, ovvero un nome o un valore esadecimale.

• Sostituire la funzione ColorFade con una funzione ColorValue in uno dei pulsanti creati e osservare gli effetti.

Linee guida sull'accessibilità

Contrasto dei colori

• Si applicano i requisiti di contrasto dei colori standard.

Utilità per la lettura dello schermo

• Il testo deve essere presente.

Supporto della tastiera

• TabIndex deve essere zero o maggiore in modo che gli utenti della tastiera possano spostarsi.
• Gli indicatori di messa a fuoco devono essere chiaramente visibili. Usare FocusedBorderColor e FocusedBorderThickness per ottenere questo risultato.