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

Beschrijving

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

Belangrijkste eigenschappen

OnSelect: de manier waarop de app reageert wanneer de gebruiker op een besturingselement tikt of klikt.

Text: 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.

FocusedBorderThickness: de dikte van de rand van een besturingselement met toetsenbordfocus.

Color: de kleur van de tekst in een besturingselement.

DisplayMode: of invoer van de gebruiker is toegestaan (Bewerken), alleen gegevens worden weergegeven (Weergeven) of is uitgeschakeld (Uitgeschakeld).

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

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

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

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, 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: past de tabvolgorde van besturingselementen tijdens runtime aan wanneer hier een andere waarde dan nul is ingesteld.

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).

Verwante functies

Navigate( Schermnaam, Schermovergang )

Voorbeelden

Een eenvoudige formule toevoegen aan een knop

  1. Voeg een besturingselement Tekstinvoer toe en geef het de naam Bron.

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

  2. Voeg een besturingselement Knop toe en stel de eigenschap Text van de knop in op 'Toevoegen' en de eigenschap OnSelect op deze formule:
    UpdateContext({Totaal:Total + Value(Bron.Text)})

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

  3. Voeg een besturingselement Label toe, stel de eigenschap Text in op Totaal en druk vervolgens op F5.

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

    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 Toevoegen.

    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 Tekstinvoer tussen vermeldingen wist.

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

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

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

    Opmerking: Scheid meerdere formules met puntkomma's ';'.

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

  4. Druk op F5 en test de app vervolgens 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 Knop toe, stel de eigenschap Text in op 'Wissen' en stel de bijbehorende eigenschap OnSelect in op deze formule:

    UpdateContext({Total:0})

  2. Druk op F5, voeg verschillende nummers tegelijkertijd toe en klik of tik op Wissen om het totaal te wissen.

De weergave van een knop wijzigen

De vorm van een knop wijzigen

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

Opmerking: pictogrammen en vormen** bieden een groot aantal verschillende ontwerpen kunnen een aantal basisfuncties van het besturingselement Knop uitvoeren. **Pictogrammen en vormen hebben de eigenschap Text echter niet.

  1. Voeg het besturingselement Knop 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 Knop 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 donker 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 Knop opgeven door de eigenschap HoverFill in te stellen in een formule met de functie ColorValue in plaats van de functie ColorFade, bijvoorbeeld ColorValue("Red").

Opmerking: 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.