App design retningslinjer

Moderne kontrolelementer

Moderne kontrolelementer i lærredsapps repræsenterer en betydelig forbedring i udviklingen og designet af brugergrænseflader inden for Microsoft-økosystemet. Disse kontrolelementer er baseret på Microsofts Fluent Design System og er udviklet til at levere en hurtig, ydelsesbaseret og tilgængelig brugeroplevelse, samtidig med at de sikrer problemfri integration med tema-funktioner. Introduktionen af disse kontrolelementer, herunder fanelister, fremskridtslinjer, oplysningsknapper, drejeknapper og meget mere, understreger et strategiske skift til at skabe mere intuitive, responsive og visuelt tiltalende programmer. Ved hjælp af disse moderne kontrolelementer kan udviklere nemt implementere avancerede elementer på brugergrænsefladen, der både er æstetisk tiltalende og funktionelt rige, hvilket øger den overordnede brugerengagement og tilfredshed.

Det indbyggede design af disse kontrolelementer, med temaer i tankerne, giver mulighed for et ensartet udseende på tværs af programmer og reducerer betydeligt den indsats, der kræves i forbindelse med tilpasning og branding af apps. Muligheden for automatisk at opdatere stilarter for alle kontrolelementer baseret på det indstillede tema forenkler designprocessen og sikrer, at programmer forbliver visuelt kohærente hele vejen igennem. Dette stemmer perfekt overens med behovene hos moderne virksomheder, der søger at opretholde brandkonsistens, mens de tilbyder digitale oplevelser af høj kvalitet. De moderne kontrolelementer fremhæver også tilgængelighed og ydeevne og sikrer, at programmer kan bruges af en lang række målgrupper, herunder personer med handicap, i overensstemmelse med principper for inkluderende design. De moderne kontrolelementer i lærred apps er som sådan ikke kun et sæt brugergrænsefladekomponenter, men et transformativt værktøjssæt, der giver udviklere mulighed for at udvikle mere effektive, vedligeholdelige, tilgængelige og sammenhængende programmer, der opfylder behovene i både virksomheder og brugere, under udvikling.

Vigtige oplysninger

Mens en delmængde af de moderne kontrolelementer i lærred apps er blevet gjort almindeligt tilgængeligt (GA), forbliver det bredere sæt af funktioner i forhåndsvisning. Du opfordres til at undersøge og give feedback om disse forhåndsvisningskontrolelementer. Det er dog vigtigt at huske på, at deres funktioner og funktionaliteter kan blive forfinet baseret på feedback og test, før de når generel tilgængelighed.

Formulardesign og -retningslinjer

Organisere din formular

• Opdel formularen i logiske sektioner, og grupper relaterede felter sammen.
• Sigter mod at holde formularen på en enkelt skærm. Hvis den er lang, kan du overveje at opdele den i flere skærmbilleder, trin eller faner.
• Brug et tydeligt og enkelt sprog til feltetiketter, og undgå ukendte udtryk eller fagsprog.
• Implementer valideringsregler for at sikre, at dataene er nøjagtige. I forbindelse med obligatoriske felter skal du tydeligt angive, at de er obligatoriske. Valider e-mail-adresser, telefonnumre og andre formater efter behov.

Genbrugsformularer

• Brug en enkelt formular til at oprette nye poster, redigere eksisterende poster og få vist poster kun i visningstilstand.
• Hvis den samme formular genbruges, reduceres tid til udvikling og vedligeholdelse, samtidig med at ensartetheden sikres.

Formulartilstande

Angiv formulartilstanden dynamisk på baggrund af brugerhandlinger. Eksempel:

• Når du opretter en ny post, skal du sæt formularen i "Ny" tilstand.
• Når du redigerer en eksisterende post, skal du sæt formularen i "Rediger" tilstand.
• Når du viser en post, skal du sæt formularen i "Vis" tilstand.

Kontrolplacering

• Placer forskellige kontrolelementer (f.eks. galleri, visningsformular og redigeringsformular) på separate skærmbilleder, så de kan skelnes.
• Kombiner disse kontrolelementer med formler for at oprette den sammenhængende brugeroplevelse.

Objektbeholdere

Efterhånden som lærredsappen bliver større og større for at imødekomme flere forretningsscenarier, stiger antallet af kontrolelementer fortsat, og det er nødvendigt at organisere kontrolelementerne på baggrund af den funktion, de udfører. En nem måde at gøre det på er at markere kontrolelementerne sammen og gruppere dem i en gruppe. Det anbefales dog ikke altid at gruppere kontrolelementer. Lærredsappen Container-kontrolelementet kan indeholde et sæt kontrolelementer og har sine egne egenskaber.

Objektbeholdere fungerer som tomme mellemrum, hvor du kan indsætte og organisere kontrolelementer i forhold til beholderens øverste venstre hjørne. Du har fleksibilitet til at indlejre objektbeholdere, så der kan oprettes mere komplekse layout.

Objektbeholdere er faktiske kontrolelementer med deres egne egenskaber som Width og BorderColor. Objektbeholdere påvirker applayout og hjælper brugere af skærmlæsere med at forstår strukturen i appen.

Du kan tilføje kontrolelementer i en gruppe, men du må kun tilføje logisk relaterede kontrolelementer i en objektbeholder.

