Používanie moderných motívov
Používatelia modelom riadených aplikácií s moderným, sviežim vzhľadom pre modelom riadené aplikácie zažívajú aktualizovaný štýl v súlade s dizajnovým systémom Microsoft Fluent 2. Pretože tento moderný svieži vzhľad prichádza s novým systémom motívov, klasické motívy nie je rešpektované; tvorcovia však môžu upraviť farby používané v hlavičke aplikácie pre používateľov, ktorí povolili moderný, svieži vzhľad. V tomto článku sa dozviete o prepisoch štýlu, ktoré sú k dispozícii s moderným, sviežim vzhľadom, a o tom, ako ich implementovať vo vašej organizácii.
Poznámka
- Moderné témy v súčasnosti podporujú iba prispôsobenie hlavičky aplikácie. Iné prispôsobenia, ako napríklad prispôsobenie ovládacieho prvku tok obchodného procesu, nie sú k dispozícii.
- Aby moderné motívy fungovali, modelom riadená aplikácia musí používať nový vzhľad. Ďalšie informácie: Moderný, svieži vzhľad aplikácií s podporou modelov
Upravte farby hlavičky aplikácie
Vďaka modernému, obnovenému vzhľadu v aplikácii môžu tvorcovia upraviť farby používané v hlavičke aplikácie tak, aby boli v súlade so značkou ich organizácie. Aby ste to dosiahli, zapuzdrete požadované farby do zdroja XML, pomocou nastavenia aplikácie ukážete na tento webový zdroj a potom overíte, či zmeny farieb zodpovedajú očakávaniam.
Poznámka
Táto funkcia je dostupná v zostave 9.2.23094 alebo novšej verzii.
Prehľad zdroja XML, ktorý sa má použiť pre farby hlavičky aplikácie
Prvou krok úpravou štýlu hlavičky aplikácie je vytvorenie súboru XML s rôznymi výbermi farieb. Neskôr vytvoríte webový zdroj XML s jedným alebo viacerými z nasledujúcich atribútov definovaných v tagu AppHeaderColors
.
Background
– Farba pozadia hlavičky aplikácie. Tento prvok musí byť definovaný, aby sa zmeny prejavili.Foreground
– Farba textu hlavičky aplikácie. Ak to nie je zadané, systém sa pokúsi vypočítať vhodnú farbu, ktorá má dostatočný kontrast k poskytnutej farbe pozadia.BackgroundHover
– Farba pozadia tlačidiel v hlavičke aplikácie, keď na ne umiestnite kurzor myši. Ak nie je zadaná žiadna hodnota, systém vypočíta farbu na základe farby pozadia.ForegroundHover
– Farba textu tlačidiel v hlavičke aplikácie, keď na ne umiestnite kurzor myši. Ak nie je zadaná žiadna hodnota, systém sa pokúsi vypočítať vhodnú farbu, ktorá má dostatočný kontrast k farbe pozadiaHover.BackgroundPressed
– Farba pozadia tlačidiel na hlavičke aplikácie, keď sú stlačené. Predvolená logika je rovnaká ako logika backgroundHover.ForegroundPressed
– Farba textu tlačidiel na hlavičke aplikácie, keď sú stlačené. Predvolená logika je rovnaká ako pri foregroundHover.BackgroundSelected
– Farba pozadia tlačidiel v hlavičke aplikácie, keď sú vybraté. Predvolená logika je rovnaká ako logika backgroundHover.ForegroundSelected
– Farba textu tlačidiel v hlavičke aplikácie, keď sú vybraté. Predvolená logika je rovnaká ako logika backgroundHover.
Príklad XML pre modernú tému
Ako príklad tento XML špecifikuje zelenú farbu pozadia pre hlavičku aplikácie s bielym textom a tmavšie farby pozadia pre rôzne stavy interakcie s tlačidlami. Pre optimálnu použiteľnosť odporúčame špecifikovať rôzne hodnoty farieb pre každý stav.
<AppHeaderColors
background="#12783F"
foreground="#FFFFFF"
backgroundHover="#165A31"
foregroundHover="#FFFFFF"
backgroundPressed="#0F1C12"
foregroundPressed="#FFFFFF"
backgroundSelected="#153D23"
foregroundSelected="#FFFFFF"
/>
Vytvorte webový zdroj
- Pomocou textového alebo XML editora uložte XML, ktorý sa používa na vytvorenie webového prostriedku. Príklad XML pre modernú tému
- Prihláste sa do Power Apps.
- Vyberte Riešenia na ľavom navigačnom paneli a potom vytvorte Nové riešenie.
- Vyberte Nové > Viac > Webový zdroj.
- Na table Vlastnosti nového webového prostriedku zadajte nasledujúce hodnoty:
- Zobrazovaný názov: Zadajte zobrazovaný názov, napríklad XML pre moderný motív.
- Názov. Zadajte jedinečný názov webového zdroja.
- Typ: Údaje (XML)
- Vyberte Vybrať súbor, vyhľadajte a potom vyberte súbor XML, ktorý ste predtým vytvorili s témou.
- Vyberte Uložiť. Toto prispôsobenie zverejníte pomocou krokov v ďalšej časti.
Použite vlastné farby hlavičky aplikácií na aplikácie vo vašom prostredí
Po výbere farieb a vytvorení webového zdroja postupujte podľa týchto krokov a povoľte tento štýl hlavičky aplikácie pre všetky aplikácie vo vašom prostredí, ktoré majú povolený Nový vzhľad .
- V riešení, ktoré ste použili na vytvorenie webového zdroja, vyberte Pridať existujúce > Viac > Nastavenie.
- Napíšte Prepísať do poľa Hľadať, vyberte Prepísať farbu hlavičky aplikácie, vyberte Ďalej a potom vyberte Pridať.
- V riešení vyberte Prepísať farbu hlavičky aplikácie a potom na paneli príkazov vyberte Upraviť .
- Na pravej table vlastností Upraviť prepísanie farby hlavičky aplikácie vyberte Nastavenie hodnoty prostredia a zadajte jedinečný názov svojej webový zdroj, ktorý ste predtým vytvorili. Nezabudnite pridať predponu vydavateľa pre webový zdroj a nezahrňte úvodzovky. Názov sa môže napríklad zobraziť ako contoso_xmlfor-modern-theme ako v tomto príklade.
- Vyberte Uložiť.
- Vyberte Zverejniť všetky prispôsobenia na paneli príkazov. (Tento príkaz sa zobrazí, keď nie sú vybraté žiadne komponenty v riešení).
S vzorovými farbami by hlavička aplikácie mala pri prehrávaní aplikácie vyzerať takto (možno budete musieť obnoviť kartu prehliadača).
Overujú sa nové farby hlavičky aplikácie
Po zverejnení nových farieb hlavičky aplikácie budete chcieť overiť vizuály hlavičky aplikácie vrátane všetkých stavov tlačidiel, aby ste sa uistili, že všetko vyzerá tak, ako očakávate, a že existujú dostatočné kontrastné pomery pre dostupnosť. Mali by ste si overiť nasledujúce možnosti farieb:
- Požadované farby sa zobrazia pre hlavičku aplikácie v pokoji a pre každý stav interakcie tlačidla.
- Kontrastný pomer medzi farbami popredia a pozadia je minimálne 4,5:1 pre pokojový stav a každý stav interakcie tlačidla.
Pozrite si tiež
Poznámka
Môžete nás informovať o svojich voľbách jazyka pre dokumentáciu? Absolvujte krátky prieskum. (upozorňujeme, že tento prieskum je v angličtine)
Prieskum bude trvať približne sedem minút. Nezhromažďujú sa žiadne osobné údaje (vyhlásenie o používaní osobných údajov).