DPE SK Blog

Blog pre slovenských vývojárov od DPE (Developer and Platform Evangelist), Microsoft Slovakia

Novinky

Aktualizácie emailom

August 2015 - Príspevky

Windows 10 – nové prvky používateľského rozhrania (XAML)

V tomto pokračovaní série príspevkov venujúcich sa vývoju Windows 10 aplikácií sa bližšie pozrieme na možnosti tvorby používateľského rozhrania s využitím značkovacieho jazyka XAML (Extensible Application Markup Language).

XAML sa stáva platformou používateľského rozhrania číslo jedna pre Windows aplikácie. XAML bolo možné využiť už aj v minulosti, pri programovaní desktopových WPF aplikácií, no jeho využitie sa odvtedy značne rozšírilo a dostal sa aj do Win RT aplikácií a následne aj do UWP. Je však nutné podotknúť, že množina XAML prvkov pre WPF nie je zhodná s množinou XAML prvkov pre UWP. Jazyk XAML využívajú dokonca niektoré grafické súčasti operačného systému Windows 10, napríklad File Explorer alebo Štart obrazovka. XAML využívajú taktiež aplikácie z Office balíčka a MSN store aplikácie.

Štruktúra XAML je postavená na formáte XML, čo znamená, že vzhľad používateľského rozhrania definujete hierarchiou vhniezdených elementov a každý XAML súbor musí byť validný XML dokument. Čo sa týka tvorby používateľského rozhrania, máme tri možnosti a síce písať ho ručne, využiť editor, ktorý nám ponúka Visual Studio a Blend alebo kombinovať spomenuté prístupy. Osobne odporúčam využiť tretí prístup, kedy je s pomocou editora možné rýchlo vytvoriť rozhranie a následne ho doladiť prostredníctvom kódu (napr. nastavenie šírky, odsadenia elementu a pod.). Okrem Visual Studia sme spomenuli aj nástroj Blend. Tento nástroj je určený primárne na pokročilé editovanie používateľského rozhrania. To znamená, že v ňom viete veľmi jednoducho implementovať animácie, štýly, zmeniť základné šablóny jednotlivých prvkov používateľského rozhrania atď. Návody ako používať Blend môžete nájsť na tejto stránke.

XAML prvky používateľského rozhrania

XAML vám na tvorbu používateľského rozhrania ponúka mnoho rôznych prvkov a v prípade potreby vám taktiež umožňuje vytvoriť vlastné prvky, ktoré môžu byť založené na viacerých existujúcich prvkoch. Množinu dostupných prvkov používateľského rozhrania môžete taktiež rozšíriť s využitím knižníc vytvorených tretími stranami. Príkladom je projekt MyToolkit, ktorý ponúka veľké množstvo rozširujúcich prvkov (dostupný na Githube). Projekt je dostupný aj ako nuget.

Úplný prehľad implicitne dostupných XAML prvkov a ich vlastností môžete nájsť v XAML UI Basics aplikácii dostupnej na Githube.

V rámci tohto príspevku si však predstavíme nové zaujímavé prvky používateľského rozhrania, ktoré vo Win RT chýbali.

RelativePanel

Tento prvok patrí do skupiny tzv. „layout prvkov“. Prvky z tejto skupiny určujú rozloženie elementov, ktoré sú do nich vnorené. Samotný RelativePanel slúži ako kontajner umožňujúci vzájomné kotvenie vhniezdených elementov. RelativePanel ponúka tzv. pripojené vlastnosti – „attached properties“, ktoré umožňujú jednak umiestňovať elementy v rámci RelativePanelu, ale taktiež umiestňovať prvky relatívne jeden na druhý. Čo sa týka umiestnenia elementov v rámci RelativePanelu, sú tieto attached properties iba akýmsi ekvivalentom klasického zarovnania s využitím vlastnosti align, ktorá je používaná pri ostatných layout prvkoch ako napríklad Grid. Prehľad týchto vlastností uvádzame v nasledujúcej tabuľke.

Attached property

Predvolená hodnota

Align ekvivalent

RelativePanel.AlignBottomWithPanel

