Podpora světlého motivu u taskbar ikon v UWP

Zkušební verze Windows 10 Insider Preview verze 18282 poprvé představila světu krásný světlý motiv systémového shellu (menu Start, taskbaru a centra akcí). Mnoho systémových aplikací bylo aktualizováno pro podporu tohoto barevného nastavení, takže se podíváme, jak podporu světlého motivu taskbar ikon můžeme přidat i do našich UWP aplikací!

Light theme taskbar icon

Příklad: Microsoft Store

Použijme aplikaci Microsoft Store jako modelový příklad. V její složce Assets najdeme následující:

Microsoft Store Assets

O různých typech podporovaných ikon v UWP jsem již napsal v jednom z předešlých článků a se světlým motivem systémového shellu se tato nabídka dále rozrůstá o lightunplated suffix:

  • targetsize-{size}_altform-lightunplated

Ikony pro světlý motiv v akci

Výchozí šablona pro prázdnou UWP aplikaci automaticky obsahuje ikonu se suffixem altform-unplated vhodnou pro zobrazení na taskbaru.

Bohužel, pokud uživatel přepne na světlý motiv, systém musí kvůli kontrastu využít klasickou verzi ikony s barevným pozadím:

Pokud tedy chceme, aby naše aplikace měla i ve světlém motivu ikonu s průhledným pozadím, musíme poskytnout systému druhou png ikonu se suffixem lightunplated. V ideálním případě by tato verze měla být adaptována tak, aby byla dobře viditelná na světlém taskbaru, takže je lepší v ní používat tmavé barvy.

Já jsem použil následující ikonu (děkuji, Icons8!):

Logo 24x24 light theme

Přejmenoval jsem ji na Square44x44Logo.targetsize-24_altform-lightunplated.png a přidal do projektu. To stačí, aby ji systém nalezl a v případě světlého motivu použil:

Light theme taskbar icon

Velikosti

K základní velikosti taskbar ikony můžete také přidat více variant pro různé hustoty pixelů. Jak jsem popisoval v mém starším článku, Visual Studio zobrazuje velikosti 256, 48, 24 a 16, ale můžete volně doplnit ikony i o dalších rozměrech.

Kompatibilita

Jak jsem zmínil na začátku článku, světlý motiv Windows Shell byl poprvé uveden ve Windows 10 Insider Preview build 18282 (listopad 2018), ale ikony lightunplated můžete přidat i do aplikací běžících na jakékoliv jiné verzi Windows 10 a ve starších verzích budou jednoduše ignorovány.

Zdrojový kód

Ukázkový zdrojový kód k tomuto článku je k dispozici na mém GitHubu

Shrnutí

Světlý motiv shellu Windows byl dlouho očekáván a je skvělé jej konečně vidět v celé kráse. Přidání ikon pro světlý taskbar je rychlé a snadné takže pro vývojáře aplikací je to samozřejmost 🙂 .

 

 

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">

*

This site uses Akismet to reduce spam. Learn how your comment data is processed.