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 - https://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.