Besturingselement voor knop in Power Apps

Een besturingselement waarop de gebruiker kan klikken of tikken om interactie te hebben met de app.

Beschrijving

Configureer de eigenschap OnSelect van een besturingselement Button voor het uitvoeren van een of meer formules wanneer de gebruiker op het besturingselement klikt of tikt.

Sleuteleigenschappen

OnSelect: Acties die moeten worden uitgevoerd wanneer de gebruiker op een besturingselement tikt of klikt.

Tekst: de tekst die wordt weergegeven in een besturingselement of die de gebruiker in een besturingselement typt.

Aanvullende eigenschappen

Align: de locatie van tekst in verhouding tot het horizontale midden van het besturingselement.

AutoDisableOnSelect: Hiermee wordt het besturingselement automatisch uitgeschakeld terwijl het gedrag OnSelect van toepassing is.

BorderColor: de kleur van de rand van een besturingselement.

BorderStyle: hiermee wordt aangegeven of de rand van een besturingselement effen, onderbroken of gestippeld is, of dat er geen rand is.

BorderThickness: de dikte van de rand van een besturingselement.

Color: de kleur van de tekst in een besturingselement.

DisplayMode: bepaalt of invoer van de gebruiker is toegestaan (Edit), of gegevens alleen worden weergegeven (View) of het besturingselement wordt uitgeschakeld (Disabled).

DisabledBorderColor: de kleur van de rand van een besturingselement als de eigenschap DisplayMode van het besturingselement is ingesteld op Disabled.

DisabledColor: de kleur van tekst in een besturingselement als de eigenschap DisplayMode van het besturingselement is ingesteld op Disabled.

DisabledFill: de achtergrondkleur van een besturingselement als de eigenschap DisplayMode van het besturingselement is ingesteld op Disabled.

FocusedBorderColor: de kleur van de rand van een besturingselement wanneer de focus op het besturingselement ligt.

FocusedBorderThickness: de dikte van de rand van een besturingselement wanneer de focus op het besturingselement ligt.

Fill: de achtergrondkleur van een besturingselement.

Font: de naam van de lettertypefamilie waarin de tekst wordt weergegeven.

FontWeight: het gewicht van de tekst in een besturingselement: Bold, Semibold, Normal of Lighter.

Height: de afstand tussen de boven- en onderrand van een besturingselement.

HoverBorderColor: de kleur van de rand van een besturingselement wanneer de gebruiker de muisaanwijzer op dat besturingselement plaatst.

HoverColor: de kleur van de tekst in een besturingselement wanneer de gebruiker de muisaanwijzer op de tekst plaatst.

HoverFill: de achtergrondkleur van een besturingselement wanneer de gebruiker de muisaanwijzer op de achtergrond plaatst.

Italic: hiermee wordt aangegeven of de tekst in een besturingselement cursief is.

PaddingBottom: de afstand tussen de tekst in een besturingselement en de onderrand van het besturingselement.

PaddingLeft: de afstand tussen de tekst in een besturingselement en de linkerrand van het besturingselement.

PaddingRight: de afstand tussen de tekst in een besturingselement en de rechterrand van het besturingselement.

PaddingTop: de afstand tussen de tekst in een besturingselement en de bovenrand van het besturingselement.

Pressed: True zolang een besturingselement is ingedrukt; is anders false.

PressedBorderColor: de kleur van de rand van een besturingselement wanneer de gebruiker op dat besturingselement tikt of klikt.

PressedColor: de kleur van tekst in een besturingselement wanneer de gebruiker op dat besturingselement tikt of klikt.

PressedFill: de achtergrondkleur van een besturingselement wanneer de gebruiker op dat besturingselement tikt of klikt.

RadiusBottomLeft: de mate van afronding van de linkerbenedenhoek van een besturingselement.

RadiusBottomRight: de mate van afronding van de rechterbenedenhoek van een besturingselement.

RadiusTopLeft: de mate van afronding van de linkerbovenhoek van een besturingselement.

RadiusTopRight: de mate van afronding van de rechterbovenhoek van een besturingselement.

Size: de tekengrootte van de tekst die in een besturingselement wordt weergegeven.

Strikethrough: hiermee wordt aangegeven of een streep door de tekst van een besturingselement wordt weergegeven.

TabIndex: de navigatievolgorde op het toetsenbord ten opzichte van andere besturingselementen.

Tooltip: beschrijvende tekst die wordt weergegeven wanneer de gebruiker een besturingselement aanwijst.

Underline: hiermee wordt aangegeven of onder de tekst in een besturingselement een streep wordt weergegeven.

VerticalAlign: de locatie van de tekst in een besturingselement in verhouding tot het verticale midden van dat besturingselement.

Visible: hiermee wordt aangegeven of een besturingselement zichtbaar of verborgen is.

Width: de afstand tussen de linker- en rechterrand van een besturingselement.

X: de afstand tussen de linkerrand van een besturingselement en de linkerrand van de bovenliggende container (het scherm als er geen bovenliggende container is).

