Del via


Organisere kontroller i tilgjengelige lerretsapper

Kontroller i en app bør organiseres for å hjelpe skjermleserbrukere med å navigere sekvensielt. En logisk rekkefølge reduserer også forvirring for tastaturbrukere og hjelper dem med å bli mer produktive.

Meningsfylt skjermnavn

Når en skjerm er lastet inn, vil skjermlesere lese opp navnet. Velg et beskrivende navn for å orientere brukere.

Du kan endre skjermnavnet i kontrolltreet eller egenskapspanelet i Power Apps Studio. Velg skjermen, og velg deretter Velg penn-ikonet for å redigere navnet. for å gi skjermen nytt navn.

Skjermnavn kan endres fra kontrolltreet eller egenskapspanelet, som uthevet på bildet.

Det første elementet på en skjerm er navnet. Det er visuelt skjult og tilgjengelig bare for skjermleserbrukere.

Når en ny skjerm lastes inn, fokuserer Power Apps på skjermnavnet. Hvis du bruker SetFocus umiddelbart når skjermen lastes inn, leses ikke skjermnavnet. Vurder å opprette en synlig tittel og gjøre den til et dynamisk område for å kunngjøre endringen i kontekst.

Logisk kontrollrekkefølge

Skjermleserbrukere kan navigere sekvensielt i innhold. Rekkefølgen bestemmes av posisjonen til kontrollene, som starter fra topp til bunn, og deretter venstre mot høyre. Størrelsen på kontrollen spiller ingen rolle, bare X og Y-egenskapene er viktige.

I dette eksemplet vises A først i rekkefølgen, siden det er nærmest toppen. B og C har samme loddrette posisjon, men siden B er nærmere venstre, og vises den før C. D vises sist siden det er lengst fra toppen.

Hvordan posisjonering påvirker rekkefølgen til fire kontroller.

Obs!

  • Når du redigerer en app i forhåndsvisningsmodus, oppdateres ikke kontrollrekkefølgen av ytelsesårsaker. Rekkefølgen vil være riktig når appen publiseres og kjøres.
  • Kontrollrekkefølgen er ikke den samme som den som vises i trevisningen for kontroller i Power Apps Studio. Trevisningen sorterer kontroller i henhold til når de ble lagt til i appen. Den påvirker ikke rekkefølgen på kontrollene når appen kjøres.
  • Når X- eller Y-verdien for en kontroll settes til et uttrykk, blir ikke kontrollrekkefølgen oppdatert når resultatet av uttrykket endres. Rekkefølgen beregnes og rettes når appen lagres, og utgangstilstanden til appen brukes til å evaluere uttrykk.
    • Hvis du endrer plasseringen fordi andre kontroller skjules eller vises, kan du bruke beholdere med automatisk oppsett til å administrere X og Y for deg.
    • Du kan også plassere alle kontroller på en logisk måte uavhengig av uttrykksverdier. Hvis kontroll A for eksempel alltid skal være under kontroll B og B av og til skjules, angir du at Y for A skal være If(B.Visible, B.Y + B.Height, B.Y + 1). Tilføyingen av 1 sikrer at A alltid er under B, selv om B er skjult.

Grupperte kontroller

Standardrekkefølgen passer for isolert innhold, men ikke for gruppert innhold. Vurder to fliser side ved side, tegnet med Rektangel-kontroller. Hver flis har en overskrift. Nedenfor overskriften er to knapper stablet loddrett: A og B for den første flisen og C og D for den andre.

Eksempel på feil praksis: kontroller organisert i en flat struktur.

Standardrekkefølgen er fra topp til bunn, deretter venstre mot høyre. Rekkefølgen på kontrollene er derfor følgende:

  1. Venstre rektangel
  2. Høyre rektangel
  3. Venstre overskrift
  4. Høyre overskrift
  5. A
  6. C
  7. B
  8. D

Denne strukturen formidler ikke til at A og B er sammen, og på samme måte er C og D sammen.

Bruk beholdere til å gruppere relatert innhold. Alle kontroller i en beholder vises samlet i rekkefølge. I en beholder blir kontroller ordnet med samme regel: fra topp til bunn, og deretter fra venstre mot høyre.

Ved å erstatte rektanglene i forrige eksempel med beholdere er kontrollrekkefølgen nå logisk for skjermleserbrukere:

  1. Venstre beholder
  2. Venstre overskrift
  3. A
  4. B
  5. Høyre beholder
  6. Høyre overskrift
  7. C
  8. D

Eksempel på anbefalt praksis: kontroller organisert i en hierarkisk struktur ved hjelp av beholdere.

Alle kontroller i et skjemakort og galleri grupperes automatisk, så du trenger ikke bruke en beholder. Hvis det finnes undergrupper, bør du imidlertid fremdeles bruke beholdere for dem.

I dette eksemplet har en galleri-rad et miniatyrbilde og to tekstdeler til venstre. Til høyre er det to knapper. Visuelt og logisk bør de to settene med kontroller grupperes. Dette sikrer at skjermleserbrukere ser den venstre gruppen først før høyre.

Eksempel på anbefalt fremgangsmåte: Relaterte kontroller i et galleri er gruppert i beholdere.

Navigasjonsrekkefølge for logisk tastatur

TabIndex angir hvordan kontroller kan nås av tastaturbrukere. TabIndex må være 0 eller -1. Med en logisk kontrollrekkefølge som beskrevet ovenfor, er det liten grunn til å ha TabIndex større enn 0.