False

VerticalAlignment=”Bottom”

RelativePanel.AlignTopWithPanel

True

VerticalAlignment=“Top“

RelativePanel.AlignHorizontalCenterWithPanel

False

HorizontalAlignment=“Center“

RelativePanel.AlignVerticalCenterWithPanel

False

VerticalAlignment=“Center“

RelativePanel.AlignLeftWithPanel

True

HorizontalAlignment=“Left“

RelativePanel.AlignRightWithPanel

True

HorizontalAlignment=“Right“

 

Ako sme spomenuli, sila RelativePanelu prichádza s možnosťou umiestňovať elementy relatívne jeden na druhý a teda využiť kotvenie. To umožňujú nasledovné attached properties.

Attached property

Popis

RelativePanel.Above

Element ukotví nad kotviaci element

RelativePanel.Bellow

Element ukotví pod kotviaci element

RelativePanel.RightOf

Element ukotví na pravú stranu kotviaceho elementu

RelativePanel.LeftOf

Element ukotví na ľavú stranu kotviaceho elementu

RelativePanel.AlignLeftWith

Zarovná elementy vzhľadom na ľavý okraj kotviaceho elementu

RelativePanel.AlignRightWith

Zarovná elementy vzhľadom na pravý okraj kotviaceho elementu

RelativePanel.AlignHorizontalCenterWith

Zarovná elementy vzhľadom na horizontálny stred kotviaceho elementu

RelativePanel.AlignVerticalCenterWith

Zarovná elementy vzhľadom na vertikálny stred kotviaceho elementu

RelativePanel.AlignTopWith

Zarovná elementy vzhľadom na horný okraj kotviaceho elementu

RelativePanel.AlignBottomWith

Zarovná elementy vzhľadom na spodný okraj kotviaceho elementu

 

Uvedené vlastnosti je možné medzi sebou kombinovať. Kód nižšie a vytvorené rozhranie je ukážkou využitia viacerých vlastností:

<RelativePanel>

            <Border x:Name="ElementOne" Width="200" Height="200" Background="Red"

                    RelativePanel.AlignHorizontalCenterWithPanel="True"

                    RelativePanel.AlignVerticalCenterWithPanel="True"/>

            <Border Background="Green" Width="50" Height="50"

                    RelativePanel.LeftOf="ElementOne"

                    RelativePanel.AlignVerticalCenterWith="ElementOne"/>

            <Border Background="Blue" Width="50" Height="50"

                    RelativePanel.RightOf="ElementOne"

                    RelativePanel.AlignBottomWith="ElementOne"/>

        </RelativePanel>

 

Obrázok 1: Relatívne rozmiestnenie prvkov v RelativePanel

RelativePanel je vhodné využiť pri tvorbe adaptívneho rozhrania, keď potrebujete napríklad pri znížení dostupného rozlíšenia presunúť element spolu s elementami, ktoré sú naň ukotvené. Tento scenár môžete vidieť ilustrovaný na obrázku nižšie.

 