Y: de afstand tussen de bovenrand van een besturingselement en de bovenrand van de bovenliggende container (het scherm als er geen bovenliggende container is).

Navigate( Schermnaam, Schermovergangswaarde )

Voorbeelden

Een eenvoudige formule toevoegen aan een knop

  1. Voeg een besturingselement Text input toe en geef het element de naam Bron.

    Weet u niet hoe u een besturingselement kunt toevoegen, een naam kunt geven of kunt configureren?

  2. Voeg een besturingselement Button toe en stel de eigenschap Tekst van de knop in op 'Add' en de eigenschap OnSelect op deze formule:
    UpdateContext({Total:Total + Value(Source.Text)})

    Wilt u meer informatie over de functie UpdateContext of een andere functie?

  3. Voeg een besturingselement Label toe, stel de eigenschap Text hiervan in de formulebalk in op Value(Total) en druk op F5.

  4. Verwijder de standaardtekst uit Bron, typ een getal in en klik of tik op Add.

    Het besturingselement Label bevat het getal dat u hebt opgegeven.

  5. Verwijder het standaardnummer uit Bron, typ een nieuw getal in en klik of tik op Add.

    Het besturingselement Label bevat het totaal van de twee getallen die u hebt ingevoerd.

  6. (Optioneel) Herhaal de vorige stap een of meer keer.

  7. Als u wilt terugkeren naar de standaardwerkruimte, drukt u op Esc (of klikt of tikt u op het sluitpictogram in de rechterbovenhoek).

Een knop met meerdere formules configureren

Voeg een formule toe die het besturingselement Text input tussen vermeldingen wist.

  1. Stel de eigenschap HintText van Bron in op 'Een waarde invoeren'.

  2. Stel de eigenschap OnSelect van Add in op deze formule:

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

    Notitie

    Scheid meerdere formules met puntkomma's ';'.

  3. Stel de eigenschap Standaard van Bron in op ClearInput.

  4. Druk op F5 en test de app door verschillende cijfers tegelijkertijd toe te voegen.

Een andere knop toevoegen om het totaal opnieuw in te stellen

Voeg een tweede knop toe om het totaal tussen de berekeningen te wissen.

  1. Voeg nog een besturingselement Button toe, stel de eigenschap Tekst in op 'Wissen' en stel de bijbehorende eigenschap OnSelect in op deze formule:

    UpdateContext({Total:0})

  2. Druk op F5, voeg verschillende getallen tegelijkertijd toe en klik of tik op Wissen om het totaal opnieuw in te stellen.

De weergave van een knop wijzigen

De vorm van een knop wijzigen

Het besturingselement Button is in Power Apps standaard rechthoekig met afgeronde hoeken. U kunt eenvoudige wijzigingen aanbrengen aan de vorm van het besturingselement Button door de eigenschappen Height, Width en Radius in te stellen.

Notitie

Pictogrammen en vormen bieden een groot aantal verschillende ontwerpen en kunnen een aantal basisfuncties van het besturingselement Button uitvoeren. Pictogrammen en vormen hebben de eigenschap Tekst echter niet.

  1. Voeg het besturingselement Button toe en stel de eigenschappen Height en Width in op 300 om een grote vierkante knop te maken.

  2. Wijzig de eigenschappen RadiusTopLeft, RadiusTopRight, RadiusBottomLeft en RadiusBottomRight om de ronding van elke hoek aan te passen. Hier volgen enkele voorbeelden van verschillende vormen, die allemaal beginnen als een vierkante knop van 300 x 300:

De kleur van de knop wijzigen wanneer u de muisaanwijzer erop houdt

Standaard wordt de opvulkleur van het besturingselement Button met 20% gedimd wanneer u de muisaanwijzer erop houdt. U kunt dit gedrag aanpassen door de eigenschap HoverFill te wijzigen. Deze maakt gebruik van de functie ColorFade. Als u de formule voor de ColorFade instelt op een positief percentage, wordt de kleur lichter wanneer u de muisaanwijzer op de knop houdt. Een negatief percentage zorgt ervoor dat de kleur donkerder wordt.

  • Wijzig het percentage van ColorFade in de eigenschap HoverFill van een van de knoppen die u hebt gemaakt en bekijk wat het effect is.

U kunt ook de kleur van een besturingselement Button opgeven door de eigenschap HoverFill in te stellen in een formule met de functie ColorValue in plaats van de functie ColorFade, bijvoorbeeld ColorValue("Rood").

Notitie

De kleurwaarde moet een CSS-kleurdefinitie zijn. Dit kan een naam of hexadecimale waarde zijn.

  • Vervang de functie ColorFade door de functie ColorValue in een van de knoppen die u hebt gemaakt en bekijk wat het effect is.

Richtlijnen voor toegankelijkheid

Kleurcontrast

Ondersteuning voor schermlezer

  • Tekst moet aanwezig zijn.

Ondersteuning voor toetsenbord