Del via


Bruke moderne tema

Brukere av modelldrevne apper med opplevelsen med det moderne, oppdaterte utseendet for modelldrevne apper gir oppdatert utseende tilpasset Microsoft Fluent 2-designsystemet. Siden dette moderne, oppdaterte utseendet leveres med et nytt temasystem, overholdes ikke klassisk tema, men opprettere kan endre fargene som brukes av apphodet for brukere som har aktivert det moderne, oppdaterte utseendet. I denne artikkelen lærer du om stiloverstyringene som er tilgjengelige for det moderne utseende, og hvordan du implementerer dem for organisasjonen.

Obs!

  • Moderne emner støtter for øyeblikket bare tilpassing av apphodet. Andre tilpassinger, som å tilpasse forretningsprosessflytkontrollen, er ikke tilgjengelige.
  • For at moderne emner skal fungere, må den modelldrevne appen bruke det nye utseendet. Mer informasjon: Moderne, oppdatert utseende for modelldrevne apper

Endre fargene i apphodene

Med det moderne, oppdaterte utseendet aktivert i appen kan opprettere endre fargene som brukes av apphodet, slik at de kan tilpasses den organisasjonsmessige varemerkebyggingen. For å oppnå dette kan du omforme de ønskede fargene til en XML-ressurs, bruke en appinnstilling til å peke til denne webressursen, og deretter kontrollere at fargeendringene samsvarer med forventningen.

Obs!

Denne funksjonen er tilgjengelig i build 9.2.23094 eller senere.

Oversikt over XML-ressursen som skal brukes for appoverskriftsfarger

Det første trinnet i prosessen med å endre utforming av apphoder er å opprette en XML-fil med de ulike fargevalgene. Du oppretter senere en XML-webressurs med ett eller flere av attributtene nedenfor definert i et AppHeaderColors-merke.

  • Background – Bakgrunnsfargen på appholdet. Dette elementet må defineres for at eventuelle endringer skal tre i kraft.
  • Foreground – Tekstfargen på appholdet. Hvis dette ikke er angitt, prøver systemet å beregne en passende farge som har tilstrekkelig kontrast til den angitte bakgrunnsfargen.
  • BackgroundHover – Bakgrunnsfargen for knapper i apphodet når de beveges over. Hvis ingen verdi er angitt, beregner systemet en farge basert på bakgrunnsfargen.
  • ForegroundHover – Tekstfargen for knapper i apphodet når de beveges over. Hvis det ikke er angitt en verdi, prøver systemet å beregne en passende farge som har tilstrekkelig kontrast til bakgrunnsfargen til den pekerfølsomme fargen.
  • BackgroundPressed – Bakgrunnsfargen for knapper i apphodet når de trykkes ned. Standardlogikken er den samme som backgroundHover.
  • ForegroundPressed – Tekstfargen for knapper i apphodet når de trykkes ned. Standardlogikken er den samme som foregroundHover.
  • BackgroundSelected – Bakgrunnsfargen for knapper i apphodet når de velges. Standardlogikken er den samme som backgroundHover.
  • ForegroundSelected – Tekstfargen for knapper i apphodet når de velges. Standardlogikken er den samme som backgroundHover.

Eksempel-XML for et moderne tema

Som et eksempel angir denne XML-koden en grønn bakgrunnsfarge for appoverskriften med hvit tekst, med mørkere bakgrunnsfarger for de ulike samhandlingstilstandene for knapper. For å få best mulig brukervennlighet anbefaler vi at du angir forskjellige fargeverdier for hver tilstand.

<AppHeaderColors 
  background="#12783F"
  foreground="#FFFFFF" 
  backgroundHover="#165A31" 
  foregroundHover="#FFFFFF"
  backgroundPressed="#0F1C12"
  foregroundPressed="#FFFFFF"
  backgroundSelected="#153D23" 
  foregroundSelected="#FFFFFF"
/>

Opprette webressursen

  1. Lagre XMLen som brukes til å opprette webressursen, ved hjelp av et tekst- eller XML-redigeringsprogram. Eksempel-XML for et moderne tema
  2. Logg på Power Apps.
  3. Velg Løsninger i navigasjonsruten til venstre, og opprett deretter Ny løsning.
  4. Velg Ny > Mer > Webressurs.
  5. I egenskapsruten Ny nettressurs angir du følgende verdier:
    • Visningsnavn: Angi et visningsnavn, for eksempel XML for moderne tema.
    • Navn. Angi det unike navnet for webressursen.
    • Type: Data (XML)
  6. Velg Velg fil, bla til og velg deretter XML-filen du opprettet tidligere med temaet.
  7. Velg Lagre. Du publiserer denne tilpassingen med trinnene i neste del.

Bruke farger for egendefinert appoverskrift i apper i miljøet

Når du har valgt farger og opprettet webressursen, følger du denne fremgangsmåten for å aktivere denne apphodestilen for alle appene i miljøet der det nye utseendet er aktivert.

  1. I løsningen der du opprettet webressursen, velger du Legg til eksisterende > Mer > Innstilling.
  2. Skriv inn Overstyr i Søk-boksen, velg Overstyr fargen på appoverskriften, velg Neste, og velg deretter Legg til.
  3. I løsningen velger du Overstyr fargen på appoverskriften, og deretter velger du Rediger på kommandolinjen.
  4. I egenskapsruten for rediger overstyring av fargen på appoverskriften til høyre velger du Angi miljøverdi og angir det unike navnet på webressursen du opprettet tidligere. Pass på å legge til utgiverprefikset for webressursen og ikke inkludere tilbud. Navnet kan for eksempel vises som contoso_xmlfor-modern-theme, som i dette eksemplet. Miljøinnstilling for et tema med det unike webressursnavnet contoso_xmlfor-modern-theme.
  5. Velg Lagre.
  6. Velg Publiser alle tilpassinger på kommandolinjen. (Denne kommandoen vises når ingen komponenter i løsningen er valgt).

Med eksempelfargene skal apphodet se slik ut når du spiller av appen (det kan hende du må oppdatere nettleserfanen).
Grønt apphode i en modelldrevet app

Kontrollere nye appoverskriftsfarger

Når du har publisert de nye apphodefargene, må du validere visuelle effekter for appoverskriften, inkludert alle knappetilstander, for å sikre at alt vises som forventet, og at det er tilstrekkelige kontrastforhold for tilgjengelighet. Du bør kontrollere følgende fargevalg:

  • De ønskede fargene vises for når appoverskiften er i ro og for hver samhandlingstilstand for knappene.
  • Det er minimum et kontrastforhold på 4.5:1 mellom forgrunns- og bakgrunnsfarger for hviletilstanden og samhandlingstilstanden for hver knapp.

Se også

Moderne, oppdatert utseende

Obs!

Kan du fortelle oss om språkinnstillingene for dokumentasjonen? Ta en kort undersøkelse. (vær oppmerksom på at denne undersøkelsen er på engelsk)

Undersøkelsen tar rundt sju minutter. Det blir ikke samlet inn noen personopplysninger (personvernerklæring).