Tastaturnavigasjonsrekkefølge skal følge visuell flyt av kontroller. Hvis navigasjonsrekkefølgen er uventet, bør du først kontrollere om appstrukturen er logisk.

Obs!

Tastaturnavigasjonsrekkefølgen er ikke det samme som kontrollrekkefølgen. TabIndex påvirker bare navigasjonen av tabulatortasten. Den endrer ikke hvordan skjermleserbrukere navigerer i en app lineært. Enkelte skjermleserbrukere ikke bruker ikke tastaturer en gang.

Unngå egendefinerte tabulatorindekser

Egendefinerte tabulatorindekser er de som er større enn null. De er nesten alltid et tegn på dårlig design. Det finnes bedre alternativer, for eksempel oppretting av riktig appstruktur eller bruk av SetFocus til å endre fokus.

Unngå å bruke egendefinerte tabulatorindekser på grunn av følgende årsaker.

Tilgjengelighet

Det er et stort tilgjengelighetsproblem å ha egendefinerte tabulatorindekser. Skjermleserbrukere navigerer i en app med den logiske strukturen. Egendefinerte tabulatorindekser ignorerer denne strukturen. I og med at skjerleserbrukere også kan navigere ved hjelp av tabulator-tasten, blir de forvekslet når de får en annen rekkefølge enn andre navigasjonsmetoder.

Brukervennlighet

Brukere kan bli forvekslet når noen elementer ser ut til å være hoppet over. De kan desorienteres når fokus flyttes i en uforutsigbar rekkefølge. Dette er enda mer problematisk for brukere med kognitive funksjonshemninger.

Vedlikehold

Apputviklere må oppdatere TabIndex for flere kontroller manuelt når en ny settes inn. Det er enkelt å gå glipp av en oppdatering eller få ordren rekkefølge.

Ytelse

For å støtte egendefinerte tabulatorindekser må Power Apps-systemet undersøke alle kontrollene på siden og beregne riktig rekkefølge. Denne beregningen er en intensiv prosess. Beholder-kontroller som Galleri har kompliserte regler for hvordan TabIndex fungerer for underordnede kontroller. Systemet tilordner apputvikleres ønskede TabIndex til en annen verdi for å overholde disse reglene. Dette er årsaken til at selv om TabIndex er satt til null for alle kontroller, vil den faktiske HTML tabindex være et positivt tall.

Integrasjon med andre komponenter

Egendefinerte tabulatorindekser fungerer bare med innebygde kontroller. Kontroller som ikke er integrert i Power Apps-tabulatorindekssystem, får en uventet navigasjonsrekkefølge. Dette kan være et problem for kodekomponenter. Utviklere av disse komponentene må holde oversikt over interaktive elementer og angi tabulatorindeks for dem. De kan bruke tredjepartsbiblioteker, noe som kanskje ikke gir en måte å tilpasse tabulatorindekser på. Når alle tabulatorindekser er 0 eller -1, er det derimot ikke nødvendig å involvere Power Apps-tabulatorindekssystem. Alle tredjepartskomponenter som er innebygd i appen, får automatisk riktig tabulatorsekvens.

I den andre retningen fungerer ikke egendefinerte tabulatorindekser når lerretsapper er innebygd på en annen webside. For eksempel på egendefinerte sider. Power Apps kan ikke styre elementene utenfor lerretsappen, så den totale tabulatornavigasjonsrekkefølgen blir ulogisk.

Forenklet tabulatorindeks (forhåndsversjon)

For å sikre at tabulatorindekser er enten 0 eller -1 aktiverer du appfunksjonen Forenklet tabulatorindeks fra Innstillinger > Kmmende funksjoner.

Aktivere Forenklet tabulatorindeks-appfunksjonen.

Viktig

  • Dette er en forhåndsversjonsfunksjon.
  • Forhåndsfunksjonene er ikke ment for produksjonsbruk og kan ha begrenset funksjonalitet. Disse funksjonene er tilgjengelige før en offisielle utgivelsen, slik at kunder kan få tidlig tilgang og gi tilbakemeldinger.

Når denne funksjonen er aktivert, behandles alle TabIndex-verdier som er større enn null, som null. Dette deaktiverer også Power Apps-tabulatorindekssystemet, slik at det kan integreres bedre med andre komponenter, som beskrevet ovenfor.

Løsning for egendefinert tabulatorsekvens

For sjeldne scenarier der tastaturnavigasjonsrekkefølgen skal være forskjellig fra visuell rekkefølge, kan du plassere beholder-kontrollene nøye for å få samme effekt.

I eksemplet nedenfor er knappen A over knappen B. Den naturlige tabulatornavigasjonsrekkefølgen er A og deretter B.

To knapper med samme TabIndex, stablet loddrett.

Hvis du vil reversere tabulatornavigasjonsrekkefølgen, plasserer du B i en beholder-kontroll. Angi Y-verdien for beholderen til over A. Appstrukturen har nå beholderen (og B) før A. Derfor er tabulatornavigasjonsrekkefølgen B, og deretter A.

B legges i en beholder som vises før A.

Med denne teknikken kan skjermleserbrukere også støte på B før A når de navigerer uten Tab-tasten.

Neste trinn

Tilgjengelige farger i Power Apps

Se også