CineStar Černý Most Praha

Transkript

1 CineStar Černý Most Praha

2 Stejná aplikace na více zařízeních Michael Juřek Microsoft s.r.o.

3 Potřebné ingredience 1. Portable libraries 2. Návrhový vzor MVVM 3. XAML 4. Abstrakce platformy

4 Použití kódu ve více aplikacích Stejný kód je často žádoucí využít na více platformách:.net framework desktop.net framework serverová aplikace Windows Phone Windows 8 (Windows Store) Silverlight XBOX VS do verze 2010 nenabízel dobrou podporu Možnost linkování souborů do projektu křehké, nepříliš praktické

5 VS 2012 portable library (PL) DLL knihovna pro více platforem Jeden projekt, jeden zdrojový kód, jeden kompilační výstup Každá platforma obsahuje různou sadu technologií PL mohou obsahovat pouze společný průnik technologií vybraných podporovaných platforem Mohou referencovat pouze jiné PL, které podporují stejné platformy

6 Možné reference Knihovna 3 (platforma A) Knihovna 4 (platforma A) Knihovna 1 (PL) (podpora A) Knihovna 2 (PL) (podpora A, B) Všechny ostatní reference nejsou povoleny Knihovna 5 (platforma B) Knihovna 6 (platforma B)

7 Ukázka: Úkolovník Reference Reference

8 DEMO Založení projektů

9 Potřebné ingredience 1. Portable libraries 2. Návrhový vzor MVVM 3. XAML 4. Abstrakce platformy

10 Co je MVVM? Model-View-ViewModel Návrhový vzor z rodiny MV* (MVC, MVP,...) Čistě odděluje jednotlivé vrstvy aplikace (dobře udržovatelný): Vzhled UI (View) vizualizace stavu UI Stav a chování UI (ViewModel) Nižší vrstvy (Model) např. přístup k datům, volání back-endu, herní algoritmus,... Nabízí velmi dobrou testovatelnost: ViewModel je plně testovatelný bez uživatelského rozhraní View neobsahuje prakticky žádný kód k testování

11 Schéma MVVM View Jak zobrazit? Interakce s uživatelem ViewModel Co zobrazit? Řízení interakce Model Datové objekty Obchodní logika atd. Data binding Reference Specifická platforma Portable library

12 ViewModel Nejdůležitější součást návrhového vzoru Připravuje a zpřístupňuje své vlastnosti pro data binding Je to jeho primární úloha Nemá žádnou znalost View Je velmi dobře testovatelný Nezávisí na žádném vizuálním prvku Je samostatně instancovatelný Může být (a bývá) umístěno v oddělené knihovně od View

13 ViewModel prakticky Obaluje jeden nebo více objektů z nižších vrstev Implementuje INotifyPropertyChanged pro zpřístupněné vlastnosti Zpřístupněné objekty samy implementují INotifyPropertyChanged Zpřístupněné kolekce implementují INotifyCollectionChanged pro změny obsahu Nejjednodušší je použít ObservableCollection<T> Operace na datech se provádí prostřednictvím příkazů zpřístupňujících ICommand Definují vlastní akci a kdy je možné ji provést Může též zpřístupňovat události, které pak slouží k navigaci v UI

14 Ukázka: Úkolovník Reference Reference

15 DEMO Model a ViewModel

16 Potřebné ingredience 1. Portable libraries 2. Návrhový vzor MVVM 3. XAML 4. Abstrakce platformy

17 XAML je všude Moderní deklarativní popis uživatelského rozhraní Propracovaný a jednoduchý data binding XAML je na všech typech zařízení a aplikací WPF na desktopu Windows 8 dotykové aplikace Windows Phone (Silverlight v prohlížeči)??? XBOX???

18 Stejný XAML všude? Bohužel NE: Různé formáty zařízení, styly práce a navigace Různé sady standardních ovládacích prvků Různá sada schopností implementace Na druhou stranu ovšem: Používáte stejné postupy a znalosti Velké části kódu lze přenášet kopírováním

19 XAML = View Prakticky vše by měl řešit data binding na ViewModel ViewModel je přiřazený jako DataContext Věnujte pozornost atributům: Mode, Converter, UpdateSourceTrigger,... (ne všechny na všech platformách) V ideálním případě neobsahuje žádný code-behind Ale není to priorita, buďte pragmatičtí Naučte se používat třídy implementující IValueConverter Např. datum splatnosti -> barva

20 Ukázka: Úkolovník Reference Reference

21 DEMO XAML pro View

22 Potřebné ingredience 1. Portable libraries 2. Návrhový vzor MVVM 3. XAML 4. Abstrakce platformy

23 Abstrakce platformy Typická aplikace potřebuje využívat řadu systémových služeb: Kryptografie, síťová komunikace, uložení nastavení, notifikace, autentizace,... Implementace těchto funkcí je na různých platformách různá Různé mechanismy, třídy, signatury metod, knihovny Řešením je abstrakce platformy

24 Princip Ve sdíleném kódu se definují rozhraní/abstraktní třídy pro jednotlivé systémové služby Sdílený kód je závislý na těchto definicích Každá platforma definuje svoje konkrétní implementace těchto rozhraní/abstraktních tříd Při startu aplikace jsou konkrétní implementace předány sdílenému kódu, který je pak volá

25 Příklad realizace Sdílený kód: Definice rozhraní IStorage, INotification Statická třída Platform obsahující: vlastnost Storage typu IStorage vlastnost Notification typu INotification Kód používá služby platformy (např. Platform.Storage.Save(...)) Kód každé platformy: Implementuje konkrétní třídy Storage, Notification Při startu jejich instance přiřadí vlastnostem třídy Platform

26 Ukázka: Úkolovník Reference Reference

27 DEMO Abstrakce platformy

28 Závěrem Aplikaci lze napsat pro více platforem tak, aby většina kódu byla sdílená napříč platformami Potřebné ingredience: Portable libraries Návrhový vzor MVVM XAML Abstrakce platformy