Obrázok 2: Presunutie elementov v rámci RelativePanelu (Zdroj: Developer's Guide to Windows 10 MVA)

 

Viac detailov ohľadom RelativePanel môžete nájsť v tomto príspevku na stránke visuallylocated.com.

SplitView

SplitView je taktiež prvok z rady „layout prvkov“. Ako už názov naznačuje SplitView umožňuje rozdeliť aplikačné okno na dve časti. Jednu časť pre hlavný obsah stránky a druhú vysúvaciu časť, v ktorej môže byť umiestnené napríklad menu alebo iné elementy súvisiace s kontextom hlavnej stránky. SplitView tak ponúka možnosť, ktorá v rámci Windows a Windows Phone aplikácií doteraz chýbala, a síce vytvoriť tzv. vysúvacie hamburgerové menu. SplitView má štyri zobrazovacie módy, ktoré môžete vidieť ilustrované na obrázku nižšie. Modrou farbou je znázornená hlavná obsahová časť a fialovou vysúvací panel.

 

Obrázok 3: SplitView zobrazovacie módy

Detailný návod na implementáciu hamburgerového menu môžete nájsť na blogu Jerryho Nixona.

CalendarView a DatePicker

CalendarView je v rámci store aplikácií taktiež novým prvkom. Vo Windows Store aplikáciách sa síce zobrazoval ako súčasť prvku DatePicker a slúžil na výber dátumu, no pre Windows Phone tento prvok neexistoval. V UWP je tento prvok úplne samostatným prvkom dostupným ako pre desktop, tak aj pre telefóny a ostatné rodiny Windows 10 zariadení. Použitie prvku CalendarView je veľmi jednoduché a umožňuje navigáciu v rámci kalendára prostredníctvom výberu roku, mesiaca a dňa. Jeho vzhľad je takmer totožný so vzhľadom systémového kalendára, ktorý môžete zobraziť kliknutím na čas na lište úloh.

 

Obrázok 4: CalendarView

Prvok DatePicker ponúka možnosť výberu dátumu, bez zobrazenia celého kalendára. Tento prvok síce nový nie je, no určité zmeny sa dotkli aj tohto prvku. Tí z vás, kto ste vyvíjali univerzálne aplikácie pre Win RT a použili ste tento prvok, viete, že na Windows Phone sa pri výbere dátumu zobrazila samostatná obrazovka, v ktorej bolo potrebné scrollovaním nastaviť správny rok, mesiac a deň, zatiaľ  čo vo Windows aplikácií sa v rámci aktuálnej obrazovky zobrazil kalendár. Práve táto odlišnosť bola odstránená a prišlo k zjednoteniu DatePicker prvku naprieč rodinami zariadení. DatePicker teraz ponúka rovnaký používateľský zážitok, ktorý je mierne prispôsobený forme používateľského vstupu. Nový DatePicker zobrazený na desktope a na telefóne môžete vidieť na obrázkoch nižšie (vľavo zobrazenie na desktope, vpravo zobrazenie na telefóne). Rozdiel, ktorý si môžete všimnúť je, že na desktopovej verzii, na ktorej sa predpokladá ovládanie myšou, pribudli tlačidlá – šípky, umožňujúce scrollovanie a výber správneho dátumu. Tlačidlo sa zobrazí vždy iba pod a nad stĺpcom, v ktorom na nachádza kurzor myši. Scrollovať je možné aj scrollovacím kolieskom myši. Vo verzii pre telefón sa predpokladá scrollovanie prostredníctvom prsta a preto sa tlačidlá nezobrazujú. Z obrázku to možno nie je úplne viditeľné, no keďže ovládanie dotykom/prstom je nepresnejšie, ako ovládanie myšou, sú na telefóne medzi jednotlivými dňami, rokmi, mesiacmi v zozname väčšie rozostupy.

 

Obrázok 5: DatePicker desktop a telefón

InkCanvas

Tento prvok, ako mnoho iných prvkov prichádza do store aplikácii z technológie WPF, ktorá sa využíva na tvorbu desktopových aplikácií. InkCanvas vám poskytuje kresliacu plochu, do ktorej môžete písať a kresliť nielen dotykovým perom, no je optimalizovaná aj na vstup myšou alebo dotykom. Vďaka InkCanvas môžete do vašej aplikácie veľmi jednoducho implementovať napríklad funkcionalitu umožňujúcu vytvorenie podpisu, no v prípade potreby vám taktiež umožní vytvoriť kresliaci editor s rozličnými funkciami. InkCanvas vám umožní nastavenie farby,hrúbky, tvaru pera, gumovanie obsahu, rozpoznávanie písaného textu a mnoho ďalšieho.

Ak využijete InkCanvas vo vašej aplikácií a chcete umožniť vstup myšou alebo dotykom, je potrebné v kóde tieto vstupy povoliť, pretože predvolené nastavenie umožňuje vstup iba dotykovým perom. Toto nastavenie vykonáte nasledovne:

inkCanvas.InkPresenter.InputDeviceTypes = CoreInputDeviceTypes.Mouse | CoreInputDeviceTypes.Touch;

Zároveň v aktuálnej verzii UWP (10.0.0.0) nie je možné vpisovať/kresliť do InkCanvas v prípade, že InkCanvas prvku nastavíte výšku a šírku. Je to zrejme pôvodne neodhalená chyba aktuálnej verzie UWP a ak chcete nastaviť rozmery, je potrebné využiť obaľujúci element (napr. Border). Viac o InkCanvas môžete nájsť na tomto msdn blogu.

V tomto príspevku sme si predstavili niektoré nové prvky používateľského rozhrania. Ak sa chcete vrhnúť do vývoja a chcete získať informácie aj o iných prvkoch používateľského rozhrania, ešte raz odporúčam XAML ukážkovú aplikáciu obsahujúcu popis všetkých implicitne dostupných XAML prvkov pre UWP - a samozrejme kurz vývoja Windows 10 aplikácií na Microsoft Virtual Academy.

V ďalšom diely si ukážeme, ako vytvoriť adaptívne používateľské rozhranie a povieme si, čo sú to adaptive triggers.

Marek.

 

Využite možnosť získať Xamarin subskripciu do konca augusta zadarmo

Xamarin je nástroj, ktorý umožňuje multiplatformový vývoj aplikácií, prostredníctvom vytvorenia jednotného kódu pre iOS, Android a Windows/Windows Phone platformu, s využitím jazyka C#. Výhodou nástroju Xamarin oproti iným riešeniam umožňujúcim multiplatformový vývoj, je fakt, že výsledné aplikačné balíčky pre jednotlivé platformy obsahujú plne natívny kód. Tento nástroj môžete využiť aj v kombinácií s Visual Studiom, ktoré je pre vás v edícii Community dostupné úplne zadarmo (https://www.visualstudio.com/en-us/products/visual-studio-community-vs.aspx).

Iba tento August ponúka Xamarin subskripciu Xamarin.iOS a Xamarin.Android vrátane rozšírenia pre Visual Studio na osobné použitie úplne zadarmo.

Táto ponuka platí pre nezávislých Windows Phone vývojárov, ktorí už vydali svoju Windows Phone aplikáciu. Pre zisk tejto subskripcie stačí vyplniť krátky formulár, v ktorom uvediete krátky popis vašej Windows Phone aplikácie, ktorá bola vydaná nie neskôr ako 17. augusta 2015. Viac informácií môžete nájsť na stránke Xamarin blogu.

 

Marek.

Ako nainštalovať .NET Framework 4.6 do Azure Cloud Service

Spolu s vydaním Visual Studia 2015 vyšla aj nová verzia .NET Framework 4.6. Vývojári samoobslužných aplikačným fariem v Azure (Cloud Services Web Role/Worker Role) si hneď položili otázku:“Vytvorím aplikáciu v .NET 4.6, nasadím ju do Cloud Service, ale ako na samoobslužné/automaticky vytvorené servery vo farme dostanem .NET Framework 4.6?“ .NET Framework 4.6 totiž nie je predinštalovaný na žiadnom serverovskom operačnom systéme.

Nasledujúcim návodom naštartujete každý server aplikačnej farmy typu Web Role tak, aby sa na ňho nainštaloval .NET 4.6 ešte pred spustením aplikácie. Predprípravou je nainštalovanie Azure SDK 2.7 do Visual Studia 2015 a stiahnutie .NET 4.6 Web Installer-a na lokálny disk.

1. Vytvorte v Visual Studiu testovací projekt Cloud Services Web Role postavený nad .NET 4.6. cez menu „File/New Project/Cloud – Azure Cloud Service“ a skôr ako potvrdíte OK, zmeňte verziu frameworku na .NET 4.6.

2. Pridajte do riešenia projekt ASP.NET WebRole a potvrďte OK.

3. Z ASP.NET šablón vyberte napr. MVC.

4. Po nasadení aplikácie do Cloud Service by sme radi jednoduchým spôsobom videli, že používa .NET Framework 4.6. Preto upravte napr. HomeController.cs tak, aby metóda „Contact“ zobrazila namiesto popisu aplikácie verziu nainštalovaného .NET Frameworku. Stačí do kódu stránky, do triedy HomeController  vložiť kód z https://msdn.microsoft.com/en-us/library/hh925568(v=vs.110).aspx zo sekcie “To find .NET Framework versions by querying the registry in code (.NET Framework 4.5 and later)” a mierne ho upraviť.

        //dekodovanie verzii podla releaseKey
private static string CheckFor45DotVersion(int releaseKey)
{
if (releaseKey >= 393273)
{
return "4.6 RC alebo novší";
}
if ((releaseKey >= 379893))
{
return "4.5.2 alebo novší";
}
if ((releaseKey >= 378675))
{
return "4.5.1 alebo novší";
}
if ((releaseKey >= 378389))
{
return "4.5 alebo novší";
}
return "Nie je nainštalovaný 4.5 alebo novší";
}

5. Upravte kód kontroléra pre Contact:

        public ActionResult Contact()
{
using (Microsoft.Win32.RegistryKey ndpKey = Microsoft.Win32.RegistryKey.OpenBaseKey(Microsoft.Win32.RegistryHive.LocalMachine, Microsoft.Win32.RegistryView.Registry32).OpenSubKey("SOFTWARE\\Microsoft\\NET Framework Setup\\NDP\\v4\\Full\\"))
{
int releaseKey = Convert.ToInt32(ndpKey.GetValue("Release"));
if (true)
{
ViewBag.Message = "Verzia: " + CheckFor45DotVersion(releaseKey);
}
}
return View();
}
 

6. V Solution Explorer-e v Cloud Service projekte vytvorte pod zložkou Roles novú zložku s názvom "bin" .

7. Cez kontextové menu zložky „bin“ (Add>Existing Item) pridajte uložený súbor .NET 4.6 Web Installer-a.

 

8. Na nainštalovanie najnovšieho frameworku použijeme Startup úlohu, ktorá sa spustí v Azure Cloud Service ešte pred naštartovaním aplikácie. Pridajte preto do súboru ServiceDefinition.csdef do vnútra elementu <WebRole></WebRole> nasledujúci kód:

    <LocalResources>
<LocalStorage name="InstalacnyLog" sizeInMB="5" cleanOnRoleRecycle="false" />
</LocalResources>
<Startup>
<Task commandLine="instaluj.cmd" executionContext="elevated" taskType="simple">
<Environment>
<Variable name="CestakLogu">
<RoleInstanceValue xpath="/RoleEnvironment/CurrentInstance/LocalResources/LocalResource[@name='InstalacnyLog']/@path" />
</Variable>
</Environment>
</Task>
</Startup>
 

9. Pripravte si príkazovú dávku „instaluj.cmd“, na ktorú sa odkazuje Startup úloha, s obsahom nižšie. Použite pritom editor, ktorý zachová ANSI kódovanie, napr. Notepad.

set netfxinstallfile="NDP46-KB3045560-Web.exe"
set netfxregkey="0x60051"

set timehour=%time:~0,2%
set timestamp=%date:~-4,4%%date:~-10,2%%date:~-7,2%-%timehour: =0%%time:~3,2%
set startuptasklog=%CestakLogu%startuptasklog-%timestamp%.txt
set netfxinstallerlog = %CestakLogu%NetFXInstallerLog-%timestamp%
echo Log generovany do: %startuptasklog% >> %startuptasklog%
echo Kontrola ci je .NET (%netfx%) nainstalovany >> %startuptasklog%
reg query "HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\NET Framework Setup\NDP\v4\Full" /v Release | Find %netfxregkey%

if %ERRORLEVEL%== 0 goto end
echo Instalujem .NET. : %netfxinstallerlog% >> %startuptasklog%
start /wait %~dp0%netfxinstallfile% /q /serialdownload /log %netfxinstallerlog% >> %startuptasklog% 2>>&1

:end
echo instaluj.cmd dokonceny: %date:~-4,4%%date:~-10,2%%date:~-7,2%-%timehour: =0%%time:~3,2% >> %startuptasklog%

 

10. Pridajte súbor “instaluj.cmd” do stromu webrole, na rovnakú úroveň, kde ste vložili inštalátor .NET 4.6. (Add>Existing Item nad zložkou „bin“.)

11. Cez kontextové menu Publish nad Cloud Service projektom nasaďte aplikáciu do Azure. Povoľte pri nasadzovaní Remote Desktop ( checkbox Enable Remote Desktop for all roles“), aby ste si mohli nainštalovanie .NET 4.6 na serveroch farmy preveriť aj priamym pripojenim a preverením logu v priečinku, do ktorého bude presmerovaný InstalacnyLog.

12. Po ukončení procesu nasadenia a naštartovaní aplikácie v cloude, prejdite na jej URL adresu a vyberte menu Contact, pretože do kontroléru tohto menu sme vložili kód na zistenie nainštalovanej verzie .NET-u.

13. .NET 4.6 sa na servery aplikačnej farmy úspešne nainštaloval!

 

Miro

 

P.S. Ak ste členmi BizSpark programu pre začínajúce vývojárske "startupy" (firmy alebo živnostníkov) , alebo máte kúpené Visual Studio s MSDN, môžete si bezplatne aktivovať Azure benefit v týchto programoch (Microsoft Azure pre členov BizSpark , Microsoft  Azure pre MSDN predplatiteľov). Pri registrácii Azure benefitu v MSDN alebo BizSparku nie je požadované overenie platobnou kartou. Ak nie ste členmi týchto programov, môžete si Microsoft Azure bezplatne vyskúšať na dobu 30 dní cez Microsoft Azure Trial.

Windows 10 – začíname s vývojom univerzálnych aplikácií

V predchádzajúcich príspevkoch k vývoju univerzálnych aplikácií pre Windows 10 (Windows 10 – univerzálny vývoj aplikáciíPreneste Android, iOS, Web alebo Desktop aplikácie na Windows 10) sme si po teoretickej stránke predstavili novinky pre vývojárov moderných store aplikácií. V tomto príspevku sa dostaneme už aj k praktickej časti a ukážeme si, ako začať vyvíjať aplikácie postavené na Universal Windows Platform (UWP).

Vývojárske nástroje

Pre vývoj Windows 10 aplikácií je potrebné Visual Studio 2015, v ktorejkoľvek edícií (t.z., že môžete využiť aj edíciu Community, ktorá je dostupná pre vývojárov zdarma). Počas inštalácie Visual Studia je potrebné nainštalovať nástroje na vývoj univerzálnych Windows 10 aplikácii (Universal Windows App Develoment Tools). Túto súčasť nájdete v zozname ponúkanej funkcionality (viď. obr. nižšie). V prípade, že ste si už Visual Studio nainštalovali, no nenainštalovali ste si nástroje na vývoj univerzálnych aplikácií, máte dve možnosti ako nástroje doinštalovať. Prvá z nich je modifikácia súčastí Visual Studia. Túto modifikáciu spustíte cez Ovládací panel, v sekcii Programy -> Programy a súčasti kliknite pravým tlačidlom myši na Visual Studio [vaša edícia] 2015 a zvoľte možnosť Zmeniť. Následne sa otvorí inštalačný sprievodca Visual Studia. Zvoľte možnosť Modify (Zmeniť) a v zozname funkcionalít vyberte spomenutú súčasť.  Druhou možnosťou je stiahnuť súbor VSToolsForWindows zo stránky https://dev.windows.com/en-us/downloads. Sťahovanie inicializujete kliknutím na odkaz špecifický pre vašu verziu Visual Studia v časti Windows developer tooling. Stiahnutý súbor taktiež spustí sprievodcu inštaláciou Visual Studia. Následný postup je rovnaký ako v predchádzajúcom prístupe.

Obrázok 1: Visual Studio inštalácia - zoznam ponúkanej funkcionality

Čo sa týka operačného systému, odporúča sa vyvíjať na počítači s Windows 10, kvôli podpore priameho ladenia a spúšťania vytváranej aplikácie. Vyvíjať UWP aplikácie je možné aj na systémoch Windows 8, prípadne 7. Pre tieto systémy je však obmedzená možnosť ladenia aplikácie, nakoľko na Windows 8, môžete spúšťať aplikáciu iba v rámci emulátora, resp. simulátora, pričom na Windows 7 lokálne ladenie nie je možné vôbec, vzhľadom na chýbajúcu podporu Hyper-V virtualizácie. 

Vytvorenie prvého projektu univerzálnej aplikácie

Aplikačný projekt univerzálnej Windows 10 aplikácie vytvoríme nasledovne:

  1. Spustíme Visual Studio s nainštalovanými nástrojmi na vývoj univerzálnych aplikácií
  2. V záložke Súbor (File) vyberieme voľbu Nový (New) a následne voľbu Projekt (Project).
  3. V zozname nainštalovaných šablón vyberieme programovací jazyk, následne rozbalíme záložky Windows a Universal. Ako si môžete všimnúť aj na obr. 2, máme k dispozícií viacero šablón, no čo sa týka samotného vývoja aplikácie, je pre nás relevantná iba prvá šablóna Prázdna aplikácie (Blank App). Ostanté šablóny slúžia na vytvorenie znovu-použiteľných častí kódu resp. aplikačných testov. (Pozn.: Tí z vás, ktorí vyvíjali Win RT aplikácie pre Windows/Windows Phone 8.1, ste si zrejme všimli absenciu šablóny typu Hub Application, ktorá implicitne obsahovala viacero stránok, predgenerované dáta a rôzne helpre napr. na navigáciu v rámci aplikácie a pod. Podobná šablóna sa zatiaľ do nástrojov pre vývoj univerzálnych aplikácií nedostala, no zastúpi ju šablóna vytvorená komunitou s názvom Template 10, ktorá je dostupná na GitHub-e https://github.com/Windows-XAML/Template10, a ktorá bude onedlho vydaná aj ako Nuget balíček. K tejto šablóne si povieme pár slov aj v rámci tohto príspevku.)

     

    Obrázok 2: Windows Universal šablóny

  4. Po zvolení šablóny Blank App, zvolíme v poli Name názov aplikácie a o riadok nižšie zvolíme umiestnenie a klikneme na tlačidlo OK.
  5. Vytvorí sa nám projekt prázdnej aplikácie, ktorú už teraz môžeme spustiť, no aplikácia nám okrem implicitne poskytnutej úvodnej obrazovky (splash screen) nezobrazí nič viac. Aby aplikácia robila aj niečo viac, musíte začať vytvárať aplikačný kód. V ďalších príspevkoch si ukážeme ako na to, no ak sa vám nechce čakať, opäť odporúčam tento kurz A Developer's Guide to Windows 10 na Microsoft Virtual Academy.

Template 10

Ako som už spomenul, Template10 je snahou komunity vytvoriť aplikačnú šablónu, ktorá obsahuje  implementované triedy a funkcionalitu, ktorú by ste za iných okolností museli častokrát programovať sami, a tým sa snaží umožniť vám v čo možno najväčšej miere zamerať sa na implementáciu vašej špecifickej aplikačnej logiky. Template10 si môžete stiahnuť ako archív alebo naklonovať priamo z GitHub-u - https://github.com/Windows-XAML/Template10. Po otvorení šablóny Template10 vo Visual Studiu, zistíte, že obsahuje 5 rôznych projektov, a to nasledovné:

  • Template10.Services – nájdete tu implementáciu helperov pre často používané služby ako napríklad mapy, toast notifikácie, primárne a sekundárne živé dlaždice, zdieľanie obsahu a mnoho ďalších.
  • V priečinku Templates nájdete samotné šablóny referencujúce knižnicu Windows10Template. Tento priečinok obsahuje tri šablóny, z ktorých všetky využívajú funkcionalitu poskytnutú knižnicou Template10Library v rozličnom rozsahu. Všetky zo šablón priamo podporujú vývoj s využitím vzoru Model View View-Model, no samozrejme jeho použitie nie je nevyhnutná podmienka pri využití Template10 (ďalšie odporúčanie, ak sa chcete o vzore MVVM dozvedieť viac-pozrite blog Jerryho Nixona - http://blog.jerrynixon.com/2012/08/most-people-are-doing-mvvm-all-wrong.html). Prvým projektom v priečinku je projekt Blank, ktorý neobsahuje žiadnu funkcionalitu a môžete ho využiť, ak nepotrebujete využiť funkcionalitu implementovanú v dvoch ďalších projektoch a postačuje vám projekt referencujúci Template10 knižnicu. Ďalšie dva projekty už obsahujú implementáciu jednoduchej funkcionality. Projekt Minimal obsahuje dve stránky, medzi ktorými je vytvorená navigácia s odovzdávaním parametra. Projekt Sample obsahuje funkcionalitu poznámkového resp. pripomienkového bloku, pričom umožňuje vytvárať a kategorizovať pripomienky.
  • Tretím projektom je spomenutá knižnica Template10Library, ktorá obsahuje implementáciu dôležitých tried, ako napríklad BackButton.cs obsahujúcu logiku zobrazovania spätného navigačného tlačidla, na základe zariadenie, na ktorom aplikácia beží. Ďalej triedy NavigationService.cs, ktorá umožňuje jednoducho implementovať logiku navigácie v rámci vašej aplikácie, vrátane ukladania stavu stránky, KeyboardService.cs implementujúcu navigáciu v rámci aplikácie s využitím klávesnice, predvytvorené konvertory, ktoré môžete využiť pri zobrazovaní hodnôt premenných v rámci XAML atď.

 

Obrázok 3: Prieskumník riešenia - Template10

Moje odporúčanie do vydania ďalšieho príspevku je poexperimentovať a preskúmať triedy v rámci Template10 šablóny. Ak s vývojom Windows aplikácií nemáte veľa skúseností, mnohé z nich sa vám môžu zdať momentálne nepotrebné, no časom zistíte, že implementujú funkcionalitu, ktorú by ste museli opakovane implementovať sami. Eventuálne by ste sa po niekoľkých razoch dopracovali k vytvoreniu vlastnej šablóny. Zároveň by som rád dodal, že projekt Template10 je stále vo vývoji, preto po nejakom čase nemusia presne platiť informácie popísané v tomto príspevku a pred tým ako sa pustíte do programovania každej aplikácie, odporúčam preskúmať aktuálny stav projektu a v prípade zmien ho stiahnuť nanovo. Rovnako, ako som už spomenul, Template10 bude dostupný aj vo forme Nuget-u, čo uľahčí jeho využitie vo vašej aplikácii. 

Marek.

Eset File Security pre ochranu virtuálnych serverov v Azure

V polovici júla 2015 Eset a Azure tím oznámili podporu ESET File Security v Azure vo forme rozšírenia pre virtuálne servery (Azure VM).

 

Pre cloudových používateľov to, zjednodušene povedané, znamená 3 veci:
- že si môžu pohodlne pridať Eset File Security Azure VM Extension do virtuálneho servera. Inštalácia prebehne veľmi rýchlo a na pozadí.
  Tu nájdete návod, ako doinštalovať ESET File Security do Azure VM cez Azure portál. 
- že na aktiváciu Eset File Security VM Extension môžu použiť existujúcu platnú licenciu. Alebo si samozrejme kúpiť novú. Aktiváciu môžu potvrdiť z rozhrania Eset File Security alebo použitím Eset Remote Administrator.
  Tu nájdete postup aktivácie Eset File Security. 
- že ich súbory v virtuáloch bežiacich na Azure bude chrániť renomovaný antivírový softvér.

Eset File Security Azure VM Extension podporuje Azure VM s Windows Server 2008 a 2008 R2, Windows Server 2012 a 2012 R2. Okrem inštalácie cez Azure portál, ho môžete pridať do virtuálnych serverov aj cez PowerShell, XPlat-Cli a pomocou šablón pre Azure Resource Manager. Zdroje nájdete priamo na githube a v blogposte o podpore Eset File Security na Azure.

 

Miro

Viac príspevkov