Elementerne organiseres i Power Apps ved hjælp af, og brugerne kan anvende delte egenskaber på flere elementer. Hvis der foretages individuelle egenskabsændringer i en gruppe, kan det dog nødvendiggøre manuelle justeringer. Grupper har ikke en status i den logiske struktur i en app af tilgængelighedshensyn, da skærmlæsere ikke kan genkende dem. Derudover gør den manglende mulighed for at indlejre grupper det udfordrende at oprette mere indviklede layout.

Design og retningslinjer for galleri

Undgå at ændre gallerielementer fra indeni

Undgå at ændre Items-egenskaben for et galleri i hændelser med underordnede kontrolelementer som OnChange eller OnSelect. Dette kan medføre en uventet funktionsmåde, især hvis bestemte kontrolelementer bruges til at aktivere hændelser, når deres værdier ændres.

Vær opmærksom på kontrolelementer, der udløses af OnChange

Vær opmærksom, når du bruger kontrolelementer som kombinationsfelt, datovælger, Skyder eller Skift i gallerier. Disse kontrolelementer kan udløse OnChange-hændelsen uventet, hvilket kan medføre potentielle problemer, f.eks. uendelig løkke.

Påvirkning af ydeevne ved programrettelser

Vær opmærksom på ydeevnepåvirkningen, når du retter eller opdaterer elementer i et galleri, især når du behandler et stort antal elementer. Opdatering kan tage tid, og galleriet kan genindlæse alle elementer, hvilket påvirker ydeevnen.

Håndter uendelige løkker med forsigtighed**

Hvis ændring af galleridata udløser hændelser, der fører til uendelig løkke, bør du overveje at bruge moderne kontrolelementer eller kontrolelementer, der ikke udløser OnChange, når deres data ændres, for at bryde løkken.

Undgå indlejrede gallerier

Indlejrede gallerier kan medføre ydeevneproblemer og en kompleks databinding.

Når det er muligt, skal du undgå at indlejre gallerier. Du kan i stedet prøve at designe datastrukturen og bruge funktioner på en optimeret måde.

Brug gallerier med fleksibel højde

Gallerier med fast højde kan resultere i begrænset synlighed af indhold, især når man arbejder med dynamiske data.

Brug fleksible højdegallerier ved at angive Height egenskaben til Parent.Height eller en dynamisk værdi på baggrund af dataene. Derved sikres, at galleriet justerer højden, så det tager højde for forskellige mængder data.

Optimere indlæsning af data

Når du optimerer indlæsning af data i Power Apps, kan det være en god ide kun at hente og få vist de nødvendige kolonner i et galleri i stedet for at skulle hente hele datasæt.

Her er et eksempel på, hvordan du kan opnå dette: Hvis du antager, at du har en samling EmployeeData med flere kolonner, og du kun vil have vist kolonnerne "Navn" og "Afdeling" i et galleri.

// Collection named ProductSales with sample sales data

ClearCollect(ProductSales, 
    Table(
        { ProductName: "Phone", UnitPrice: 499.99, QuantitySold: 100 },
        { ProductName: "Laptop", UnitPrice: 999.99, QuantitySold: 50 },
        { ProductName: "Tablet", UnitPrice: 299.99, QuantitySold: 75 }
    )
)

// Bind the gallery to display only the "ProductName" and "QuantitySold" columns

Gallery1.Items = ShowColumns(ProductSales, ProductName, QuantitySold)

Få flere oplysninger om bedste praksis i Gallery.

Opbygning af komponenter, der kan genbruges

Hvornår skal der oprettes brugerdefinerede kodekomponenter ved hjælp af Power Apps Component Framework (PCF)

Power Platform gør det muligt at oprette komponenter, der kan genbruges, via Power Apps Component Framework (PCF). Du kan få flere oplysninger her.

Her er nogle scenarier, hvor du måske overvejer at oprette PCF-komponenter i Power Apps:

Komplekse elementer på brugergrænsefladen

Når du har brug for at oprette komplekse elementer eller kontrolelementer på brugergrænsefladen, der ikke er let tilgængelige i Power Apps-standardkontrolelementerne.

Brugerdefinerede kontrolelementer til specifikke krav

Når din app har specifikke krav, der ikke opfyldes af standardkontrolelementer, og du har brug for at oprette brugerdefinerede kontrolelementer, der er skræddersyet til dine behov.

Ensartet brugeroplevelse på tværs af apps

Når du vil bevare en ensartet brugeroplevelse på tværs af flere Power Apps eller miljøer ved at indkapsle specifikke funktioner i en PCF-komponent.

Genbrugelighed på tværs af apps

Når du forventer, at der er behov for at genbruge et bestemt funktions- eller brugergrænsefladeelement i flere apps, giver oprettelse af en PCF-komponent dig mulighed for at bygge én gang og genbruge.

Implementering af avanceret logik

Når du har brug for at implementere avanceret forretningslogik eller beregninger, der er ud over kapaciteterne af standardformler eller funktioner i Power Apps.

Forbedret brugeroplevelse

Når du forsøger at forbedre den overordnede brugeroplevelse ved at oprette visuelt tillokkende og interaktive komponenter, der ikke kan nås med standardkontrolelementerne.

Næste trin

Retningslinjer for responsivt design