Image
25.8.2015 0 Comments

Vývoj pre Windows 10 – Prvá aplikácia UWP / 3. časť

Späť na úvod >> Späť na programovanie >> Späť na seriál

Najskôr si urobíme inventúru softvérového vybavenia, ktoré budete pri vývoji aplikácií UWP (Universal Windows Platform) potrebovať. Predovšetkým fyzický alebo virtuálny počítač s operačným systémom Windows 10, ktorý bol v čase písania článku stále vo verzii Insider Preview. Dostupnosť komerčnej verzie je naplánovaná na 29. júla. Ďalej potrebujete vývojové prostredie Visual Studio 2015, buď komerčnú, alebo voľne šíriteľnú verziu Community edition. V čase písania článku bola k dispozícii vo verzii Release Candidate. Aby ste mohli aplikácie spúšťať a ladiť vrátane mobilných telefónov, potrebujete Windows 10 SDK a Windows 10 Mobile Emulator.

Vytvorenie projektu

Vo Visual Studio 2015 vytvorte vo svojom preferovanom programovacom jazyku C#, Visual Basic, C++ alebo JavaScript projekt typu Blank App v zložke Windows Universal. V tomto seriáli budeme využívať v našich končinách najobľúbenejší programovací jazyk C#.

Vytvorenie projektu aplikácie

Ponuka projektov pre univerzálne aplikácie Windows 8.1 obsahovala aj komplexnú šablónu Hub App, umožňujúcu vytvárať dizajnovo pútavé aplikácie, schopné zobrazovať kombinovaný obsah vo viacerých horizontálne oddelených sekciách. Vo verzii RC je zatiaľ len šablóna prázdnej aplikácie. Projekt obsahuje iba jedinú stránku používateľského rozhrania v súbore MainPage.xaml. Ďalšie stránky požadovaného typu môžete pridávať počas vývoja. Vo fáze vytvárania projektu vás vývojové prostredie upozorní, aby ste v nastaveniach Windows 10 v sekcii Update and Security v zložke For developers povolili vývojársky mód, aby ste mohli spúšťať nielen aplikácie z obchodu Windows, ale aj vlastné, ktoré vyvíjate a ladíte a ktoré ešte neboli v obchode publikované.

Vyvoj10_2.jpg

Povolenie vývojárskeho módu na vašom zariadení s Windows 10

Aby bola prvá aplikácia čo najjednoduchšia, umiestnite na plochu v súbore MaiPage.xaml nejaké jednoduché prvky, napríklad DatePicker a TimePicker na nastavovanie dátumu a času. Môžete si popozerať, ako bude používateľské rozhranie aplikácie zobrazené na rôznych veľkostiach displeja pri horizontálnej aj vertikálnej orientácii. Samozrejme, môžete aplikáciu aj spustiť. Ak sa to podarí, je všetko OK. V opačnom prípade máte pravdepodobne konflikt medzi nainštalovanou verziou Windows 10 a verziou SDK. Treba stiahnuť novú verziu a SDK preinštalovať.

Vyvoj10_5.jpg

Návrh používateľského rozhrania aplikácie

Adaptívne používateľské rozhranie

Pri aplikáciách Windows 8.1 a Windows Phone 8.1 sa navrhovalo používateľské rozhranie pre každú platformu zvlášť. Preto sa s výhodou dali použiť kontajnery na usporiadanie ovládacích prvkov. Napríklad StackPanel zoraďuje v ňom zapuzdrené prvky vodorovne alebo zvisle. Grid umožňuje rozmiestňovať prvky flexibilne do buniek. Pri aplikáciách UWP pre Windows 10 pribudol nový kontajnerový prvok RelativePanel, ktorý implementuje rozloženie prvkov definované relatívnymi väzbami (vpravo, vľavo, nad, pod...), takže sa vďaka možnosti preskupenia prvkov dokáže lepšie prispôsobiť zmenám v rozlíšení obrazovky. Ukážeme jednoduchý príklad využívajúci jeden prvok typu TextBox a dva tlačidlá.

<RelativePanel>
<TextBox x:Name="textBox1" Text="textbox" Margin="15"/>
<Button x:Name="blueButton" Margin="15" Background="LightBlue"
Content="Tlačidlo vpravo" RelativePanel.RightOf="textBox1"/>
<Button x:Name="orangeButton" Margin="15" Background="Orange"
Content="Tlačidlo pod modrým" RelativePanel.RightOf="textBox1"
RelativePanel.Below="blueButton"/>
</RelativePanel>

Platformovo závislý kód

Väčšina kódu pobeží na počítačoch, tabletoch a mobilných zariadeniach bez toho, aby ste ho nejakým spôsobom upravovali. Väčšina API bola konvertovaná do jediného Windows Universal SDK. Nájdete ho v zozname referencií vášho projektu.

