Partajați prin

Utilizarea temelor moderne

  • Articol

Utilizatorii de aplicații bazate pe modele cu aspectul modern și reîmprospătat pentru aplicațiile bazate pe model au activat o experiență de stil actualizat, aliniat la sistemul de design Microsoft Fluent 2. Deoarece acest aspect modern reîmprospătat vine cu un nou sistem de tematică, temarea clasică nu este onorată; cu toate acestea, producătorii pot modifica culorile utilizate de antetul aplicației pentru utilizatorii care au activat aspectul modern, reîmprospătat. În acest articol, aflați despre modificările de stil disponibile cu aspectul modern și reîmprospătat și despre cum să le implementați pentru organizația dvs.

Notă

  • Temele moderne acceptă în prezent doar personalizarea antetului aplicației. Alte personalizări, cum ar fi personalizarea controlului flux de business, nu sunt disponibile.
  • Pentru ca temele moderne să funcționeze, aplicația bazată pe model trebuie să folosească Aspect nou. Mai multe informații: Aspect modern și reîmprospătat pentru aplicațiile bazate pe model

Modificați culorile antetului aplicației

Cu aspectul modern și reîmprospătat activat în aplicație, creatorii pot modifica culorile utilizate de antetul aplicației pentru a se alinia cu brandingul organizațional. Pentru a realiza acest lucru, încapsulați culorile dorite într-o resursă XML, utilizați o setare de aplicație pentru a indica această resursă web și apoi verificați dacă modificările de culoare corespund așteptărilor.

Notă

Această funcționalitate este disponibilă în versiunea 9.2.23094 sau ulterioară.

Prezentare generală a resursei XML de utilizat pentru culorile antetului aplicației

Primul pas pentru modificarea stilului antetului aplicației este de a crea un fișier XML cu diferitele selecții de culori. Mai târziu, creați o resursă web XML cu unul sau mai multe dintre următoarele atribute definite în interiorul unei etichete AppHeaderColors .

  • Background – Culoarea de fundal a antetului aplicației. Acest element trebuie definit pentru ca orice modificare să intre în vigoare.
  • Foreground – Culoarea textului antetului aplicației. Dacă acest lucru nu este specificat, sistemul încearcă să calculeze o culoare adecvată care are suficient contrast cu culoarea de fundal furnizată.
  • BackgroundHover – Culoarea de fundal a butoanelor din antetul aplicației atunci când trec cu mouse-ul deasupra. Dacă nu este specificată nicio valoare, sistemul calculează o culoare pe baza culorii de fundal.
  • ForegroundHover – Culoarea textului butoanelor din antetul aplicației atunci când trec cu mouse-ul deasupra. Dacă nu este specificată nicio valoare, sistemul încearcă să calculeze o culoare adecvată care are suficient contrast cu culoarea de fundal Hover.
  • BackgroundPressed – Culoarea de fundal a butoanelor din antetul aplicației atunci când sunt apăsate. Logica implicită este aceeași cu backgroundHover.
  • ForegroundPressed – Culoarea textului butoanelor din antetul aplicației atunci când sunt apăsate. Logica implicită este aceeași cu foregroundHover.
  • BackgroundSelected – Culoarea de fundal a butoanelor din antetul aplicației atunci când sunt selectate. Logica implicită este aceeași cu backgroundHover.
  • ForegroundSelected – Culoarea textului butoanelor din antetul aplicației atunci când sunt selectate. Logica implicită este aceeași cu backgroundHover.

Exemplu XML pentru o temă modernă

De exemplu, acest XML specifică o culoare de fundal verde pentru antetul aplicației cu text alb, cu culori de fundal mai închise pentru diferitele stări de interacțiune a butoanelor. Pentru o utilizare optimă, vă recomandăm să specificați valori diferite de culoare pentru fiecare stare.

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

Creați resursa web

  1. Folosind un editor de text sau XML, salvați XML-ul care este utilizat pentru a crea resursa web. Exemplu XML pentru o temă modernă
  2. conectați-vă la Power Apps.
  3. Selectați Soluții în panoul de navigare din stânga, apoi creați o Soluție nouă.
  4. Selectați Nou > Mai multe > Resurse web.
  5. În panoul de proprietate nouă resursă web, introduceți următoarele valori:
    • Nume afișat: introduceți un nume afișat, cum ar fi XML pentru tematică modernă.
    • Nume. Introduceți numele unic pentru resursa web.
    • Tip: Date (XML)
  6. Selectați Alegeți fișierul, căutați, apoi selectați fișierul XML pe care l-ați creat mai devreme cu tema.
  7. Selectați Salvați. Publicați această personalizare cu pașii din secțiunea următoare.

Aplicați culori personalizate pentru antetul aplicației aplicațiilor din mediul dvs

După ce selectați culorile și creați resursa web, urmați acești pași pentru a activa acest stil pentru antetul aplicației pentru toate aplicațiile din mediul dvs. care au Aspect nou activat.

  1. În soluția pe care ați folosit-o pentru a creați resursa web, selectați Adăugați existente > Mai multe > Setarea.
  2. Tastați Înlocuire în caseta Căutare, selectați Înlocuire culoarea antetului aplicației, selectați Înainte, apoi selectați Adăugați.
  3. În soluție, selectați Înlocuire culoarea antetului aplicației, apoi selectați Editare în bara de comandă.
  4. În panoul de proprietăți din dreapta Editează anularea culorii antetului aplicației, selectează Setarea valorii mediului și introduceți numele unic al dvs. resursă web pe care ați creat-o mai devreme. Asigurați-vă că adăugați prefixul de editor pentru resursa web și nu includeți ghilimele. De exemplu, numele poate apărea ca contoso_xmlfor-modern-theme ca în acest exemplu. Setare de mediu pentru o temă cu nume unic de resursă web contoso_xmlfor-modern-theme.
  5. Selectați Salvați.
  6. Selectați Publicați toate personalizările pe bara de comandă. (Această comandă apare atunci când nu sunt selectate componente din soluție).

Cu exemplul de culori, antetul aplicației ar trebui să arate astfel când redați aplicația (s-ar putea să fie nevoie să reîmprospătați fila browser).
Antet verde al aplicației într-o aplicație bazată pe model

Se verifică noile culori ale antetului aplicației

După ce ați publicat noile culori ale antetului aplicației, veți dori să validați imaginile antetului aplicației, inclusiv toate stările butoanelor, pentru a vă asigura că totul apare așa cum vă așteptați și că există suficiente rapoarte de contrast pentru accesibilitate. Ar trebui să verificați următoarele opțiuni de culoare:

  • Culorile dorite sunt afișate pentru antetul aplicației în repaus și pentru fiecare stare de interacțiune cu butonul.
  • Există un raport de contrast minim de 4,5:1 între culorile din prim-plan și de fundal pentru starea de repaus și starea de interacțiune a fiecărui buton.

Consultați și

Aspect modern reîmprospătat

Notă

Ne puteți spune care preferințele dvs. lingvistice pentru documentație? Răspundeți la un chestionar scurt. (rețineți că acest chestionar este în limba engleză)

Chestionarul va dura aproximativ șapte minute. Nu sunt colectate date personale (angajament de respectare a confidențialității).