Checking for design mode in Xamarin.Forms

Visual Studio for Windows and Mac now includes Xamarin XAML Previewer, which allows you to preview your Xamarin.Forms XAML without having to launch the app. Unfortunately, there are times when your page constructor contains code that cannot be run in design mode (for example service resolution, etc.) and causes the previewer to crash. Can we easily check if the app is in preview (design) mode?

XAML Previewer
XAML Previewer

Continue reading “Checking for design mode in Xamarin.Forms”

Úprava viditelnosti pojmenovaných XAML elementů

Atribut x:Name v XAMLu vytváří pro elementy členské položky třídy, které lze použít pro přístup k ovladacím prvkům z kódu. Narozdíl od WPF však v UWP jsou tyto položky třídy definovány jako private, což znamená, že k nim je možné přistupovat pouze z třídy samotné. Pokud vezmeme v potaz, že z hlediska architektury by to byl špatný nápad, je možné toto chování změnit? Continue reading “Úprava viditelnosti pojmenovaných XAML elementů”

When a single transparent color is simply not enough

There are countless times in the life of a Universal Windows Platform app developer when the “Transparent” color comes handy. However, it is good to remember that “Transparent” is still just a color, otherwise you can encounter some unwelcome surprises.

Animation of "Transparent" color
On the left is the animation from “Transparent” to White, on the right from “Transparent” to Black

Continue reading “When a single transparent color is simply not enough”

Device family state trigger pro UWP

Univerzální platforma Windows funguje na mnoha různých typech zařízení (device family). Aby aplikace vypadala skvěle na různých zařízeních, většinou lze použít AdaptiveTrigger, který reaguje na různá rozlišení displeje. Pokud však potřebujeme cílit na konkrétní rodinu zařízení, je možné si pro tento účel vytvořit vlastní state trigger. Continue reading “Device family state trigger pro UWP”

Tip: Roztažení položek seznamu v UWP na šířku

Ovládací prvky ListView a ListBox v univerzální platformě Windows je možné snadno využít pro zobrazení seznamů v uživatelském rozhraní aplikace. Ve výchozí podobě zabírají jednotlivé položky seznamu pouze ten prostor, který skutečně potřebují, což se často nehodí, protože je chceme roztáhnout na celou šířku ovládacího prvku. Jak toho dosáhnout?

Ve výchozí podobě jsou prvky zarovnané vlevo. Jak je roztáhnout?

Continue reading “Tip: Roztažení položek seznamu v UWP na šířku”

Jak vynutit otevření CommandBaru směrem dolů

Ovládací prvek CommandBar  je důležitou komponentou pro design UWP aplikací. Jde o evoluci konceptu   AppBar , který je dostupný již od dob Windows Phone 7, ale v případě UWP má výrazně více funkcí. Stále však chybí možnost určit směr, kterým se command bar bude otevírat.

Problém

Výchozí chování CommandBaru je otevření směrem nahoru vždy, kdy není na samotném horním okraji okna. To je problém, protože toto platí i v případě, že definujeme vlastní title bar aplikace na Desktopu, kdy se   CommandBar  otevře pod tlačítka minimalizace, maximalizace a zavření okna a to rozhodně nevypadá dobře.

Výchozí šablona

Výchozí šablona prvku CommandBar  definuje kolekce VisualState  a  VisualStateTransition , které určují, jak bude prvek vypadat. Můžeme si všimnout že je vždy separátně definován stav pro otevření směrem dolů a nahoru.

Uvnitř těchto stavů můžeme vidět, že systém jen používá různé hodnoty pro některé z vlastností jako například CommandBarTemplateSettings.ContentHeight  resp. CommandBarTemplateSettings.NegativeOverflowContentHeight  pro vlastnost  Y  u transformace OverflowContentRootTransform .

Řešení

Nemůžeme snadno modifikovat vnitřní logiku ovladacího prvku, ale můžeme zajistit, že bude vypadat pro stav otevření nahoru identicky jako pro otevření dolů. Toho můžeme dosáhnout čistě překopírováním Storyboardů  ze stavů a přechodů se obsahujících ...OpenDown do jim odpovídajících  ...OpenUp  protějšků. Bohužel manuální překopírování je jediná možnost. Bylo by sice také možné jednotlivé Storyboardy  převést na samostatné resource, ale bohužel je pro VisualState  a VisualStateTransition nelze referencovat pomocí syntaxe {StaticResource}.

Pro získání kompletní kopie výchozího stylu olvadacího prvku můžeme buď použít Visual Studio XAML Designer (klepněte na prvek pravým tlačítkem myši, vyberte Edit Template a Edit a Copy…), nebo ji lze vyhledat na v souboru   C:\Program Files (x86)\Windows Kits\10\DesignTime\CommonConfiguration\Neutral\UAP{version}\Generic\generic.xaml

Abych vám ušetřil klávesy  Ctrl , C  a V , připravil jsem kompletní upravený styl, který můžete přímo použít ve vaší aplikaci. Styl je ke stažení na mém GitHubu spolu s ukázkovým projektem k tomuto článku. Upozorňuji, že můj definovaný styl je pro verzi Anniversary Update. Pro budoucí verze doporučuji změny provést manuálně na aktuální šabloně.

Shrnutí

CommandBar  je skvělý ovladací prvek, který většinou funguje přesně tak, jak potřebujeme. Když však narazíme na problém, můžeme jeho šablonu poměrně snadno modifikovat.