No niekedy budete nútení písať kód, ktorý beží na iba v rámci špecifickej rodiny zariadení, napríklad na smartfónoch. Typický prípad je obsluha pravého tlačidla pod displejom (hardvérového alebo virtuálneho, zobrazeného na displeji) s významom Takéto tlačidlo je k dispozícii len na platforme Windows 10 mobile. Na desktopoch a tabletoch by ste ho hľadali márne. Najskôr musíte pridať referenciu. Otvorte dialógové okno Reference Manager a vyberte buď Microsoft Desktop Extension SDK for Universal App Platform, alebo Microsoft Mobile Extension SDK for Universal App Platform.

Vyvoj10_4.jpg

Aktivovanie Microsoft Desktop a/alebo Mobile Extension SDK

Tlačidlo sa bude obsluhovať ako udalosť Windows.Phone.UI.Input.HardwareButtons.BackPressed. Kód sa skompiluje, pretože váš projekt obsahuje odkaz na Microsoft Mobile Extension SDK. Čo sa však stane, ak používateľ spustí túto aplikáciu na PC alebo tablete? Aplikácia jednoducho zhavaruje. Na riešenie tohto problému použite metódu Windows.Foundation.Metadata.ApiInformation.IsTypePresent, pomocou ktorej aplikácia zistí, či práve beží na zariadení, ktoré má k dispozícii objekt typu Windows.Phone.UI.Input.HardwareButtons. Ak áno, potom aplikácia beží na mobilnom zariadení a príslušný kód sa vykoná.

if (Windows.Foundation.Metadata.ApiInformation.IsTypePresent
("Windows.Phone.UI.Input.HardwareButtons")) Windows.Phone.UI.Input.HardwareButtons.BackPressed
+= HardwareButtons_BackPressed;

Aplikačný manifest

V aplikačnom manifeste (súbor Package.appxmanifest ) sú informácie potrebné na zostavenie aplikácie UWP, aby ju bolo možné distribuovať cez pre obchod Windows. Manifest je fyzicky dokument XML, no údaje v ňom budete vo väčšine prípadov editovať pomocou vizuálneho nástroja. Vo verzii Visual Studio 2015 RC tento nástroj ešte nebol implementovaný. Na ilustráciu uvádzame fragment aplikačného manifestu:

<Properties>
<DisplayName>PcRevue3</DisplayName>
<PublisherDisplayName>llack</PublisherDisplayName>
<Logo>Assets\StoreLogo.png</Logo>
</Properties>
<Dependencies>
<TargetDeviceFamily Name="Windows.Universal" MinVersion="10.0.10069.0" MaxVersionTested="10.0.10069.0" />
</Dependencies>
<Resources>
<Resource Language="x-generate"/>
</Resources>
<Applications>
<Application Id="App"
Executable="$targetnametoken$.exe"
EntryPoint="PcRevue3.App">
<uap:VisualElements
DisplayName="PcRevue3"
Square150x150Logo="Assets\Logo.png"
Square44x44Logo="Assets\SmallLogo.png"
Description="PcRevue3"
BackgroundColor="#464646">
<uap:SplashScreen Image="Assets\SplashScreen.png" />
</uap:VisualElements>
</Application>
</Applications>
<Capabilities>
<Capability Name="internetClient" />
</Capabilities>

Pozornosť venujte aj položke Capabilities, obsahujúcej zoznam funkcionalít, ktoré môže aplikácia využívať. Implicitne pri vytváraní projektu je označená voľba Internet, čo v praxi znamená, že aplikácia môže využívať údaje z webu. Niektoré funkcie, deklarované v tejto zložke, ktoré by mohli zasiahnuť do súkromia používateľa, ako sú napríklad lokalizačné služby, mikrofón či kamera, sa odblokujú až po súhlase používateľa.

Zatiaľ sa uspokojíme iba so základnou mierkou 100 %, takže budeme potrebovať tieto obrázky:

- Úvodná obrazovka: SplashScreen.scale-100.png ( 620 × 300 pixelov)
- Stredná štvorcová dlaždica: Logo.scale-100.png (150 × 150 pixelov)
- Malá štvorcová dlaždica: SmallLogo.scale-100.png (30 × 30 pixelov)
- Obdĺžniková dlaždica: WideLogo310x150.scale-100.png
- Logo pre obchod: StoreLogo.scale-100.png (50 × 50 pixelov)

Fyzicky sú obrázky umiestnené v zložke projektu Assets.

Životný cyklus aplikácie UWP

Aplikácia UWP môže byť v jednom z troch stavov, úmyselne ich uvádzame v originálnej terminológii:

• Running
• Suspended
• NotRunning

