Sådan laver du tekst og knapper i Power Apps
guides

Sådan laver du tekst og knapper i Power Apps 

Skal du lave lækre power applikationer, som passer til virksomhedens visuelle identitet og som samtidig er brugervenlige, så kræver det visuel snilde. 

I denne guide kan du lære, hvordan du laver tekst og knapper i Power Apps. God fornøjelse!

4. november 2019

Om forfatteren

Julie har arbejdet med markedsføring af vores konsulentydelser i mere end 6 år. Hun har et stort kendskab til vores projekter, services og ydelser.

Julie - Digital Marketing Manager

Tilmeld nyhedsbrev

Følg med i vores nyheder, events og webinarer.

Tilpas farver og tekst

Knapperne i Power Apps skal ofte have forskellige funktioner og udseende. Dette ser vi på i denne guide, hvor form, farver og tekst er i fokus.

Når du indsætter en knap I Power Apps, får du som udgangspunkt en knap, som følger et blåt tema.

Blå knap i Power Apps.

Du kan imidlertid have brug for at tilpasse knappen til dit eget eller din virksomheds farvetema. Lad os derfor se på de elementer, som en knap består af.

Du kan tilpasse knappen i forhold til fill boarder og boarder color.

Indstillinger for Fill, BorderColor og Color (of text) finder du under ´Properties´sektionen, som vises, når du klikker på en knap.

Du kan ændre fill, boardercolor osv. under properties sektion.

Hvis du blot har en enkelt knap, som skal følge dit angivne tema, så kan du med fordel bruge ’Properties’ sektionen. Har du derimod flere knapper og brug for flere tilpasninger, så er det en god ide at lære at bruge the Formula bar i PowerApps.

Når du vælger et kontrolfelt, vil du se, at the property og the formula har nogle værdier.
I dette tilfælde en text property og en formula til at vise knappen.

Text property og formula kan også have nogle værdier på knapperne.

Så for at ændre knappens tekst, skal du blot indtaste din værdi, dvs. din ønskede tekst, i mellem de to anførelses-tegn ““.

Man skal indsætte anførselstegn.

Hvis vi klikker på den dropdown, der fremgår i property-boksen, får vi nu flere properties at vælge imellem.

 Hvis vi klikker på den dropdown, der fremgår i property-boksen, får vi nu flere properties at vælge imellem.

I dette tilfælde bruger vi standardfarver, som vises i formula baren, når du begynder at taste farvens navn. På den måde kan du således hurtigt fremsøge og klikke på den farve du ønsker.

Du kan begynde at skrive i tekstfeltet, og så kommer farven frem.

Har du brug for specifikke virksomhedsfarver, kan du også anvende RGBA koder, som vist her:

Du kan også bruge RGBA koder til at vælge farverne.

Du kan altså helt selv bestemme, hvordan dine knapper skal se ud i PowerApps.

Genbrug properties for knapper i Power Apps

Nu ser vi nærmere på, hvordan man kan genbruge disse properties (tekst og farve) på andre knapper.

Vi har lavet en knap ved navn ”ButtonOrange” (meget kreativt) og herefter tilføjet to yderligere knapper, ’Help’ og ’Cancel’:

Her er nogle eksempler på nogle knapper.

Nu kan vi ændre properties for de to blå knapper ved at bruge ’properties’ sektionen, som ses ved at klippe på knappen. (Se første guide)

Men i stedet vil vi genbruge de anvendte properties for ’ButtonOrange’ knappen, så vi ikke behøver at bøvle med at finde farvekoder mv.

Vi klikker nu på ’Help’ knappen og vælger ’Fill’ properties, som har følgende default indstillinger:

Du kan også bruge RGBA koder til at vælge farverne.

Og i stedet for at ændre til orange, genbruger jeg properties for ”ButtonOrange” ved at indtaste navnet på knappen, og vælge den i den viste dropdown:

Man kan genbruge indstillingerne fra tidligere knapper på hhv. den organgeknap.

Herefter angiver vi hvilke properties fra ”ButtonOrange”, som vi ønsker at anvende. Det gøres ved at indtaste knappens navn, efterfulgt af punktum og angivelse af hvilke properties, der ønskes genbrugt, f.eks. ’Fill’:

Det gøres ved at indtaste knappens navn, efterfulgt af punktum og angivelse af hvilke properties, der ønskes genbrugt, f.eks. ’Fill’:

 

Og nu har vi samme ’fill’ farve som ’ButtonOrange’. På samme måde kan vi genbruge ’BorderColor’ og ’Color’ properties.

På samme måde kan man gøre det samme med de andre knapper.

Og ved at genbruge properties på alle tre knapper, får vi et helt ensartet look:

Et billede af tre orange ensfarvede knapper.

Hvis vi ønsker en ny ‘fill’ farve, behøver vi blot at ændre ’fill’ property for ’ButtonOrange’, hvormed de to andre knappers ’fill’ farve også ændres.

Man kan også få forskellige knapper/eller farver.

Du kan genbruge properties på en hver kontrol. Her ses eksempelvis ‘ButtonOrange’ properties anvendt på et ikon:

Eksempler på hvordan man bruger ikoner.

Tilpas formen på knapper i Power Apps

Ovenover endte vi med 3 ens knapper ved at genbruge properties for den første knap.

Her er de tre forskellige knapper.

Men hvad så hvis vi ønsker en anden form , som f.eks.:

Her er der forskel på knapperne.

Som det ses, er der mange muligheder.

Lad os først se på formen på de to første knapper, som opnås ved at tilpasse ”BorderRadius” i ’Properties’ sektionen

Ved boarder radius kan du vælge formen på dine knapper.

Lad os først se på formen på de to første knapper, som opnås ved at tilpasse ”BorderRadius” i ’Properties’ sektionen.

Med denne funktion ændrer du således alle 4 hjørner af knappen.

Hvis du ønsker formen på den tredje knap, vælges der ’Multiple’ i Border radius, hvormed hjørnerne kan få forskellige properties:

Hvis du ønsker formen på den tredje knap, vælges der ’Multiple’ i Border radius, hvormed hjørnerne kan få forskellige properties.

  • RadiusTopLeft
  • RadiusTopRight
  • RadiusBottomLeft
  • RadiusBottomRight

Vi skal således tilpasse properties for knappens fire hjørner for at opnå formen som på den tredje knap:

Man kan også tilpasse alle 4 knapper på samme tid.

Er du interesseret i at lære mere om, hvordan man bygger apps, så kan du se nærmere på et Microsoft Power Apps kursus.