Prechody medzi stavmi názorne ukazuje diagram na obrázku.

Vyvoj10_7.jpg

Životný cyklus aplikácie UWP

V prvej fáze spúšťania aplikácie počas zobrazenia úvodnej obrazovky sa inicializujú hlavné úlohy, ktoré tvoria aplikáciu. Úvodná obrazovka by mala byť zobrazená na čo najkratší čas, nevyhnutne potrebný na inicializáciu aplikácie. V prípade aplikácie, ktorá potrebuje dáta zo siete alebo veľké množstvo dát z disku, mali by byť tieto činnosti realizované mimo aktivácie, napríklad postupne na pozadí používateľského rozhrania.

Keď používateľ presunie aplikáciu na pozadie alebo zariadenie, na ktorom aplikácia beží, prejde do úsporného stavu, aplikácia sa sama pozastaví. Prejde do stavu Suspended. Medzi stavom Running a Suspended nastane prechodový stav, keď je aplikácia už na pozadí, no Windows ešte 10 sekúnd čaká, aby sa ubezpečil, že používateľ nechce prejsť späť do aplikácie. Stáva sa to pri prepínaní medzi aplikáciami a je určitá pravdepodobnosť, že používateľ sa z iného programu, prípadne domovskej obrazovky prepne znovu na vašu aplikáciu. V tejto fáze je aplikácia na pozadí systémom vnímaná ako bežiaca, nedochádza k jej pozastaveniu a po prepnutí je nábeh okamžitý.

Po uplynutí tohto časového intervalu systém automaticky presunie aplikáciu do úsporného režimu. Aplikácia v stave Suspended je síce zavedená v pamäti, no v tomto stave nemôže vykonávať žiadnu činnosť. Počas prechodu môže aplikácia napríklad uložiť neuložené dáta do úložného zariadenia. Na toto uloženie dát má maximálne 5 sekúnd.

Podľa toho, koľko pamäťovej kapacity má systém k dispozícii, snaží sa udržať pozastavené aplikácie v pamäti, čím zabezpečí, že používateľ môže rýchlo prejsť späť do aplikácie. Aplikáciu možno ukončiť pomocou ikony X v pravom hornom rohu jej okna. Aplikácia má k dispozícii udalosť Suspending, ktorá je generovaná tesne pred tým, ako je prerušená. V obsluhe udalosti treba uložiť všetky údaje, s ktorými aplikácia aktuálne pracuje.

Spomínaných 5 sekúnd, ktoré má aplikácia k dispozícii na uloženie údajov, nemusí stačiť na uloženie veľkého množstva údajov. Správne navrhnutá aplikácia by mala údaje ukladať nepretržite počas behu aplikácie, najlepšie vtedy, keď dochádza k ich zmene, a v obsluhe udalosti OnSuspending uloží len aktuálny stav používateľského rozhrania. O tom, že 5 sekúnd na prechod do stavu Suspended uplynulo, sa aplikácia už nedozvie a nemá žiadnu možnosť, ako tento čas predĺžiť a nedokáže ani prechodu do stavu Suspended nijako zabrániť. Ak aplikácia spracúva údaje aj po uplynutí tohto časového intervalu, operačný systém sa domnieva, že aplikácia prestala reagovať, a explicitne ju ukončí.

 

Zobrazit Galériu

Nechajte si posielať prehľad najdôležitejších správ emailom

Mohlo by Vás zaujímať

Ako na to

Tipy a triky: Ako na snímku obrazovky na akomkoľvek počítači s Windows?

02.12.2016 00:13

Ak snímky obrazovky robíte často apotrebujete napríklad funkcie na posun stránok alebo snímanie zobrazenia pri vyššom rozlíšení displeja, zrejme používate nejakú špecializovanú aplikáciu. Väčšina použ ...

Ako na to 1

Tipy a triky: Ako aplikácii prednastaviť spúšťanie s administrátorskými právami?

30.11.2016 00:10

Väčšina aspoň trochu skúsenejších používateľov vie, že aj keď máte na operačnom systéme Windows vytvorený administrátorský účet, aplikácie pre bezpečnosť nefungujú vždy splnými administrátorskými práv ...

Ako na to 2

Tipy a triky: Ako vypnúť uzamykaciu obrazovku vo Windows 10?

29.11.2016 00:10

Rozčuľuje vás, že pred každým prihlásením doúčtu vášho počítača musíte prejsť uzamykacou obrazovkou? Windows 10 na tejto obrazovke ukazuje čas,dátum anejakú zaujímavú fotografiu zrôznych kútov sveta. ...

Žiadne komentáre

Vyhľadávanie

Kyocera - prve-zariadenia-formatu-a4-s-vykonom-a3

Najnovšie videá