129 26 18MB
Polish Pages [256] Year 2013
Odnieś
sukces na platformie Windows 8!
Windows® 8 Tworzenie aplikacj z użyciem C# i XAM L
Jeremy L1ikness I
Know how.
Tytuł oryginału: Building Windows 8 Apps with C# and XAML Tłumaczenie: Paweł Gonera ISBN: 978-83-246-7062-8 Authorized translation from the English language edition, entitled: BUILDING WINDOWS 8 APPS WITH C# AND XAML; ISBN 0321822161; by Jeremy Likness; published by Pearson Education, Inc, publishing as Addison Wesley. Copyright© 2013 Pearson Education, Inc. All rights reserved. No part of this book may by reproduced or transmitted in any form or by any means, electronic or mechanical, including photocopying, recording or by any information storage retrieval system, without permission from Pearson Education, Inc. Polish language edition published by HELION S.A. Copyright© 2013. The .NET logo is either a registered trademark or trademark of Microsoft Corporation in the United States and/or other countries and is used under license from Microsoft. Microsoft, Windows, Visual Basic, Visual C#, and Visual C++ are either registered trademarks or trademarks of Microsoft Corporation in the U.S.A. and/or other countries/regions. Wszelkie prawa zastrzeżone. Nieautoryzowane rozpowszechnianie całości lub fragmentu niniejszej publikacji w jakiejkolwiek postaci jest zabronione. Wykonywanie kopii metodą kserograficzną, fotograficzną, a także kopiowanie książki na nośniku filmowym, magnetycznym lub innym powoduje naruszenie praw autorskich niniejszej publikacji. Wszystkie znaki występujące w tekście są zastrzeżonymi znakami firmowymi bądź towarowymi ich właścicieli. Autor oraz Wydawnictwo HELION dołożyli wszelkich starań, by zawarte w tej książce informacje były kompletne i rzetelne. Nie biorą jednak żadnej odpowiedzialności ani za ich wykorzystanie, ani za związane z tym ewentualne naruszenie praw patentowych lub autorskich. Autor oraz Wydawnictwo HELION nie ponoszą również żadnej odpowiedzialności za ewentualne szkody wynikłe z wykorzystania informacji zawartych w książce. Wydawnictwo HELION ul. Kościuszki le, 44-100 GLIWICE tel. 32 231 22 19, 32 230 98 63 e-mail: [email protected] WWW: http://helion.pl (księgarnia internetowa, katalog książek) Drogi Czytelniku! Jeżeli chcesz ocenić tę książkę, zajrzyj pod adres
http://helion.pl/ userlopinie/w8twap_ebook Możesz tam wpisać swoje uwagi, spostrzeżenia, recenzję. Printed in Poland.
Poleć książkę na Facebook.com
•
Księgarnia internetowa
•
Kup w wersji papierowej
•
Lubię to!» Nasza społeczność
•
Oceń książkę
•
Dla Ma. Twoje wsparcie zawsze było dla mnie błogosławieństwem. Z radością informuję, że skończyłem tę książkę razem z Tobą .
•
Spis treści
Słowo wstępne
9
Wprowadzenie
11
Podziękowania
15
O autorze 1
17
Nowe środowisko uruchomieniowe Windows Spojrzenie wstecz - Win32 oraz .NET Spojrzenie w przód - rozwój NUI
19
24
Wprowadzenie do aplikacji Windows Store Projekt Windows 8
28
Szybkość i płynność
28
26
28
Przyciąganie i skalowanie
28
Użycie właściwego kontraktu
29
Duże kafelki
30
Żywy i podłączony
Zgodność z zasadami projektowania Windows 8
Niezbędne narzędzia dla Windows 8 Blend dla Visual Studio HTMLS wraz z JavaScript
32 32
34
C++ wraz z XAML
35
VB/C# orazXAML
Wewnątrz WinRT
35
WPF, Silverlight oraz niebieski stos Podsumowanie
37
Cytowane prace
2
Zaczynamy
37
39
Konfigurowanie środowiska Windows 8
39
Visual Studio 2012 Blend
44
31
43
39
36
31
19
6
Spis treści
Witaj, Windows 8
44
Tworzenie pierwszej aplikacji Windows 8
Aplikacja ImageHelper
47
56
Pod maską
Podsumowanie 3
44
44
Szablony
60
Język XAML (Extensible Application Markup Language) Deklarowanie interfejsu użytkownika 63
Drzewo wizualne Właściwości zależne
65
67
Właściwości dołączane
Wiązanie danych
69 72
Konwertery wartości
Serie ujęć
74
Style i zasoby Układ
61
76
78 78
Element Canvas Element Grid
79
81
Element StackPanel
Elementy VirtualizingPanel oraz VirtualizingStackPanel Element WrapGrid
82
Element VariableSizedWrapGrid
85
Element ContentControl
86
Element ItemsControl
86
Element ScrollViewer
86
Element ViewBox
88
Element GridView Element ListView
91
Element FlipView
92
Wspólne kontrolki
92
Podsumowanie 4
91
Element ListBox
92
Aplikacje Windows 8 Układy i widoki Symulator
95
95 95
98
Visual State Manager
Semantyczne powiększanie
Obsługa zdarzeń użytkownika Zdarzenia wskaźników
103
Zdarzenia manipulacji
105
106
Obsługa myszy
107
Obsługa klawiatury Efekty wizualne Celowanie
11O
Menu kontekstowe
Pasek aplikacji
108
112
111
101 103
83
81
61
Spis treści
Ikony i ekrany powitalne Strona informacyjna Czujniki
117
117
119 120
Przyspieszeniomierz 121
Kompas
121
Geolokalizacja 122
Żyroskop
122
Inklinometr
123
Czujnik światła
123
Czujnik orientacji Podsumowanie 5
124
Cykl życia aplikacji
127
Zarządzanie czasem życia procesu 131
Wstrzymanie
133
Zakończenie działania 133
Wznowienie
134
Nawigacja
137
API Application Data
Żywy i podłączony
140
Własny ekran startowy Podsumowanie 6
Dane
129
130
Aktywacja
140
141
143
Ustawienia aplikacji
143
Odczyt i zapis danych
144 148
Potrzeba szybkości i wielowątkowości 150
Użycie async i await
152
Wyrażenia lambda
152
Metody pomocnicze IO 153
Osadzone zasoby Kolekcje
155
Zapytania zintegrowane z językiem (LINQ) Zawartość WWW
15 7
Udostępniana zawartość
159
Strumienie, bufory i tablice bajtów Kompresja danych
Szyfrowanie i podpisywanie danych Usługi sieciowe
164 167
Obsługa OData Podsumowanie 7
168
Kafelki i powiadomienia 169
Proste kafelki Kafelki aktywne Wskaźniki
170
174
Kafelki podrzędne
160
160
176
169
162
156
7
8
Spis treści
179
Powiadomienia wyskakujące
183
Usługa Windows Notification Service 189
Podsumowanie 8
Tworzenie paneli w aplikacji Wyszukiwanie
192
Udostępnianie
200
191
200
Źródło treści do udostępniania
205
Pobieranie treści przy pracy jako cel udostępniania
Ustawienia
209 212
Podsumowanie 9
MVVM i testowanie
213
Wzorce projektowania interfejsu użytkownika Model
217
Widok
218
214
219
Model widoku
Przenośna biblioteka klas
220
223
Dlaczego testujemy?
223
Testowanie eliminuje założenia Testowanie usuwa błędy u źródła
224
Testowanie pomaga dokumentować kod
224
Testowanie ułatwia rozszerzanie i utrzymywanie aplikacji Testowanie poprawia architekturę i projekt
225
Testowanie pozwala rozwijać się programistom Konkluzja - pisz testy jednostkowe!
226
Testy jednostkowe
Platforma testów jednostkowych Windows Stare
230
Imitacje i zręby
232
Podsumowanie 1O
Pakiety i instalacja Sklep Windows
233
233 233
Wyszukiwanie Zasięg
235 237
Modele biznesowe Reklamy
240
Przygotowanie aplikacji do sklepu Proces
242
Użycie App Certification Kit Czego możesz się spodziewać?
245
Ładowanie boczne Podsumowanie
Skorowidz
226
226
247 249
242 245
241
227
225
Słowo wstępne
ŻYCIE PROGRAMISTY NIE JEST ŁATWE. Mniej więcej co roku musi on porzucić wszystko, czego się nauczył, i zacząć od początku. Czasy się zmieniają, a technologie zmieniają się jeszcze szybciej. Dekadę temu programiści musieli przejść z Win32 na .NET oraz C#. Teraz pojawiła się kolejna nowa platforma. Nazywa się Windows 8 i spowodowała znaczną zmianę w sposobie organizacji i wykonywania aplikacji Windows. Windows 8 jest zupełnie inny niż dotychczasowe Windows. W nowym modelu programowania po łożono nacisk przede wszystkim na prostotę, bezpieczeństwo i efektywność korzystania z baterii. Nowo czesne aplikacje Windows działają na pełnym ekranie, korzystają z jednej instancji i używana jest jedna aplikacja jednocześnie. Ich Ul jest zbudowane z zastosowaniem XAML, HTML lub DirectX. Działają one w piaskownicy (izolowanym obszarze systemu), dzięki czemu nie pozwalają na wykonywanie złośliwego kodu, a dodatkowo są kontrolowane przed publikacją w Sklepie Windows, aby było pewne, że nie naru szają przyjętych zasad. W aplikacjach tych jest preferowany interfejs dotykowy, ale działają one równie dobrze, gdy użytkownik korzysta z myszy lub innych urządzeń wejściowych. Dodatkowo instalują się po jednym kliknięciu i odinstalowują się bez pozostawiania śladów. Pod nowym interfejsem użytkownika ukryte jest nowe API, Windows Runtime API, znane lepiej pod nazwą WinRT. WinRT reprezentuje zmianę myślenia o API Windows, które zostało całkowicie przebu dowane. Stare API Windows jest nadmiernie skomplikowane i związane z określonym językiem. Z kolei API WinRT jest nowoczesne i może być wykorzystywane w różnych językach. Jednym z najważniejszych aspektów Windows 8 jest to, że po raz pierwszy w historii programiści korzystający z HTML i JavaScript mają takie same możliwości budowania aplikacji Windows jak programiści korzystający z XAML i C#. Co to znaczy dla programistów? Zgadłeś - czas zacząć wszystko od nowa. WinRT jest obecnie API Windows, a nowa warstwa Ul, nazywana wcześniej „Metro", to nowa twarz aplikacji Windows. Przysto suj się albo usuń się z drogi. Aby stać się programistą Windows 8, musisz nauczyć się WinRT. Oznacza to zaprzyjaźnienie się z pro gramowaniem asynchronicznym. Musisz zapamiętać, że aplikacja Windows, która nie jest widoczna, jest zatrzymana, a zatrzymana aplikacja może być bezceremonialnie wyłączona przez system operacyjny w dowolnym momencie. Musisz dowiedzieć się, czym są kontrakty, które pozwalają aplikacjom na inte grację z panelami, które wysuwają się z prawej strony ekranu. Musisz zapoznać się z dynamicznymi ka felkami, powiadomieniami wypychanymi i innymi funkcjami, dzięki którym aplikacja staje się ważnym elementem środowiska Windows 8. Musisz zrozumieć filozofię projektowania dla Windows 8 oraz na uczyć się używać XAML do tworzenia atrakcyjnych, płynnych i szybko reagujących aplikacji Windows.
1O
Słowo wstępne
Gdy zaczniesz tę podróż, warto skorzystać z usług przewodnika, który był tu wcześniej. Nie znam nikogo lepszego niż Jeremy Likeness, kto może wprowadzić Cię w świat Windows 8. Jeremy jest jedyną osobą, jaką znam, która pracuje 32 godziny na dobę (śpi przez pozostałe cztery). Lubiłem mawiać, że pra cuję z ludźmi mądrzejszymi ode mnie, i zaznaczać przy tym, że żaden z nich jednak nie pracuje więcej ode mnie. Musiałem to zmienić po rozpoczęciu współpracy z Jeremym. Wyślij mu wiadomość o 3.00, a dostaniesz odpowiedź o 3.02. Dlatego właśnie jest głównym konsultantem w Wintellect i dlatego obar czyliśmy go odpowiedzialnością za architekturę i implementację rozwiązań Windows 8 dla naszych klientów. Nauczyciel może być efektywny wyłącznie wtedy, gdy opiera się na własnych doświadczeniach. Jeremy buduje rzeczywiste aplikacje dla rzeczywistych klientów. Dlatego z całego serca mogę polecić tę książkę i z niecierpliwością czekam, jak zostanie przyjęta przez środowisko. Windows 8 jest odważnym ruchem ze strony Microsoftu - prawdopodobnie najodważniejszym, ja ki wykonała ta firma od wprowadzenia Windows. Ale był to właściwy ruch we właściwym momencie. W następnych dziesięciu latach oprogramowanie nie będzie działało tylko na tradycyjnych komputerach PC. Będziemy pisać aplikacje na tablety, telefony i inne urządzenia mobilne. Dzięki tworzeniu aplikacji na urządzenia przenośne, takie jak Microsoft Surface, powstaną nowe firmy i nowe grono milionerów. Zignorowanie WinRT oznacza porzucenie tej części technologii Microsoftu, która pozwala pisać aplika cje na te urządzenia. Naucz się WinRT. Wymyśl i napisz kilka świetnych aplikacji. Pomóż osiągnąć sukces tej platformie. Trzymaj tę książkę pod ręką. Gdy napotkasz problemy, będzie ona najlepszą pomocą, może poza natych miastową odpowiedzią na wiadomość o trzeciej nad ranem. Z perspektywy Jeremy' ego na pewno lepszą.
- Jeff Prosie, współzałożyciel Wintellect
Wprowadzenie
NA PIERWSZE INFORMACJE DOTYCZĄCE WINDOWS 8 można było się natknąć na początku roku 2011. W internecie pojawiły się spekulacje na temat działania nowej platformy. Według plotek platfor
ma miała nie obsługiwać .NET Framework, być zbudowana wyłącznie na bazie C++ lub HTMLS i Java Script oraz nie obsługiwać żadnego istniejącego oprogramowania. Wczesne wersje i zrzuty ekranu po jawiały się na witrynie Twitter, ale to tylko wzmagało spekulacje. W końcu 13 września 2011 roku na scenie stanął Steven Sinofsky, prezydent działu Windows w Microsofcie, i pokazał światu pierwsze wer sje Windows 8. Byłem jednym z pierwszych programistów, którzy pobrali to oprogramowanie i zainstalowali je na maszynie wirtualnej. Nie potrzebowałem dużo czasu, aby zorientować się, że .NET Framework miał się dobrze, i mogłem uruchomić na nowej platformie moje aplikacje Silverlight, natomiast do budowania nowych aplikacji „w stylu Metro" (nazwa ta została w wersji RTM zmieniona na Windows Stare) wy korzystywany był język C# oraz XAML. Nie udało mi się być na konferencji BUILD w Kalifornii, gdzie przedstawiono finalną wersję Windows 8, ale jej sesje były udostępniane niemal natychmiast po ich za prezentowaniu, więc mogłem je oglądać każdego ranka, wieczora i w czasie podróży samolotem. Platforma Windows 8 korzysta z Windows Runtime, nowej biblioteki budowania aplikacji, która za pewnia możliwości, jakie nie były jeszcze nigdy dostępne na komputerach Windows. Zbudowanie apli kacji zajęło mi kilka dni, ponieważ z radością zauważyłem, że moja znajomość C# oraz XAML, którą zdobyłem w czasie poznawania Silverlight i Windows Presentation Foundation (WPF), przeniosła się na nową bibliotekę, a nowy zestaw komponentów bardzo łatwo pozwalał budować złożone aplikacje ob sługiwane dotykiem. Krótko potem skontaktowałem się z wydawcą mojej książki Designing Silverlight Business Applications i powiedziałem: „Chcę napisać następną książkę o Windows 8". Miałem szczęście brać udział w programie wczesnych testów, prowadzonym przez Microsoft. Firma konsultingowa i szkoleniowa, w której pracuję, Wintellect, została zatrudniona do wykonania kilku la boratoriów i warsztatów przeznaczonych dla nowych programistów, którzy chcieli budować aplikacje dla Windows 8. Dało mi to dostęp do wczesnych wersji produktów i pozwoliło zacząć pisanie o różnych funkcjach, które stały się częścią ostatecznej wersji. Gdy budowałem przykłady przedstawiające mani pulację obiektami z wykorzystaniem dotyku, udostępnianie treści pomiędzy aplikacjami oraz tworzenie interaktywnych kafelków na ekranie startowym, byłem coraz bardziej podekscytowany. W czasie pracy nad książką napisałem artykuł prezentujący 10 najważniejszych powodów, dla których programiści będą uwielbiali aplikacje Windows 8. Artykuł ten można przeczytać pod adresem http:!! www. informit. com! articles! article. aspx?p= 1853667.
12
Wprowadzenie
Krótko rzecz ujmując, uważam, że będziesz zadowolony z następujących elementów nowej platformy: •
Obsługa języków programowania - możliwe jest pisanie aplikacji Windows 8 za pomocą VB, C#, C++ iXAML lub specjalnego stosu obsługującego HTMLS i JavaScript.
•
XAML- programiści znający możliwości i elastyczność XAML, którzy pisali w przeszłości aplikacje Silverlight lub WPF, będą czuli się komfortowo, korzystając zXAML do tworzenia aplikacji Windows 8.
•
HTMLS
-
obsługa HTMLS jest kusząca dla programistów WWW zwróconych w stronę
programowania na tablety i urządzenia dotykowe, choć w tej książce zajmuję się przede wszystkim C# iXAML. •
Windows Runtime (WinRT)
-
Windows Runtime zawiera wiele kontrolek, komponentów,
klas oraz metod pozwalających wykonywać złożone zadania przy wykorzystaniu ledwie kilku wierszy kodu. •
Kontrakty- nowy system kontraktów tworzy nowy poziom udostępniania i integracji pomiędzy aplikacjami oraz użytkownikiem końcowym.
•
Obsługa asynchroniczności
-
wprowadzenie słów kluczowych awai t oraz async znacznie
upraszcza tworzenie kodu wielowątkowego. •
Dotyk- aplikacje Windows 8 są przede wszystkim sterowane dotykiem, a wszystkie dostępne kontrolki mają wbudowaną obsługę dotyku oraz proste API pozwalające na programowanie zdarzeń dotyku i manipulacji.
•
Ustawienia- standardowe okno ustawień (realizowane poprzez kontrakt) zapewnia spójny
•
Profile mobilne
sposób konfiguracji preferencji aplikacji przez użytkownika. -
budowanie kodu synchronizującego komputery Windows 8 poprzez
chmurę jest obecnie łatwe (można w zasadzie udostępnić plik danych za pomocą jednego wiersza kodu). •
Ikony
-
Windows 8 zawiera bogaty zestaw ikon, które mogą być użyte do utworzenia
spójnego interfejsu poleceń w aplikacji. Aby uniknąć pomyłek, programy zbudowane specjalnie dla Windows 8 nazywam w tej książce „apli kacjami Windows 8". Szablony do tworzenia nowych aplikacji w Visual Studio 2012 są zgrupowane pod nazwą „Windows Stare". Choć te aplikacje mogą być dystrybuowane poprzez Sklep Windows, w sklepie tym można sprzedawać również tradycyjne aplikacje pulpitu. Dlatego będę używał nazwy „Windows Store" wyłącznie przy odwołaniach do szablonów Visual Studio 2012 lub przy porównywaniu nowego stylu aplikacji z tradycyjnymi aplikacjami pulpitu. W pozostałych przypadkach będę je nazywał „aplika cjami Windows 8". Wymienione wcześniej 10 cech to tylko niewielka część elementów systemu. Windows 8 różni się znacznie od poprzednich wersji Windows i wymaga, abyś się dostosował. Musisz zaadaptować nowy interfejs dotykowy, który jednak pozwala na nawigację z wykorzystaniem myszy lub klawiatury. Musisz przyzwyczaić się do tego, że wywołania natywnych, niezarządzanych komponentów są wykonywane w niemal przezroczysty sposób, oraz zapoznać się z nowymi kontrolkami i komponentami, które wcze śniej nie istniały. Książka ta ma za zadanie poprowadzić Cię przez proces szybkiego poznawania nowego terytorium, dzięki czemu będziesz mógł zacząć budować nowe, niesamowite aplikacje, korzystając z C# orazXAML.
Wprowadzenie
•
13
O czym jest ta książka? Zadaniem tej książki jest przedstawienie sposobu pisania aplikacji Windows 8 z zastosowaniem języków programowania C#, XAML (Extensible Application Markup Language), Windows Runtime oraz .NET Framework. Zakładam, że masz pewne doświadczenie w programowaniu. Opisując podstawowe tematy związane z C# oraz XAML, próbowałem skupić się na obszarach specyficznych dla budowania aplikacji Windows 8. Wprowadzając bardziej zaawansowane koncepcje, specyficzne dla C# lub XAML, które nie odnoszą się do platformy Windows 8, wskazuję książki, artykuły lub zasoby sieciowe, które dokładniej wyjaśniają podstawy. Niezależnie od tego, czy jesteś programistą Silverlight lub WPF mającym zamiar przenieść istniejące aplikacje lub programistą korzystającym po raz pierwszy z platformy Windows 8, książka ta zapewni Ci wskazówki i zasoby, dzięki którym będziesz mógł szybko zdobyć informacje potrzebne do rozpoczęcia nowego projektu i opublikowania aplikacji w Sklepie Windows.
Jak korzystać z tej książki? Celem tej książki jest nauczenie Cię pisania aplikacji Windows 8 z wykorzystaniem C# i XAML. Każdy rozdział ma za zadanie pomóc Ci w przejściu od zrozumienia podstaw docelowej platformy do zbudo wania pierwszej aplikacji. Zamieszczone przykłady kodu demonstrują funkcje oraz najlepsze praktyki programowania. Większość rozdziałów jest zbudowana na bazie wcześniejszych, dzięki czemu zapewnio na jest ciągłość opisu komponentów wchodzących w skład typowej aplikacji Windows 8. Każdy rozdział ma podobną strukturę. Zaczyna się od wprowadzenia do tematu, następnie przedsta wione są przykłady kodu oraz opis realizacji elementów aplikacji. Przykłady kodu są szczegółowo wyja śniane. Na końcu każdego rozdziału znajduje się podsumowanie uwypuklające najważniejsze informacje. Sugeruję, abyś przeczytał tę książkę od początku do końca. Zauważysz, że z każdym rozdziałem rozu miesz coraz więcej i że kolejno przedstawiane koncepcje łączą się w całość. Po przeczytaniu całej książki warto korzystać z niej jak z poradnika i odwoływać się do właściwych rozdziałów, gdy będziesz potrze bował wyjaśnienia określonego zagadnienia.
Moje doświadczenie z oprogramowaniem Microsoftu Swój pierwszy program komputerowy napisałem w języku BASIC na komputerze TI-99/4A. Następnie programowałem w asemblerze dla Commodore 64, nauczyłem się C i C++ na systemach uniksowych, a później napisałem oprogramowanie zarządzające łańcuchem dostaw dla komputera AS/400 (nazywa nego teraz iSeries). W ostatnich 20 latach skupiałem się na tworzeniu skalowalnych, współrzędnych apli kacji korporacyjnych. Pracę z Silverlight zacząłem bezpośrednio po wydaniu wersji 3.0. W tym czasie kierowałem zespołem 12 programistów pracujących nad platformą zarządzania urządzeniami mobilnymi, napisaną w ASP.NET i korzystającą intensywnie z AJAX w celu zapewnienia wysokiej wygody używania. Gdy zauważyłem, że zespół spędza coraz więcej czasu na uczeniu się technologii webowych, takich jak CSS i JavaScript, jak również testowaniu aplikacji na wielu przeglądarkach i platformach, zamiast skupić się na podstawowych korzyściach biznesowych, zacząłem badać możliwości użycia alternatywnych technologii i zauważyłem, że właściwym rozwiązaniem będzie Silverlight.
14
Wprowadzenie
Od momentu tej zmiany pracowałem nad aplikacjami XAML dla przedsiębiorstwa i jednocześnie nad dużymi aplikacjami WWW budowanymi z zastosowaniem biblioteki ASP.NET MVC. Oprócz tego, że tworzyłem oprogramowanie zarządzające urządzeniami mobilnymi w czasie olimpiady zimowej w 2010 roku, odbywającej się w Vancouver, pomagałem tworzyć system monitorowania stanu dla centrum da nych obsługującego strumienie wideo (na żywo oraz na żądanie). Pracowałem również nad projektem analitycznym dla dużej witryny społecznościowej, w którym korzystałem z Silverlight do prezentowa nia danych wydobywanych z sieci społecznościowej i analizowanych w celu badania sentymentu, jakim klienci darzą markę. Ponadto pracowałem w zespole budującym interfejs sprzedaży działający na table tach, przeznaczony dla agentów mobilnych oraz przy integracji tych urządzeń z centralnym systemem sprzedaży. Byłem członkiem zespołu, który wyprodukował wersję Silverlight jednej z większych platform pozwalających na czytanie e-booków; wersja ta zapewniała wysoką dostępność i funkcje interaktywne oraz dźwiękowe w książkach dla dzieci. Wszystkie te projekty były realizowane przez firmę Wintellect, założoną przez dobrze znanych lumi narzy .NET, Jeffreya Richtera, Jeffa Prosise'a oraz Johna Robbinsa. Ta trójka napisała całą półkę książek na temat technologii opracowanych w Microsofcie, .NET Framework i Core Language Runtime (CLR). Ci specjaliści wyszkolili tysiące pracowników Microsoftu (niektóre zespoły w Microsofcie muszą odbyć szkolenie przed rozpoczęciem pracy w projekcie) oraz sami napisali i zaprojektowali części bibliotek. Firma ta zapewniła mi unikalny dostęp do liderów i architektów, a także najlepsze praktyki i rozwiąza nia pozwalające na tworzenie udanych aplikacji korporacyjnych. Posiadam certyfikaty związane z różnymi technologiami XAML, w tym certyfikat programisty Micro soft Silverlight (MCTS) i WPF (MCP). Zostałem wyróżniony tytułem Microsoft Most Valuable Profes sional® (MVP) w zakresie programowania na platformę Silverlight w lipcu 2010 roku oraz ponownie w latach 2011 i 2012. Osiągnąłem to przede wszystkim dzięki artykułom na blogu, tweetom i wystąpie niom dotyczącym technologii XAML na spotkaniach grup użytkowników oraz konferencjach. Prowadzi łem warsztaty i szkolenia związane z Windows 8, pracowałem na najwcześniejszych wersjach platformy i kontynuowałem blogowanie na temat jej rozwoju. Dzięki doświadczeniu zdobytemu w czasie pracy z XAML oraz wiedzy na temat budowania oprogramowania serwerowego i WWW mogłem szybko roz począć tworzenie aplikacji Windows 8.
Podziękowania
Wiem już, że tego typu techniczna książka jest w zasadzie pisana przez zespół, choć na okładce pojawia się tylko nazwisko autora. Joan Murray po raz kolejny pomogła mi zakończyć tworzenie książki oraz za pewniła niezwykłe wsparcie w całym procesie. Pracuje ona w zadziwiającym zespole. Szczególne podzię kowania należą się Ellie Bru, redaktorce stojącej za każdym akapitem, rysunkiem, zadaniem i każdą zmia ną. Dziękuję Lori Lyons i Chrostel White za zapewnienie spójności zdań i korygowanie moich błędów gramatycznych, dzięki czemu prezentuję się jak ukształtowany autor. Jestem niezwykle wdzięczny moim współpracownikom w firmie Wintellect. Steve Porter oraz Todd Fine po raz kolejny pomogli mi pogodzić długie popołudniowe i poranne sesje pisania z codziennymi obowiązkami. Jeffrey Richter oraz Jeff Prosie przekazali mi dużą wiedzę popartą latami doświadczenia w pisaniu książek. Przykłady kodu Jeffreya oraz ćwiczenia Jeffa były nieocenionymi narzędziami pozwa lającymi mi nauczyć się nowej platformy; wyewoluowały z nich scenariusze przedstawione w tej książce. John Garland towarzyszył mi w uczeniu się nowej platformy i technologii; kolejny raz okazał się błysko tliwym redaktorem technicznym, który pomógł mi kształtować i organizować treść. Szczególne podziękowania należą się również firmie Telerik, od której otrzymałem wszechstronne wsparcie. Dziękuję Jesse'mu Liberty' emu za dołączenie mnie do jego podcastu, Chrisowi Sellsowi za po moc przy kodzie HTML i JavaScript oraz Michaelowi Crumpowi za wszechstronną pomoc przy książce i cenne uwagi dotyczące redakcji technicznej. Dziękuję członkom zespołu z Microsoftu, którzy pracowali ze mną w kolejnych iteracjach platfor my Windows 8, od Developer Preview, przez Consumer Preview, do Release Preview i dalej. Dziękuję Jaime'owi Rodriguezowi, Timowi Heuerowi, Joannie Mason, Jennifer Marsman i Laylii Driscoll za ich wiedzę i przemyślenia. Dziękuję Davidowi Keanowi za cierpliwe przedstawienie bibliotek kodu przeno śnego na konferencji MVP oraz jego późniejsze wsparcie. Przez cały czas pomagał mi Daniel Plaisted. Podziękowania nie będą kompletne, jeśli nie wymienię moich kolegów MVP oraz wszystkich, którzy aktywnie promowali i wspierali moją książkę w sieci. Davide Zordan, Shawn Wildermuth, Jeff Albrecht, Roberto Baccari, David J. Kelley, Zubair Ahmed i Ginny Caughey - dziękuję. Dziękuję również grupie Linked In .NET Users Group (LIDNUG), a szczególnie Peterowi Shawnowi i Brianowi H. Madsenowi za pomoc i umożliwienie mi dzielenia się moją ekscytacją Windows 8. Dziękuję Chrisowi Woodruffowi i Keithowi Elderowi.
16
Podziękowania
Dziękuję wszystkim za udostępnianie moich tweetów oraz wizyty na stronie Facebooka poświęconej tej książce. Dziękuję wszystkim Czytelnikom, którzy przedstawili opinie na temat książki, oraz Tobie, miły Czytelniku, za to, że jesteś! Na koniec dziękuję mojej superżonie i niezwykłej córce za zrozumienie, dlaczego Tata zamykał się w biurze we wczesne ranki i późną nocą. Nie mógłbym skończyć tej książki bez moich kobiet!
O autorze
Jeremy Likeness jest głównym konsultantem w Wintellect, LLC. Pracuje od ponad 20 lat nad aplikacja mi korporacyjnymi, a 15 lat nad aplikacjami WWW z użyciem oprogramowania Microsoftu. Jako jeden
z pierwszych użytkowników Silverlight 3.0 pracował nad niezliczonymi aplikacjami Silverlight, w tym nad monitoringiem serwerów działających w czasie olimpiady zimowej w 2010 roku w Vancouver oraz nad aplikacją Looking Glass służącą do monitorowania sieci społecznościowych Microsoftu. Jest zarów no konsultantem, jak i kierownikiem projektu w Wintellect i ściśle współpracuje z firmami z listy For tune 500, w tym z Microsoftem. Od trzech lat posiada tytuł Microsoft MVP; w roku 201O został MVP of the Year. Otrzymał również nagrodę Microsoft' s Community Contributor za propagowanie Silverlight. Jeremy jest również autorem książki Designing Silverlight Business Applications: Best Practices for Using Silverlight Effectively in the Enterprise (Addison-Wesley). Jeremy regularnie występuje na konferencjach,
pisze artykuły i bloguje na tematy interesujące środowisko programistów Microsoftu. Jego blog jest do stępny pod adresem http://csharperimage.jeremylikness.com!.
18
O autorze
1. Nowe środowisko uruchomieniowe Windows
W
INDOWS RUNTIME (WINRT) TO CAŁKOWICIE NOWE ŚRODOWISKO dla Windows, któ re zapewnia programistom API współpracujące z wieloma językami programowania, pozwalają
ce budować aplikacje dla Windows
8. Aplikacje Windows Store działają w trybie pełnoekranowym i są
przystosowane do specjalizowanych urządzeń, interakcji dotykowej oraz korzystają z nowego interfejsu użytkownika Windows 8. Aplikacje Windows Store są również nazywane aplikacjami
dopasowanymi,
ponieważ adaptują się do urządzenia docelowego. Możliwe jest także budowanie tradycyjnych aplikacji dla Windows
8. Termin „aplikacja Windows 8" w książce tej będzie oznaczał aplikację niedziałającą na
pulpicie Windows, zgodną z Windows Store i korzystającą z WinRT. Wprowadzenie WinRT jest jedną z największych zmian, jakie zaszły w paradygmatach programowania dla Windows od czasu wprowadze nia środowiska .NET pod koniec pierwszego dziesięciolecia XXI w. W tym rozdziale przedstawię wcześniejsze środowiska programowania dla Windows i pokażę, jak wzrost popularności naturalnych interfejsów użytkownika (NUI) spowodował powstanie w Microsofcie nowej platformy Windows
8. Omówię też aplikacje Windows 8 oraz różne języki programowania, za
pomocą których można pisać takie aplikacje. Przybliżę ponadto, jak istniejące już technologie korzysta jące z XAML, takie jak WPF czy Silverlight, wpisują się w nowe środowisko Windows.
Spojrzenie wstecz -Win32 oraz .NET „Mogę zmienić zdanie szybciej niż Bill Clinton". - Jay Leno na imprezie Windows W roku
95 Launch Party, mówiąc o nowym pasku zadań Windows
1985 bez większego rozgłosu została udostępniona pierwsza wersja Windows. Nie był to pełny
system operacyjny, a jedynie nakładka na tekstowy MS-DOS, nazywana MS-DOS Executive (rysunek
1.1). Dziesięć lat później wraz z Windows 95 wszystko dramatycznie się zmieniło. Bill Gates pojawił się na ogromnej scenie wraz z gospodarzem talk-show Jayem Leno i zademonstrował nowy, zaawansowany system operacyjny. System ten dostroił się szybko do promującego go utworu i pozostawił w tyle konkurentów, takich jak Apple.
Start Me Up Rolling Stones
Rozdział 1. Nowe środowisko uruchomieniowe Windows
20
Searcłl
Uiew
Show
AlarPI
e: ee AM 9 :ee 11.1: 90 11:08 12:0e PM 1:ee
Rysunek 1.1. MS-DOS Executive
Aby pisać programy dla Windows 95, pokazane na rysunku 1.2, programiści korzystali z interfejsu programowania aplikacji (API), który był opracowany kilka lat wcześniej i był znany jako Win32. W tym czasie Microsoft próbował zapewnić obsługę starszych systemów, 16-bitowych, oraz nowych, 32-bitowych, co było pokazane w nazwie API. Win32 działa do dziś (teraz jest nazywany Windows API) wewnątrz wszystkich systemów operacyjnych Windows, pomimo powstania nowych bibliotek i platform, które z niego korzystają. Gdy to API było wprowadzane, uznawano je za niezwykle zaawansowane i elastycz ne, ale wymagające od programisty korzystania z wielu operacji niskopoziomowych, pozwalających na wyświetlenie formularza i obsłużenie interakcji z użytkownikiem.
I�„. §\i;omputer EHE•611111il&IWlll••I � U:s:ingMicrosoftOutlook 113----- W Eeople
Rysunek 1.2. Windows 95
Poniższy kod programu pozwala na wyświetlenie tekstu „Witaj, świecie" przy użyciu języka progra mowania C++: #include int main()
Spojrzenie wstecz-Win32 oraz .NET
•.
21
cout vst m T o - "'-""' = = "" ""= '-------"""-= � = � Nam;:dzia systemowe (D:) Zdrowy (Partycja podstawowa) Prosty Podstawowy NTFS
�ł t> t> � t> �
IO
G Harmonogram zadań
a (H:)
� Podgląd zdarzeń
@
t3VerteJ
Description:
t>
Regis ter s theapp asa s hare tar g e t,w hi ch al lowstheapptorecev i e shareable conten t.
t>
On l yoneinstan ceof th i s dec a l r ation s i a llowed per app.
l'Properties
ii ii
Assets Common
,':) Ap p .x11m l
� l m11geHeJper _Tempor 11 ryKey.pD:
Supporte
ShareTar get
X
•
Prop-erties:
,':) M11in Page.x11m l
b
Padcagea . ppxm;mifest
Specifies th e data f o rmatss u pported by th eap p; for exampl e:"Text","UR l ","Bitmap"
'Storagel te ms",or " R TF". The app wil l be displ ayed in the Share c harm wheneverone of the supported dat a formatsi ssharedfrom anotherapp.
1�
D't' fo'm't'
B
using Windows.ApplicationHodel.DataTransfer;
•·•References
t> il Assets t> il Common t> .O App.J
Wygląd tego układu jest pokazany na rysunku 3.4.
Rysunek 3.4. Układ Canvas
Element Grid Element Gri d jest do tej pory najczęściej stosowanym i najbardziej zaawansowanym elementem układu. Jest to również domyślna kontrolka stosowana w szablonach Visual Studio. Element Gri d jest często po równywany z tabelą HTML, ponieważ pozwala na definiowanie wierszy i kolumn. System układu w XAML jest bardzo elastyczny. Możemy określać wielkość komórek za pomocą pikseli, punktów, bazować na automatycznym dopasowaniu do zawartości komórek lub proporcjach względem innych komórek. Mo żesz także osadzać kontrolki w innych kontrolkach. Częstą praktyką przy definiowaniu układu jest korzy stanie z automatycznej lub stałej wysokości bądź szerokości dla paska nawigacji czy wstążki, a następnie umożliwienie pozostałym komórkom na zajęcie reszty miejsca.
Rozdział 3. Język XAML (Extensible Application Markup Language)
80
Jedną z ważnych funkcji elementu Gri d jest dobre wsparcie dla układów płynnych. Ma on możliwość zmiany wielkości, aby wypełnić dostępne miejsce w kontenerze nadrzędnym, jak również może dosto sować się do zmian wielkości swojej zawartości. Możliwe są trzy sposoby definiowania wartości właści wości Gri dlength, która określa szerokość kolumny lub wysokość wiersza: •
z użyciem punktów,
•
za pomocą wartości Auto, która oznacza rozmiar bazujący na wymiarach elementów podrzędnych umieszczonych w komórce,
•
z wykorzystaniem gwiazdki, co reprezentuje część pozostałego dostępnego miejsca.
Notacja z użyciem gwiazdki jest prawdopodobnie najtrudniejsza do zrozumienia. Modyfikator gwiazd ki określa po prostu całe pozostałe miejsce. Symbol gwiazdki oznacza jedną jednostkę wielkości pozosta łego miejsca. Gdy podamy inną wartość, proporcje zostaną zmienione o tę wartość. W tabeli 3.3 przed stawiony jest sposób obliczania szerokości kolumn w siatce o szerokości dokładnie 400 pikseli. Tabela 3.3. Wymiary komórek określane za pomocą notacji z gwiazdką dla siatki o szerokości 400 pikseli Kolumna 1. *
Kolumna 2. *
133,33 * 200 1*
133,33
*
0,5*
100
100
133,334
Wyrażenie 1+1+1=3. Każda kolumna ma szerokość równą 1/3 z400.
133,34
0,5*
2*
66,666
Kolumna 3.
3*
1+0,5+0,5 2. Pierwsza kolumna ma szerokość równą 1/2 z400. Pozostałe kolumny mają szerokość równą 1/4 z400 =
0 ( ,5/2).
200
1+2+3=6. Pierwsza kolumna to 1/6 z400, druga 1/3, a trzecia 1/2. 2,5. Pierwsza kolumna zajmuje 1 OO pikseli, więc
100
0,5*
2*
0,5+2
100
60
240
pozostałe kolumny mają szerokość300.0,5/2,5 2/2,5 415 z300.
=
=
1/5 z300,
=
Sposób obsługi rozmieszczania i wymiarowania przez siatkę jest ważny, ponieważ wpływa na projek towanie własnych kontrolek. Na listingu 3.4 zamieszczony jest przykład użycia układu Gri d. Listing 3.4. XAML dla układu Grid
Układ
•.
81
Wygląd tego układu jest pokazany na rysunku 3.5.
Rysunek 3.5. Układ Grid
Element StackPanel Element StackPanel jest odmianą panelu, która ma możliwość układania elementów w stosy - albo po ziome, albo pionowe - w zależności od orientacji. Jest to dobry wybór, jeżeli nie musimy układać ele mentów w kolumny lub wiersze albo mamy dynamiczną listę elementów, które chcemy dodawać bez konieczności wcześniejszego obliczania wierszy i kolumn. Element StackPanel automatycznie wyliczy wysokość lub szerokość elementu, biorąc pod uwagę orientację urządzenia, a następnie umieści go po prawej stronie bądź pod poprzednią kontrolką. Problemem przy korzystaniu ze StackPanel jest udostępnianie przez ten element nieskończenie du żej przestrzeni w kierunku określonym przez orientację. Aby zobaczyć wszystkie elementy umieszczone w StackPanel, może zajść konieczność użycia Scroll Vi ewer do przewijania wirtualnego panelu. Jeżeli potrzebujesz kontrolki dostosowującej rozmiar do dostępnego miejsca, być może powinieneś użyć kon trolki WrapGri d, która będzie opisana w dalszej części rozdziału. Element StackPanel najlepiej sprawdza się dla małych list danych, które mieszczą się w dostępnej przestrzeni. Przykład zastosowania elementu StackPanel:
Wygląd tego układu jest pokazany na rysunku 3.6.
Elementy VirtualizingPanel oraz VirtualizingStackPanel Do obsługi dużych ilości danych wykorzystywany panel nazywany panelem
wirtualizujqcym.
Kontrolka
Li st Box korzysta z panelu wirtualizowanego jako domyślnego kontenera zawartości. Można to zmienić,
ale istnieje wiele powodów użycia tej kontrolki.
82
Rozdział 3. Język XAML (Extensible Application Markup Language)
Rysunek 3.6. Układ StackPanel
Zwykły panel stosu może przyjąć nieskończoną liczbę elementów, ponieważ zapewnia nieskończoną długość dla orientacji. Jeżeli dostarczysz 5 OOO elementów, panel stosu wygeneruje 5 OOO elementów, na wet jeżeli na ekranie zmieści się tylko 10. Jasne jest, że w przypadku obsługi dużych zbiorów danych po woduje to wprowadzenie znacznych opóźnień. Panel wirtualizujący oblicza wymagany rozmiar dla podzbioru danych, który można wyświetlić na ekranie. Jeżeli mieści się tylko dziesięć elementów, panel wirtualizujący utworzy dziesięć kontrolek. Gdy użytkownik przewija listę, zachowywana jest taka sama liczba kontrolek, a wymieniane są wyłącznie da ne. Więcej informacji na temat działania szablonów danych przedstawię w następnym rozdziale. Wadą użycia panelu wirtualizowanego jest brak płynnego przewijania. W przykładzie dla silnika układu generowane są dwie listy, z których jedna jest modyfikowana, aby korzystała z bazowego panelu stosu. Zauważysz, że bazowy panel stosu pozwala na płynne przewijanie - możesz przewinąć ekran pal cem o kilka pikseli i pokazać tylko część kontrolki znajdującej się poza górną lub dolną krawędzią okna przewijania. W przypadku wirtualizowanego panelu stosu można przewijać tylko o jeden element naraz - nie jest dostępne częściowe przewijanie, ponieważ wyłącznie cały element jest dodawany do wido ku lub z niego usuwany. Jest to wybór pomiędzy obsługą dużej ilości danych bez obniżania wydajności a zapewnianiem płynnego działania interfejsu użytkownika. Możesz również napisać własną kontrol kę, która łączy zalety obu typów, co jest realizowane przez wielu producentów i udostępniane w postaci zbioru kontrolek.
Element WrapGrid Kontrolka ta jest specjalną odmianą siatki, która automatycznie obsługuje wiersze i kolumny na podsta wie przekazanych do niej danych. W przeciwieństwie do kontrolki Gri d, która wymaga określenia wier sza i kolumny, WrapGri d realizuje to za nas. Pozycjonuje ona elementy podrzędne sekwencyjnie od lewej do prawej lub z góry na dół, w zależności od orientacji, a następnie tworzy kolejny wiersz lub kolumnę. Jest to zaawansowana kontrolka, którą zaprezentowałem w przykładzie aplikacji Panels z tego roz działu. Można umieścić w niej dane w taki sposób, że zajmą całe dostępne miejsce, zajmując tyle wierszy i kolumn, ile będzie potrzebnych. W razie potrzeby użytkownik może przesunąć widok, aby zobaczyć
Układ
•.
83
więcej elementów. Pozwala nam to uwolnić się od konieczności obliczania wolnego miejsca, gdy siatka dostosuje się do bieżącej rozdzielczości. Kontrolka WrapGri d jest zawsze definiowana przez szablon dla kontrolki listy, jak jest to pokazane na listingu 3.5. Listing 3.5. XAML dla układu WrapGrid
Wygląd tego układu jest pokazany na rysunku 3.7.
Rysunek 3.7. Układ WrapGrid
Element VariableSizedWrapGrid Menu Start w Windows 8 jest doskonałym przykładem możliwości kontrolki Vari abl eSi zedWrapGri d. Mo żesz zauważyć, że niektóre kafelki są większe niż inne, więc elementy zajmują w siatce różną ilość miejsca. Jest to częste, gdy chcesz wyświetlić w siatce różne typy elementów, o różnych orientacjach i wymiarach.
84
Rozdział 3. Język XAML (Extensible Application Markup Language)
Istnieją dwa sposoby określenia liczby elementów w siatce. Pierwszym jest użycie właściwości dołą czanych Vari ab l eSi zedWrapGri d. Col umnSpan oraz Vari ab l eSi zedWrapGri d. RowSpan w elementach pod rzędnych. Pozwala to poinformować bazową siatkę o liczbie komórek wymaganych dla elementu. Jeżeli wiążesz element z listą elementów, będziesz potrzebował wykonać klasę dziedziczącą po obiek cie bazowym (zazwyczaj Gri dVi ew) i nadpisać jej metodę PrepareContai nerForitemsOverri de. Więcej informacji na temat tej techniki przedstawię w dalszej części tego rozdziału, przy okazji omawiania przy kładu aplikacji Panels. Przykładowy układ jest pokazany na listingu 3.6. Listing 3.6. XAML dla układu VariableSizedWrapGrid
< /ItemsPanelTemplate>
< /ItemsControl.ItemsPanel>
< /ItemsControl.Items>
< /ItemsControl>
Efekt działania tego układu jest pokazany na rysunku 3.8. Zwróć uwagę, że zmienny rozmiar i roz ciąganie pozwalają na wyświetlenie całego prostokąta. Jedynie koło jest obcięte, ponieważ powierzchnia jest ograniczona tu do rozmiaru 400 na 400 pikseli.
Rysunek 3.8. Układ VariableSizedWrapGrid
Układ
•.
85
Element ContentControl Kontrolka ContentControl jest najbardziej podstawowym kontenerem. Jest to po prostu kontrolka z jed nym elementem podrzędnym. Nie zapewnia ona żadnej formy kontroli układu. Kontrolka ContentControl jest często używana do zaznaczania miejsca, w którym później może być umieszczona inna kontrolka (lub kontrolki), albo jest używana jako klasa bazowa dla kontrolek, które mają jeden element zawartości. Warto pamiętać, że domyślnie ContentControl zapewnia najlepsze dopasowanie do kontrolki podrzędnej. Aby zobaczyć działanie tego elementu, możesz utworzyć siatkę z dwoma kolumnami o takiej samej szerokości. Ustaw domyślny styl dla prostokątów, które rozciągną się, aby wypełnić dostępne miejsce, i zostaną wypełnione kolorem zielonym z niebieskimi prążkami, jak pokazano na listingu 3.7. Listing 3.7. Definicja siatki przechowującej obiekty ContentControl
Dodaj teraz dwa obiekty ContentCont rol. Oba powinny się rozciągnąć, aby wypełnić całe dostępne miejsce. W drugiej kontrolce dodaj specjalne właściwości dołączone dla Hari zontalContentAlignment oraz VerticalContentA lignment. Obu tym właściwościom nadaj wartość Stretch. Pełny kod jest zamieszczo
ny na listingu 3.8. Listing 3.8. Obiekty ContentControl dla kontrolki Grid
Powinieneś zauważyć, że została wyświetlona tylko prawa kontrolka. Dzieje się tak wskutek sposobu działania ContentControl. Pomimo że kontener rozciągnął się, aby wypełnić całe dostępne miejsce, nie pozostawiła ona miejsca dla obiektu podrzędnego. Jeśli obiekt podrzędny nie będzie miał stałej szeroko ści i wysokości, nie otrzyma miejsca do rozszerzenia, więc parametr Stretch spowoduje ustawienie wiel kości O. Gdy zostanie użyty parametr Hari zontalContentA lignment lub VerticalContentA lignment, element
Rozdział 3. Język XAML
86
(Extensible Application Markup Language)
może pozycjonować się względem nadrzędnego kontenera, a jeżeli wartością tych parametrów będzie Stretch, kontrolce zostanie przydzielone całe wolne miejsce.
Element ltemsControl ItemsControl jest specjalnym kontenerem pozwalającym na tworzenie kolekcji elementów podrzędnych.
Jest on najczęściej używany w kontrolkach wymagających list danych, takich jak listy rozwijane. Oprócz panelu, który określa sposób rozmieszczenia treści, kontrolka ta udostępnia właściwość ItemsSource. Do tej właściwości można przypisać dowolną wyliczalną listę (obsługującą I Enumerab le ), która będzie wyko rzystana do generowania zawartości kontrolki.
Element ScrollViewer Element Scroll Vi ewer pozwala tworzyć przewijane listy innych elementów UL Zawiera on wirtualną powierzchnię o takiej wielkości, jaka jest potrzebna do wygenerowania całej zawartości. Zawiera jedynie jeden element, który z kolei może być zarówno zwykłą kontrolką, jak i panelem z własnymi kontrolka mi. Jeżeli elementem podrzędnym jest lista zawierająca 1000 elementów i każdy ma wysokość 20 jedno stek, powierzchnia w Scro11 Vi ewer będzie miała 20 OOO jednostek wysokości. Dodatkowo Scro11 Vi ewer posiada „obszar widoczny", który reprezentuje podzbiór pełnego obszaru, który jest aktualnie wyświetlany. Element Scro11 Vi ewer zapewnia przewijanie w poziomie, w pionie lub w obu kierunkach jednocześnie. Główną zaletą użycia kontrolki Scro11 Vi ewer jest wbudowana obsługa dotknięć i zmiany rozmiaru. Dotknięcia są automatycznie obsługiwane przez kontrolkę. Gdy można przewijać zawartość w więcej niż jednym kierunku, kontrolka implementuje mechanizm „szyn", czyli stref, w których przewijanie jest możliwe tylko w jednym kierunku. Zapobiega to chybotaniu się ekranu z powodu niewielkich odchyleń kierunku wprowadzanych przez palec użytkownika. W widocznym obszarze jest również obsługiwane szczypanie w celu zmiany powiększenia, a wszystkie te ustawienia są konfigurowane za pomocą właści wości kontrolki. Poniżej zamieszczony jest przykładowy fragment XAML definiujący Scro11 Vi ewer:
Wynikowy przewijany obszar jest pokazany na rysunku 3.9.
Element ViewBox Vi ewBox jest dosyć unikalnym kontenerem. Jego jedynym zadaniem jest zmiana rozmiaru zawartości.
Możesz utworzyć zawartość w obszarze wirtualnym, a następnie przekształcić ten obszar, aby zmieścił się na widocznym ekranie. Element Vi ewBox pozwala na określenie metody wykorzystywanej do rozcią gania zawartości, tak aby wypełniła dostępne miejsce. Można zastosować następujące tryby: •
None
- zawartość nie jest skalowana i jest po prostu przycinana do wielkości widocznego obszaru,
•
Fi 11
- zawartość jest zniekształcana, aby wypełnić przestrzeń, zmieniając w razie potrzeby
proporcje,
Układ
•.
87
Rysunek 3.9. Pasek przewijania wyświetlony dla kontrolki StackPanel wewnątrz ScrollViewer •
Uniform
-
zawartość jest skalowana w celu wypełnienia widocznego obszaru w możliwie
najlepszy sposób bez zmiany proporcji (mogą wystąpić puste przestrzenie na górze i na dole lub po bokach zawartości), •
UniformToFi11
-
zawartość jest skalowana w celu wypełnienia możliwie dużej części przestrzeni,
przy zachowaniu proporcji (zawartość będzie obcięta, jeżeli proporcje nie będą się zgadzać). Na listingu 3.9 znajduje się XAML dla siatki, w którym przedstawiam kilka opcji skalowania. Choć dostępne jest wiele innych kontenerów i kontrolek, trzeba zrozumieć przede wszystkim te, ponieważ są klasami bazowymi i są wykorzystywane przez szablony lub dziedziczą po nich inne kontrolki. Listing 3.9. Konfiguracja siatki w celu zademonstrowania kontrolki ViewBox
Rozdział 3. Język XAML (Extensible Application Markup Language)
88
Po ukończeniu siatki oraz po uruchomieniu aplikacji powinieneś zobaczyć wynik w oknie edytora. Aplikacja wygląda jak na rysunku 3.10.
I' 1:. Viewbox
viewbox
View
I
Rysunek 3.1 O. Dostępne sposoby skalowania
Możesz sam zobaczyć ten przykład przez otwarcie projektu Layout i przejście do ostatniej strony. Możesz również otworzyć plik
ViewboxExample.xaml w
edytorze, znajdujący się w rozwiązaniu Panels.
Po uruchomieniu rozwiązania dla aplikacji Panels zobaczysz kilka opcji dla różnych układów zarządza jących listami obiektów. Kontrolka Gri dVi ew jest przedstawiona w pierwszym przykładzie.
Element GridView Element Gri dVi ew jest zaawansowaną kontrolką pozwalającą na wyświetlanie listy danych w formacie ułatwiającym użytkownikowi nawigowanie. Ważną funkcją tej kontrolki jest możliwość obsługi grupowa nych danych. Oznacza to, że można kategoryzować długie listy oraz tworzyć nagłówki podrzędne umoż liwiające logicznie organizowanie danych. W projekcie
Panels
zdefiniowana jest prosta klasa definiująca typ kształtu. Klasa zawiera definicję
koloru czerwonego, zielonego i niebieskiego, co pozwala na stosowanie różnych kolorów. Druga klasa, o nazwie Simpl elteml i st, posiada kolekcję obiektów Simpl eltem. Plik
ItemDisplay.xaml definiuje kon
trolkę użytkownika do reprezentowania danych. Tę kontrolkę użytkownika możemy uważać za kolekcję elementów Ul do wielokrotnego wykorzystania. W tym przypadku pozwala to na jednokrotne definio wanie wyglądu elementu, a następnie używanie tej definicji w innych obszarach aplikacji. Kontrolka użytkownika korzysta z ContentControl w celu faktycznego renderowania kształtów repre zentowanych przez elementy danych. Kontener używa klasy Converter w celu transformacji elementu Simpl eltem z bieżącego DataContext na wypełniony kształt. Zamiast korzystać z jednego parametru, kon
werter używa całej klasy Simpl eltem. Na początku definiowany jest pełny pędzel o odpowiednim kolorze: var color = Color.FromArgb(Oxff, (byte)item.Red, (byte)item.Green, (byte)item.Blue); var brush = new SolidColorBrush(color);
Następnie na podstawie typu elementu jest rysowana odpowiednia figura. Na przykład okrąg jest elipsą o takich samych wartościach Hei ght i Wi dth: case ItemType.Circle: var circle = new Ellipse(); circle.Width = 200;
Układ
•.
89
circle.Height = 200; circle.Fill = brush; retVal = circle; break;
Na głównej stronie został zadeklarowany nowy element o nazwie Collecti on Vi ewSource. Jest to pro sty pośrednik dla kolekcji, dzięki czemu można w łatwy sposób obsługiwać grupowanie i wybieranie. Pierwsza kolekcja obsługująca grupowanie jest zadeklarowana następująco:
Wypełnienie kolekcji jest proste. Do właściwości źródła przypisywane jest zapytanie grupujące ele menty według reprezentowanych przez nie kształtów: CVSGrouped.Source = from item in list group item by item.Type into g orderby g.Key select g;
Zapytanie jest zapisane z użyciem mechanizmu Language Integrated Query, czyli LINQ. Jest to spe cjalna funkcja, która zapewnia standardową metodę odpytywania danych niezależnie od ich typu w tym przypadku zwykłej listy. Jeżeli nie korzystałeś z LINQ, zalecam uzupełnienie wiedzy. Możesz za cząć od książki Essential LINQ, dostępnej pod adresem http://www.informit.com/store!product.aspx?isbn =0321564162.
Kontrolka Gri dVi ew jest dowiązana do źródłowej listy. Kontrolka ta posiada kilka części, które można w pełni modyfikować. Na przykład możesz określić, w jaki sposób wyświetlać nagłówek dla każdej grupy:
Szablony są elementami XAML, które można wielokrotnie wykorzystywać. Specjalnym szablonem jest DataTemplate; pozwala on zdefiniować wygląd danych z bazowego źródła danych. W tym przykła dzie szablon DataTemplate zawiera definicję nagłówka z prostym tekstem związanym z kluczem grupy. Po wykonaniu zamieszczonego wcześniej zapytania klucz będzie zawierał typ kształtu, więc nagłówek będzie wyświetlał kategorię, na przykład Okrąg lub Prostokąt. Inny szablon umożliwia zdefiniowanie wyglądu poszczególnych elementów w grupie:
Informacje na temat elementu Vari ableSi zedWrapGri d zostały zamieszczone we wcześniejszej części rozdziału. Przypomnij sobie, że ma on specjalny sposób określenia, czy element potrzebuje więcej miej sca. W tym przykładzie prostokąty i elipsy będą zajmowały dwie kolumny, a okręgi i kwadraty zmieszczą się w jednej. Nowa klasa, ShapeVi ew, dziedziczy po bazowej kontrolce Gri dVi ew: public class ShapeView : GridView
90
Rozdział 3. Język XAML (Extensible Application Markup Language)
Następnie nadpisujemy metodę PrepareContai nerForitemOverri de. Jeżeli element danych jest obiektem Simpleltem typu Elli pse lub Rectangle, to przypisujemy wartość 2 do właściwości dołączonej ColumnSpan:
II
if (itemdetail.Type.Equals(ItemType.Ellipse)
itemdetail.Type.Equals(ItemType.Rectangle)) element.SetValue(VariableSizedWrapGrid.ColumnSpanProperty,
2.0);
Możemy zdefiniować tak wyświetlenie w grupie, ale dodatkowo dostępne są szablony określające spo sób rozmieszczenia grup względem siebie. W tym przykładzie grupy są ułożone poziomo w postaci sto su, wewnątrz elementu Virtuali zingStackPanel:
11
11
Ostatecznie poszczególne elementy danych są definiowane za pomocą znacznika DataTemplate, któ ry korzysta z kontrolki użytkownika ItemDisplay:
Wynikiem jest układ pokazany na rysunku 3.11. Zwróć uwagę, że elementy są rozmieszczone w wie lu wierszach i kolumnach, a elipsy zajmują więcej miejsca niż okręgi. Widoczne są mniejsze nagłówki grup, a dodatkowo kontrolka Gri dVi ew zapewnia standardowe funkcje zaznaczania.
Rysunek 3.11. Układ GridView
Układ
•.
91
Element ListView Kontrolka Li st Vi ew jest podobna do Gri dVi ew. Główną różnicą jest domyślna pionowa orientacja zamiast poziomej. Kontrolka ta jest zaprojektowana na potrzeby węższych widoków, takich jak aplikacja w trybie dzielenia ekranu z inną.
•WSKAZÓWKA Więcej informacji na temat zaawansowanych funkcji znajduje się w rozdziale 4., „Aplikacje Win dows 8". Jednym z przykładów takich funkcji jest możliwość przełączenia się pomiędzy pracą na pełnym ekranie a podziałem ekranu na dwa okna. W trybie podziału okno zajmuje tylko wąski pa sek na ekranie. Częstą praktyką jest obsługa tego specjalnego widoku przez przełączenie z kontrolki Gri dVi ew na Li st Vi ew. Możesz również pomyśleć o zastosowaniu takiego przekształcenia, gdy zmie
nia się orientacja wyświetlacza z poziomej na pionową. Możliwość dostosowania się aplikacji do orientacji i rozdzielczości urządzenia jest podstawową cechą aplikacji Windows 8.
Na rysunku 3.12 pokazane są te same figury co poprzednio w kontrolce ListView.
Rysunek 3.12. Układ listy
Element FlipView Element Fl i pVi ew jest nową, unikalną kontrolką pozwalającą na przewijanie elementów z listy. Wyświe tla ona jeden element naraz i umożliwia przewijanie listy w lewo lub w prawo. Posiada ona wbudowane animacje pozwalające automatycznie przesuwać elementy poza ekran przy jednoczesnym wsuwaniu nowego elementu na ekran. Jest to przydatne do nawigowania pomiędzy pojedynczymi elementami lub szybkiego przesuwania widoku szczegółowego elementów.
92
Rozdział 3. Język XAML
(Extensible Application Markup Language)
Element ListBox Kontrolka List Box ma za zadanie stanowić porównanie dla nowszych kontrolek. Ma ona możliwość wy świetlania elementów, ale nie ma bardziej zaawansowanych funkcji z ListVi ew. Nie zapewnia rozszerzo nych możliwości wybierania i nie obsługuje grupowania danych. Przy migracji aplikacji na platformę Windows 8 najprawdopodobniej będziesz chciał wymienić wszystkie użycia List Box na bardziej zaawan sowane kontrolki ListVi ew.
Wspólne kontrolki Gdy poznasz możliwości tworzenia układu za pomocą XAML, możesz zacząć budować interfejs użyt kownika z zastosowaniem dostępnych wbudowanych kontrolek. Wszystkie kontrolki oferowane przez Windows 8 znajdują się w przestrzeni nazw Windows.Ul .Xaml .Control s. Choć możesz łatwo wstawiać znaczniki tych kontrolek do XAML (podobnie jak inne obiekty), warto pamiętać, że większość tych kon trolek to natywne obiekty WinRT posiadające projekcje XAML. Zapewnia to wysoką wydajność przy jednoczesnym wykorzystaniu elastyczności silnika XAML. W tabeli 3.4 zamieszczona jest alfabetyczna lista często używanych kontrolek wraz z krótkim opisem każdej z nich. Wiele z tych kontrolek przedstawię dokładniej w kolejnych rozdziałach. Kontrolki te można umieszczać na powierzchni XAML w celu utworzenia interfejsu aplikacji. Moż liwe jest również tworzenie własnych kontrolek lub grupowanie istniejących, dzięki czemu można ko rzystać z nich wielokrotnie w aplikacjach i szablonach. W punkcie tym przedstawiłem bardzo krótki opis kontrolek, więcej informacji na ich temat znajdziesz w kolejnych rozdziałach.
Podsumowanie W tym rozdziale omówiłem XAML - unikalny język znaczników wykorzystywany do deklarowania in terfejsu użytkownika dla aplikacji Windows 8. Zapoznałeś się z mechanizmem właściwości zależnych i dołączanych oraz dowiedziałeś się, jak można wykorzystać bazowe właściwości CLR do rozszerzania właściwości XAML. Dowiedziałeś się również, w jaki sposób wiązanie danych pozwala oddzielić Ul i lo gikę prezentacji od bazowych danych aplikacji. Serie ujęć umożliwiają animowanie elementów na ekranie. Style i zasoby zapewniają centralne repo zytoria na informacje na temat wyglądu lub „tematu" aplikacji. Na koniec przedstawiłem kontrolki układu zapewniające różne sposoby organizowania elementów i list, które są wypełniane przy użyciu wspólnych kontrolek oferowanych przez Windows Runtime. W następnym rozdziale omówię najważniejsze cechy aplikacji Windows 8. Wykorzystasz swoją wie dzę na temat układów i kontrolek do zbudowania aplikacji reagującej na zmianę orientacji i rozdzielczo ści urządzenia. W tym celu użyjesz specjalnej klasy o nazwie Visual State Manager. Przedstawię sposób obsługi wprowadzania danych przez użytkownika, podłączenie funkcji do paska aplikacji, tworzenie me nu kontekstowego oraz specjalnej strony „O programie". Na koniec zbudujesz komponenty WinRT do wielokrotnego wykorzystania, które mogą posłużyć jako elementy większej aplikacji.
Podsumowanie
•
93
Tabela 3.4. Wspólne kontrolki(* wskazuje nową kontrolkę Windows Runtime) Kontrolka AppBar*
Opis Pozwala utworzyć pasek narzędzi realizujących polecenia specyficzne dla aplikacji. Więcej informacji na temat tej kontrolki znajduje się w rozdziale 4.
Button
Tworzy miejsce, które użytkownik może kliknąć lub stuknąć w celu wygenerowania zdarzenia. Kontrolka ta może być również związana z poleceniem. Więcej informacji na temat poleceń znajduje się w rozdziale 8., „Tworzenie paneli w aplikacji".
CheckBox
Prosta kontrolka, która może być wybrana lub wyczyszczona, zwykle pozwalająca manipulować wartościami logicznymi.
ComboBox
Pozwala utworzyć listę elementów do wyboru. W Windows 8 lepiej używać list wyboru lub siatki, ponieważ w tych kontrolkach mamy większą kontrolę nad układem i zdarzeniami.
HyperlinkButton
Pozwala tworzyć wyróżniony tekst obsługujący klikanie, co zwykle umożliwia nam realizowanie nawigacji.
Image
Kontrolka do osadzania obrazów rastrowych.
MediaElement
Pozwala utworzyć powierzchnię do odtwarzania dźwięku i filmów.
MediaPlayer
Rozbudowana kontrolka pozwalająca na odtwarzanie mediów i sterowanie nimi.
PasswordBox
Specjalny rodzaj kontrolki wprowadzania tekstu, która ukrywa dane wejściowe, dzięki czemu użytkownik może bezpiecznie podać hasło lub kod.
PopupMenu*
Menu pozwalające na zaprezentowanie użytkownikowi funkcji aplikacji.
ProgressBar
Wyświetla pasek pozwalający pokazać użytkownikowi postęp realizacji operacji.
ProgressRing*
Kontrolka używana do pokazania postępu realizacji operacji o nieznanym czasie zakończenia -w postaci animowanego pierścienia.
Radi oButton
Pozwala na realizację wyboru wzajemnie wykluczających się opcji.
RepeatButton
Jest to specjalny przycisk, który stale generuje zdarzenia, gdy jest naciśnięty - w przeciwieństwie do zwykłego przycisku, który generuje jedno zdarzenie Click.
RichTextBlock
Pozwala na udostępnienie obszaru edytora tekstu i grafiki z bogatymi możliwościami formatowania.
ScrollBar
Pasek przewijania z przesuwającym się znacznikiem położenia.
SemanticZoom*
Pozwala użytkownikowi na przełączanie się pomiędzy dwoma widokami kolekcji.
TextBlock
Używany do wyświetlania statycznego tekstu.
TextBox
Pozwala na wprowadzenie wiersza (wierszy) tekstu przez użytkownika.
Slider
Pozwala utworzyć pasek ze znacznikiem, za pomocą którego użytkownik może wybrać zakres wartości.
ToggleButton
Przycisk, który można przełączać pomiędzy dwoma stanami.
ToggleSwitch
Przełącznik, który można przełączać pomiędzy dwoma stanami.
ToolTip
Okno kontekstowe pozwalające na wyświetlanie informacji na temat elementu.
WebView*
Pozwala na osadzanie treści HTML.
94
Rozdział 3. Język XAML (Extensible Application Markup Language)
Aplikacje Windows 8
A
PLIKACJE WINDOWS 8 MAJĄ WSPÓLNE CECHY, dzięki którym świetnie działają na rozma itych urządzeniach z systemem Windows 8. Są one szybkie, płynne i adaptują się łatwo do różnych
rozdzielczości i trybów ekranu. Obsługują wiele form wprowadzania danych oraz manipulacji dotykiem, jak również zapewniają spójną pracę w wielu innych aplikacjach przez zdefiniowanie stałego miejsca dla ich poleceń oraz menu kontekstowych. W poprzednim rozdziale przedstawiłem XAML, będący deklaratywnym językiem pozwalającym na oddzielenie projektu od zadań programistycznych, oraz definiowanie zaawansowanego i rozszerzalnego interfejsu użytkownika. W tym rozdziale nauczysz się, w jaki sposób łączyć XAML i kod w celu zapew nienia różnych cech, jakie musi posiadać każda aplikacja Windows 8. Wiele z tych cech jest dostępnych i konfigurowalnych dzięki XAML.
Układy i widoki Aplikacje Windows 8 adaptują się do różnych układów i widoków. Obejmuje to orientację urządzenia (poziomą lub pionową) oraz widok wypełniony bądź przyciągnięty, gdy aplikacje działają obok siebie. Wbudowane w Visual Studio 2012 szablony zapewniają automatyczną realizację wielu przejść pomiędzy tymi trybami. Jeżeli nie posiadasz tabletu lub akcelerometru, prostym sposobem na przetestowanie zmian układów jest użycie wbudowanego symulatora.
Symulator Otwórz katalog z kodem źródłowym do rozdziału 4., znajdujący się w archiwum dostępnym pod adre sem ftp:I!Jtp.helion.pl!przyklady!w8twap.zip.
Zamiast jak zwykle debugować aplikację na lokalnym komputerze, rozwiń menu pozwalające na usta wienie parametrów debugowania i wybierz uruchomienie w symulatorze. Dostępne opcje są pokazane na rysunku 4.1. Symulator pozwala w prosty sposób testować różne rozdzielczości ekranu oraz orientacje. Zapewnia nawet emulację dotyku, jeżeli pracujesz na komputerze, który bezpośrednio nie obsługuje dotyku. Symu lator ma ikonę wyglądającą jak tablet z klawiszem
Windows. Po prawej stronie ekranu znajduje się zestaw
ikon realizujących różne funkcje. Licząc od góry, są to:
Rozdział 4. Aplikacje Windows 8
96
Di(I FILE
Quickla unch (Ctrl_,_Q)
Windows8Application - Microsoft Visual Studio EDIT
VIEW
PROJECT
BUILD „
g INii@#Mff-F! Grouped l [ �Windows.8Application.GroupedltemsP11ge Elusing Windm.,.s 8 Ap p licat io n . Oat
l
u
,
i
ng
BUG TEAM SQL TOOLS ld§ijiff Debug •
DE
„
LocalMachine Simulator
0 Lo(al Ma(h i e n
RomotoMoch;ne
sy,tem;
TEST
ARCHITECTURE
fM
bi �
;
ANALVZE
•y �
•
!----------------'"" SolutionExplorer ... fi:!
GroupedltemsP11geQ
�
i=
t>
using HindO\"s. U I . Xam l ; using Windm'fs.UI.Xaml.Controls;
li The Grou ped Items Page ite111 temrlate is doc:u111ented at httr:l/go.microsoft.comlfwlinkl?Link!d•234231
i t
///
El
pu bl
l
///A page that disphys a grouped collec:tion of item s .
u l c
f
I
//I
P·
Common D11t11Model
.O App.xaml ,O Applic11tionComm11nds .x11ml ,O GroupDet11ilP11ge.x11ml
,O Groupedltems.Page.xaml t> +LI GroupedltemsP11ge .xaml.cs ,O ltemDetailP11ge.x11ml
� �etroAppl i(ation_TemporaryKey.pfx
SolutionExplorer Team�plorer Properties
•
�X
/// Populates the page with content passed duri ng navigation.
11I
,O About.xaml
6coupeditem,Page()
Init iali„Compone ot();
El
t>
t>
c sealed pal"'tial class GroupeditemsPage
�X
1' [§ &b .
Assets
iii iii iii
„
Ili
iI
1'Properti'5
t> t> t> t>
i ( ibi
� '� 8JI :�
t>
t>
Elnamespace WindowsSAppl ca ion
I(
• •
SeardiSolutionExplorer(Ctrł+:}
usi ng System. Collections.6 eneric;
El
.,.0
i
prov ded
when
Any saved state i s also
recreat ing a page fron a prior sess ion.
Ili
Ili
Th e parameter value passed to
100o/a• OWarnings
OMes.s.ages.
Des.cription
Colu „ .
..._
rj
�X P·
P o ect ..._
Rysunek 4.1. Wybór symulatora do debugowania L Mouse Mode- użycie wskaźnika jako zwykłej myszy. 2. Touch Emulation - użycie wskaźnika jako powierzchni dotykowej. Kliknięcie myszy powoduje
emulację stuknięcia.
3. Touch Emulation Pinch and Zoom- pozwala na testowanie szczypania w celu powiększania.
Po prostu przytrzymaj lewy przycisk myszy i pokręć jej kółkiem, aby powiększyć lub powiększyć (możesz również wykonać tę samą operację w trybie myszy przez przytrzymanie klawisza Ctrl,
a następnie pokręcenie kółkiem myszy).
4. Touch Emulation Rotate - tryb ten pozwala na emulację obrotu dotykiem. Przytrzymaj lewy
przycisk myszy i pokręć kółkiem, aby wykonać obrót.
5. Rotate 90 Degrees Clockwise - pozwala emulować obrócenie tabletu pomiędzy trybem
poziomym a pionowym.
6. Rotate 90 Degrees Counterclockwise - pozwala emulować obrócenie tabletu pomiędzy trybem
poziomym a pionowym.
7. Change Resolution- emulacja różnych rozdzielczości. Ponieważ rozdzielczość jest symulowana,
możesz ustawić wyższą rozdzielczość, niż jest dostępna w Twoim komputerze.
8. Set Location - pozwala na wprowadzenie długości i szerokości geograficznej, wysokości oraz
marginesu błędu, co umożliwia emulowanie lokalizacji przez symulator.
9. Screenshot- funkcja pozwalająca na wykonanie zrzutu ekranu w bieżącej rozdzielczości
symulatora.
fi
10. Con gure Screenshot- pozwala na określenie, czy zrzut ekranu jest umieszczany w schowku,
czy zapisywany do pliku, oraz na ustawienie lokalizacji zapisu.
11. Help - wywołanie pomocy dla symulatora.
Układy i widoki
•
97
Symulator oferuje wiele opcji. W zamieszczonym przykładzie rozdzielczość została ustawiona na 1366x768.
Na rysunku 4.2 widoczna jest aplikacja zawierająca kilka grup i elementów w grupach. Sy
mulator faktycznie tworzy połączenie zdalnego pulpitu z komputerem, na którym pracuje aplikacja(nie korzysta z maszyny wirtualnej). Pozwala to testować aplikację na własnym komputerze z użyciem różnych gestów dotyku oraz proporcji ekranu.
Rysunek4.2. Przykładowa aplikacja działająca w symulatorze
Teraz, gdy aplikacja działa na pierwszym planie(możesz kliknąć lub stuknąć pusty obszar w aplikacji, aby upewnić się, że posiada fokus), przytrzymaj klawisz Windows i naciśnij klawisz z kropką(.). Spowo duje to przełączenie aplikacji do widoku przyciągniętego. Jeżeli masz uruchomioną inną aplikację Win dows 8, wypełni ona pozostałą część ekranu (większy segment); w przeciwnym razie pozostanie pusta, a bieżąca aplikacja skurczy się do części przyciągniętej, jak pokazano na rysunku 4.3.
Rysunek 4.3. Aplikacja w widoku przyciągniętym
Rozdział 4.
98
Aplikacje Windows 8
Widok przyciągnięty jest specjalnym, skompresowanym widokiem używanym do udostępnienia uproszczonych informacji w przypadku, gdy inna aplikacja jest na pierwszym planie. Doskonałą kon trolką do realizacji tego widoku jest pionowo zorientowana Li stView zamiast zorientowanej poziomo GridView. Widok przyciągnięty jest dostępny wyłącznie, gdy ekran ma szerokość co najmniej 1366 pik
seli. We wszystkich mniejszych rozdzielczościach, takich jak 1024x768 funkcja przyciągania nie jest do stępna. Widok przyciągnięty jest w pełni funkcjonalnym widokiem aplikacji, ale jest ograniczony do 320 pikseli szerokości. Jest to wystarczająca rozdzielczość do zapewnienia dosyć dużej liczby funkcji i nieprzy padkowo jest to rozdzielczość często spotykana w smartfonach. Oprócz aplikacji w widoku przyciągniętym na ekranie znajduje się uchwyt o szerokości 22 pikseli, który użytkownik może przeciągnąć po ekranie, wychodząc z widoku przyciągniętego. Na ekranie pozo stają więc dokładnie 1024 piksele szerokości, więc widok wypełniony będzie miał dostępną rozdzielczość 1024x768 (1366-320-22
=
1024), co jest minimalną zalecaną rozdzielczością dla aplikacji Windows 8.
Zwróć uwagę, że po przełączeniu przykładowej aplikacji w tryb przyciągnięty ekran się zmienił. Za miast poziomej siatki z elementami wypełniającymi wiersze i kolumny została zastosowana pionowa li sta. Ułatwia to nawigację i wybieranie elementów w wąskim, przyciągniętym widoku. Bardziej interesu jący jest sposób wykonania zmiany przez aplikację. Aplikacja jest zbudowana z użyciem XAML oraz kodu wykorzystującego potężną klasę nazywaną Visual State Manager.
Visual State Manager Visual State Manager (VSM) stanowi klucz do sukcesu w realizacji zadania oddzielenia projektu i dzia łania Ul od logiki aplikacji. W połączeniu z wiązaniem danych pozwala oddzielić logikę i zadania Ul od pozostałej części aplikacji. Visual State Manager obsługuje logikę stanów aplikacji oraz przejść pomiędzy nimi. Obsługuje on za równo własne kontrolki, jak i szablony kontrolek. VSM równie dobrze zarządza stanem stron, jak i kon trolek użytkownika. Celem dla VSM jest zawsze element dziedziczący po klasie Control, czyli obejmuje to kontrolki takie jak Page oraz UserControl, a lokalizacją dla VSM zawsze powinien być korzeń szablo nu dla kontrolki. W projekcie Windows8Application, w pliku
GroupeditemsPage.xaml, znajdziesz ele
ment VisualStateManager. VisualStateGroups umieszczony wewnątrz głównej siatki. VSM pozwala na definiowanie grup, stanów oraz opcjonalnych przejść. Grupa stanowi zbiór wza jemnie wykluczających się stanów. Zgodnie z nazwą grupa tworzy asocjację pomiędzy związanymi ze sobą stanami. W przykładowej aplikacji strona zawiera kilka stanów wewnątrz jednej grupy o nazwie ApplicationViewStates. Stanami tymi są: •
FullScreenlandscape
-
gdy aplikacja działa na pełnym ekranie, a tablet jest w położeniu
poziomym. • •
Fi11 ed
-
gdy aplikacja zajmuje większość miejsca obok innej, przyciągniętej aplikacji.
FullScreen Portrait
-
gdy aplikacja działa na pełnym ekranie, a tablet jest w położeniu
pionowym. •
Snapped
-
gdy aplikacja działa w trybie przyciągniętym w panelu o szerokości 320 pikseli.
Ważne jest, że stany te wzajemnie się wykluczają, ponieważ VSM pozwala na działanie jednego sta nu z grupy w danym momencie. Grupa reprezentuje kontrakt dla zachowania strony. Po zdefiniowaniu zbioru stanów obsługiwanych przez stronę musimy zarządzać stroną w kontekście tych stanów. Stanem zarządza się za pomocą metod klasy bazowej, po której dziedziczy strona. VSM pozwala na modyfikowa nie domyślnych ustawień wyglądu strony w danym stanie.
Układy i widoki
•
99
Aby zobaczyć, w jaki sposób zarządza się stanami, otwórz folder Common i zapoznaj się z klasą LayoutAwarePage.
zdarzenia
Klasa ta jest dostarczana poprzez szablon projektu, a jej zadaniem jest przechwycenie
ViewStateChanged,
które jest generowane za każdym razem, gdy zmieni się orientacja lub zo
stanie zmieniony tryb przyciągnięty. Procedura obsługi zdarzenia po prostu sprawdza nowy stan wido ku, konwertuje go na ciąg znaków, a następnie instruuje VSM, aby dokonał zmiany na ten stan: VisualStateManager.GoToState(layoutAwareControl, visualState, false);
Zwróć uwagę, że nie ma tu żadnej logiki Ul obsługującej zmianę stanu. Dzięki temu logika Ul jest oddzielona od logiki aplikacji. Logika aplikacji jedynie obsługuje zmianę stanu. Zmiana stanu Ul jest de klarowana w XAML za pomocą serii ujęć. Jeżeli użyjesz grup dla kontrolek, to musisz zdefiniować wiele serii ujęć wykonywanych jednocześnie na tych kontrolkach. Ważną zasadą przy definiowaniu grup jest konieczność zachowania ich wzajemnej ortogonalności. Choć kontrolki mogą istnieć w wielu stanach (dokładnie jeden stan dla każdej z grup), grupy te nie po winny jednocześnie modyfikować tych samych aspektów wizualnych. Zasada ta nie może być wymuszo na przez kontrakt kontrolki, ponieważ możesz utworzyć dowolne serie ujęć dla danego stanu. W przy padku niezachowania tej zasady wyniki mogą być nieoczekiwane. Grupy są kontenerami dla związanych ze sobą, wzajemnie wykluczających się stanów. Czym jest stan? Stan ma zarówno definicję logiczną, jak i fizyczną. Logicznie stan jest jednym ze wzajemnie wykluczają cych się statusów kontrolki. Fizycznie jest zbiorem elementów wizualnych i atrybutów reprezentujących stan. Ważne jest to, że stany pozwalają na oddzielenie szczegółów wyglądu kontrolek w określonym sta nie od samego stanu. W kodzie możesz po prostu ustawić określony stan kontrolki, a następnie pozwo lić mechanizmowi VSM na zajęcie się doprowadzeniem wyglądu do tego stanu. Ułatwia to nie tylko te stowanie i implementowanie kontrolek, ale również ich rozszerzanie i dostosowywanie. Spójrz na plik GroupeditemsPage.xaml. Jest tu zdefiniowana jedna grupa bez nazwy, a pierwszy stan jest zdefiniowany w następujący sposób:
Stan jest pusty. Oznacza to, że do wyświetlenia Ul dla tego stanu wystarczają domyślne mechanizmy XAML. Gdy spojrzysz na XAML, możesz zauważyć kontrolkę SemanticZoom, zdefiniowaną w pierwszym wierszu kontrolki (więcej informacji na temat semantycznego powiększania podaję w dalszej części roz działu). Jest tu również deklaracja Scro11 Viewer dla tego samego wiersza, ale jego właściwość ma wartość Col l apsed, więc kontrolka ta nie jest widoczna. Znajduje się w nim kontrolka
Visi bil ity
ListVi ew
uży
wana w widoku przyciągniętym. Spójrz teraz na deklarację stanu Snapped. Jest on pokazany na listingu 4.1. Znajduje się tu jedna kon trolka Storyboard z kilkoma animacjami. Animacje te nie są używane do poruszania kontrolek, ale ko rzystamy tu z tego, że animacje mogą zmieniać wartość właściwości zależnych. VSM korzysta z animacji do ustawiania wartości właściwości kontrolek (przyczynę takiego działania wkrótce wyjaśnię). Listing 4.1. Definicja dla stanu Snapped
1 OO
•
Rozdział 4. Aplikacje Windows 8
W przykładzie tym zmieniane są przycisk Wstecz oraz styl tytułu. Kontrolka Semanti cZoom ma widocz ność ustawioną na
Col l apsed,
doczność kontrolki
Scro11 Vi ewer
przez co nie jest wyświetlana wraz z jej elementami podrzędnymi, a wi jest ustawiona na
widoczność kontrolki jest ustawiona na jeżeli widoczność jest ustawiona na
Co11 apsed,
Vis i ble,
Vis i ble,
więc kontrolka ta będzie wyświetlana (gdy
kontrolka nie jest umieszczana w drzewie wizualnym;
kontrolka jest umieszczana w drzewie wizualnym nawet
w przypadku ustawienia pełnej przezroczystości lub koloru
Transparent ).
Animacja będzie działała tak
długo, jak długo jest ustawiony stan wizualny. Gdy stan się zmieni, obiekt Storyboard zostanie zatrzymany, a właściwości wrócą do swoich domyślnych wartości (lub nowych wartości zdefiniowanych w kontrol kach Storyboard dla nowego stanu). VSM korzysta z kontrolek
Storyboard,
ponieważ mają one najwyższy priorytet przy ustawianiu war
tości właściwości zależnych. Aby zrozumieć, w jaki sposób zarządzać stanami, wystarczy wiedzieć, jak działają kontrolki kontrolki
Storyboard.
Storyboard
Gdy kontrolka przechodzi w określony stan, VSM zatrzymuje wszystkie
dla innych stanów w tej grupie (pamiętaj, że stany w grupie wzajemnie się wyklu
czają), a następnie uruchamia kontrolkę Storyboard zdefiniowaną dla stanu docelowego. Najlepszą praktyką jest ustawienie stanu początkowego w momencie inicjalizacji kontrolki, dzięki czemu kontrolka zostanie wstawiona do „grafu stanów", czyli do zbioru prawidłowych stanów. Klasa LayoutAwarePage
realizuje to w metodzie
StartlayoutUpdates.
Zwróć uwagę na wywołanie
GoToState
przed zakończeniem działania metody. Przejścia zwiększają elastyczność VSM przez umożliwienie kontroli nad przejściami pomiędzy sta nami. Możesz zdefiniować, że przejścia będą stosowane za każdym razem, gdy kontrolki przechodzą do określonego stanu, lub ograniczyć przejścia do określonych par stanów. Jest to bardzo przydatna funkcja. Najprostsze przejścia korzystają z istniejących wartości serii ujęć i tworzą pośrednie animacje pomię dzy tymi wartościami. Wystarczy tylko określić czas trwania, a Visual State Manager zajmie się resztą. Można również tworzyć własne serie ujęć dla przejść. Visual State Manager zatrzyma serie ujęć dla przej ścia natychmiast po przejściu kontrolki do nowego stanu. Seria ujęć dla przejścia nie jest zatrzymywana do momentu zmiany stanu.
Układy i widoki
101
Semantyczne powiększanie Główny ekran przykładowej aplikacji organizuje wszystkie elementy w grupach. Możesz zauważyć, że niektóre listy zawierają dużo elementów, które mogą obejmować kilka grup. Choć wbudowane kontro lki są zaprojektowane tak, aby prawidłowo działać przy dużej ilości danych, dla użytkownika przewijanie listy od początku do końca może być nużące. Aby rozwiązać ten problem, można korzystać z koncepcji nazywanej
semantycznym powiększaniem.
Powiększanie semantyczne jest techniką pozwalającą użytkownikowi na zmniejszenie powiększenia widoku listy i nawigowanie w niej na wyższym poziomie za pomocą dostarczonego interfejsu. Nie jest to mechanizm powiększania wizualnego, ponieważ po zmniejszeniu powiększenia zmienia się interfejs. Jeżeli w przykładzie Windows8Application zmniejszymy powiększenie początkowego widoku przez dotknięcie powierzchni tabletu dwoma palcami i ich odsunięcie od siebie lub przez przytrzymanie kla wisza
Ctrl i pokręcenie kółkiem myszy bądź naciśnięcie klawiszy
+
albo - , to zauważysz, że cała siatka
przekształci się w zbiór tytułów z nazwami grup. Nowy widok pojawi się, gdy zmniejszysz powiększenie, a przy zwiększeniu powiększenia zniknie i zo stanie zastąpiony przez szczegółową siatkę. Widok pomniejszony jest pokazany na rysunku 4.4. W wido ku tym w sposób czytelny jest prezentowana lista dostępnych grup. Jeżeli stukniesz jedną z grup, automa tycznie zostanie wyświetlona jej zawartość.
Rysunek 4.4.
Widok pomniejszony
Jest to zaawansowana funkcja, która może być zaimplementowana na wiele sposobów. Aplikacja czytnika może pokazywać nazwy strumieni i umożliwiać użytkownikowi powiększenie widoku i wejście w szczegóły. Aplikacja, która zarządza listami kontaktowymi, może pokazywać pierwszą literę nazwiska, pozwalając na szybkie przejście do sekcji z nazwiskami, w której znajduje się właśnie poszukiwany kon takt. Technicznie rzecz biorąc, udostępniamy dwa różne widoki bazujące na poziomie szczegółowości wybranej przez użytkownika. Powiększanie semantyczne implementujemy za pomocą kontrolki Semanti cZoom. Otwórz plik Grouped ItemsPage.xaml z aplikacji Windows8Application. Odszukaj kontrolkę Semanti cZoom. Typowym widokiem, który użytkownik wykorzystuje do nawigowania w aplikacji, jest Semanti cZoom.ZoomedinVi ew. W tym przy kładzie użyłem domyślnego szablonu, dodałem kontrolkę Semanti cZoom i przesunąłem GridView do sek cji Zoomed I nView. Gdy użytkownik zmniejszy powiększenie, widok zostanie przełączony na Semanti cZoom.
•
102
Rozdział 4. Aplikacje Windows 8
ZoomedOutVi ew. Dla tego widoku utworzyłem zbiór kafelków, bazując na demonstracji opublikowanej przez
Microsoft na stronie http://msdn.microsoft.com!en-us!library!windows!apps!xaml!hh781234.aspx. Możesz również pobrać przykład użycia kontrolki Semanti cZoom z witryny przykładów Windows 8 SD K dostępnych pod adresem http://code.msdn.microsoft.com!windowsapps!GroupedGridView-77c59e8e. Musiałem jedynie zmienić definicję, aby zawierała tytuł grupy. Definicję kafelków znajdziesz w pliku słownika MyStyles.xaml. Użyłem również zdarzenia OnNavi gatedTo w celu dowiązania źródła danych dla Gri dVi ew. Zajrzyj do pliku kodu ukryteg o o nazwie GroupeditemsPage.xaml.cs, w którym znajduje się
poniższa metoda: protected override void OnNavigatedTo(NavigationEventArgs e)
{ this.DefaultViewModel ["Groups"] this.groupGridView.ItemsSource
=
e.Parameter;
=
this.groupeditemsViewSource.View.CollectionGroups; base.OnNavigatedTo(e);
W kodzie tym po prostu pobieramy zbiór g rup z właściwości Collecti on Vi ewSource zdefiniowanej w XAML, a następnie używamy tej wartości do ustawienia źródła dla Gri dVi ew w ZoomedOutVi ew. To wszystko, czeg o potrzebujemy do użycia kontrolki. Sama kontrolka obsługuje gest użytkownika „szczy panie w celu zmiany powiększenia" (możesz również przytrzymać klawisz Ctrl i pokręcić kółkiem myszy lub nacisnąć klawisz+ lub-) i przełącza aplikację między widokami. Gdy użytkownik stuknie określony element w widoku ZoomedOutVi ew, kontrolka automatycznie przełączy się do widoku ZoomedinVi ew z wy braną bieżącą grupą. Microsoft udostępnił następujące wskazówki dotyczące kontrolki Semanti cZoom: •
korzystaj z właściweg o rozmiaru dotykanego interaktywneg o elementu (więcej informacji na temat elementów docelowych dla zdarzeń dotknięcia znajduje się w następnym podrozdziale),
•
zapewnij odpowiedni i intuicyjny region dla powiększania,
•
używaj odpowiedniego kontekstu dla widoku, na przykład:
ł korzystaj z nazw grup dla elementów w grupowanych kolekcjach, ł korzystaj z uporządkowania w niepogrupowanych kolekcjach, ł korzystaj ze stron w celu reprezentowania kolekcji dokumentów, •
ograniczaj liczbę stron lub ekranów w widoku pomniejszonym, aby użytkownik był w stanie szybko przejść do właściwych danych,
•
upewnij się, że kierunek przesuwania jest taki sam w obu poziomach powiększenia,
•
nie używaj zmiany powiększenia do modyfikowania zakresu zawartości (na przykład pokazując jeden zbiór elementów widoku powiększonym, a inny w widoku pomniejszonym),
•
nie ustawiaj krawędzi w kontrolkach podrzędnych - jeżeli potrzebujesz krawędzi, ustaw ją w samej kontrolce Semanti cZoom.
Zapoznaj się z pełnym tekstem zaleceń, które znajdują się pod adresem http://msdn.microsoft.com/
en-us!library!windows!apps!hh465319.aspx. Kontrolki Semanti cZoom oraz Gri dVi ew świetnie obsługują interakcję z użytkownikiem bez konieczności wprowadzania przez nas zmian. Często jednak zdarza się, że przy tworzeniu własnych kontrolek Ul mu simy samodzielnie obsłużyć zdarzenia wejściowe. Trzeba więc wiedzieć, w jaki sposób aplikacje Windows 8 obsługują różne zdarzenia wejściowe oraz jakiego działania możemy się spodziewać po tych zdarzeniach. Więcej informacji na temat obsługi zdarzeń użytkownika przedstawię w następnym podrozdziale.
Obsługa zdarzeń użytkownika
103
Obsługa zdarzeń użytkownika Zdarzenia użytkownika są ważnymi elementami aplikacji WinRT. Windows 8 zapewnia natywną obsługę ekranów dotykowych, jak również wspiera wiele metod wprowadzania danych. Natywna obsługa ekra nów dotykowych oznacza, że aplikacje są zaprojektowane w taki sposób, aby w pełni wykorzystać dotyk, i nie zawierają elementów, do których obsługi są wymagane mysz, klawiatura lub inne urządzenia. Po dejście dotykowe różni się od tradycyjnych metod wprowadzania danych. Windows 8 obsługuje jednoczesne dotknięcia, więc musisz być w stanie odpowiedzieć jednocześnie na kilka punktów kontaktu z ekranem. Aplikacja musi odpowiadać na manipulacje oraz być zaprojekto wana w taki sposób, aby punkty lub obszary docelowe reagowały na dotknięcia, które nie są tak precyzyjne jak wskaźnik myszy. W przypadku obsługi palcem występuje znacznie większy margines błędu, ponieważ rozmiar opuszka palca jest znacznie większy niż rozmiar tradycyjnego wskaźnika myszy. Dotyk pozwala użytkownikowi na interakcję z urządzeniem na kilka sposobów. W tabeli 4.1 wymie nione są często stosowane interakcje oraz sposoby ich wywołania. Tabela 4.1. Interakcje d oty k owe
Interakcja
Opis
Stuknięcie
Jeden palec szybko dotyka ekranu i jest natychmiast podniesiony.
Przytrzymanie
Jeden palec dotyka ekranu i pozostaje na nim.
Przeciągnięcie
Przynajmniej jeden palec dotyka ekranu, a następnie przesuwa się w tym samym kierunku, utrzymując kontakt.
Szczypanie
Przynajmniej dwa palce dotykają ekranu, a następnie przesuwają się, zbliżając lub oddalając, utrzymując przy tym kontakt z ekranem.
Obrót
Przynajmniej dwa palce dotykają ekranu, a następnie obracają się wokół wspólnego punktu, utrzymując przy tym kontakt z ekranem.
Przesuwanie
Jeden palec dotyka obiektu, a następnie przeciąga go prostopadle do kierunku przewijania (na przykład w siatce, którą można przewijać na boki, przesuwanie wymaga przeciągnięcia elementu w górę lub w dół).
Możesz zauważyć, że wiele z kontrolek Windows 8 ma wbudowane wsparcie dla standardowych in terakcji. Choć Windows 8 zapewnia natywną obsługę dla dotyku, równie ważna jest obsługa innych me tod wprowadzania danych, w tym piórka, myszy i klawiatury. W tabeli 4.2 wymienione są niektóre akcje oraz sposoby ich wywołania z użyciem innych metod wprowadzania danych. Jednym z ułatwień obsługi zdarzeń z wielu urządzeń wejściowych przez platformę Windows 8 jest uznanie, że zdarzenia wskaźników są niezależne od urządzenia. Zdarzenia wskaźników są generowane w odpowiedzi na dotknięcie palcem, piórkiem, akcję myszy lub naciśnięcie klawisza. Aby zobaczyć przy kłady takich zdarzeń, otwórz aplikację Touch. Aplikacja ta demonstruje różne interakcje dotykowe.
Zdarzenia wskaźników Ekran przykładowej aplikacji jest podzielony na dwie kolumny. W lewej kolumnie jest umieszczona pro sta lista, w której wyświetlane są zdarzenia dotykowe w kolejności występowania. W prawej kolumnie znajduje się grafika zawierająca figury, obrazy oraz symbol czcionki. Siatka z grafiką jest skonfigurowana tak, aby odpowiadać na różne manipulacje dotykiem, więc możesz szczypać, powiększać, obracać i prze suwać grafiki.
•
104
Rozdział 4. Aplikacje Windows 8
Tabela 4.2. Tryby wprowadzania danych Akcja
Dotyk lub piórko
Mysz
Zmiana fokusu
Brak odpowiednika
Brak odpowiednika
Klawiatura Klawisz Tab lub klawisze strzałek
Menu kontekstowe
Przyciśnięcie i przytrzymanie
Kliknięcie prawym
Przycisk Menu
przyciskiem Przeciągnij i upuść
Przesuwanie poza brzeg
Kliknięcie i przeciągnięcie
wiersza (kolumny) elementu Wywołanie
Stuknięcie
Obrót
Obrót dotykiem
Ctrl+C (kopiuj) i Ctrl+ V (wklej)
Kliknięcie
Klawisz Enter
Musi być obsługiwany
Ctrl+. i Ctrl+,
ręcznie - na przykład za pomocą przycisku obrotu Przeciągnięcie
Przewijanie
Kliknięcie paska przewijania
Klawisze ze strzałkami
lub użycie kółka myszy Szybkie przewijanie
Szybkie przeciąganie
Kliknięcie znacznika paska
P a ge Up i P a ge Down
przewijania Wybór
Przesuwanie
Kliknięcie prawym
Spacja
przyciskiem myszy Dymek
Przyciśnięcie i przytrzymanie
Szczypanie
Powiększanie
Umieszczenie wskaźnika
Zmiana fokusu
myszy na elemencie
i odczekanie
Ctrl+kółko myszy
Ctrl+ i Ctrl-
Skompiluj, zainstaluj i uruchom aplikację. Możesz również skorzystać z symulatora i poeksperymen tować z różnymi typami interakcji, w tym z dotykiem. Powinieneś szybko zauważyć, że występuje kilka zdarzeń, które są generowane niezależnie od sposobu wprowadzania danych: • •
Stuknięcie
-
generowane po dotknięciu palcem, dotknięciu piórkiem lub kliknięciu myszą.
Dwukrotne stuknięcie
-
generowane po dwukrotnym stuknięciu palcem lub piórkiem
bądź po dwukrotnym kliknięciu myszą. •
Naciśnięcie wskafoika - generowane po dotknięciu palcem, dotknięciu piórkiem lub
kliknięciu myszą. •
Przesunięcie wskaźnika
-
generowane po przesunięciu palca lub piórka po ekranie bądź
wskaźnika myszy przy wciśniętym jej lewym przycisku. •
Zwolnienie wskaźnika
-
generowane w momencie podniesienia palca lub piórka albo po
zwolnieniu lewego przycisku myszy. Zdarzenia te obejmują znaczną większość interakcji z użytkownikami poza przewijaniem i nawigacją. Jeżeli nasza aplikacja opiera się na tych bazowych zdarzeniach, możemy być pewni, że będzie w sposób spójny reagowała na działania użytkowników korzystających z różnych urządzeń wejściowych. Istnieje jednak kilka zdarzeń wskaźników, które nie mają sensu w przypadku interfejsu dotykowego. Zdarzenia Poi nterEntered oraz Poi nterExited są tworzone, gdy wskaźnik wejdzie w obszar generujący zdarzenie
oraz go opuści. Zarówno mysz, jak i piórko mogą korzystać z tego zdarzenia, ponieważ kursor jest stale śledzony, nawet jeżeli nie jest wykonywana inna akcja (czyli ani nie zostanie naciśnięty przycisk myszy, ani piórko nie dotknie powierzchni ekranu). Nie istnieją odpowiedniki uruchamiane dotykiem, ponie waż zdarzenia dotykowe są generowane wyłącznie po kontakcie palca z ekranem.
Obsługa zdarzeń uży tkownika
105
Powinieneś pamiętać o zasadzie pierwszeństwa dotyku. Jeżeli projektujesz ważną funkcję aplikacji, która bazuje na zdarzeniach generowanych wyłącznie za pomocą myszy lub piórka, tracisz możliwość korzystania z niej na urządzeniach dotykowych. Każdy typ interakcji, który jest specyficzny dla określo nej formy wprowadzania danych, powinien zapewniać alternatywny typ interakcji realizowany za po mocą innych urządzeń. Przykłady przedstawię w następnym punkcie, dotyczącym zdarzeń manipulacji.
Zdarzenia manipulacji Manipulacja to zdarzenie dotknięcia, w którym bierze udział przynajmniej jeden palec. Zaczyna się w mo mencie pierwszego kontaktu i kończy się zwolnieniem ostatniego kontaktu. Najprostszą formą manipu lacji jest stuknięcie, które składa się z dotknięcia, krótkiego przytrzymania i zwolnienia. Przesunięcie jest bardziej złożoną manipulacją, ponieważ w jej skład wchodzi dotknięcie, przeciągnięcie lub przesunięcie w kierunku przewijania, a następnie zwolnienie. Szczypanie w celu zmiany powiększenia jest jeszcze bar dziej złożoną manipulacją, w której zmienia się odległość pomiędzy wieloma punktami dotknięcia. Manipulacje muszą uwzględniać inercję. Aby dotknięcia były intuicyjne, powinny uwzględniać szyb kość działań użytkownika. Na przykład powolne przesuwanie palca pozwala powoli przesuwać listę. Jeżeli użytkownik zacznie szybko przesuwać palec, można założyć, że próbuje przewinąć szybko dużą ilość danych. Inercja przesuwania powinna umożliwiać przewijanie listy nawet po podniesieniu palca przez użytkownika, podobnie jak w przypadku obracania kółkiem myszy. Manipulacje mogą spowodować przetworzenie dużej ilości danych w krótkim okresie, więc nie są domyślnie dostępne. Aby włączyć śledzenie manipulacji w kontrolce, należy ustawić właściwość Mani pu lationMode. W pliku MainPage.xaml ustawiłem ją na A11 w elemencie o nazwie TouchGrid. Możliwe war
tości są opisane poprzez typ wyliczeniowy Mani pulationModes. Lista trybów oraz ich znaczenie znajdują się w tabeli 4.3. Tabela 4.3. Wartości ManipulationModes Wartości ManipulationModes
Opis
N one
Blokuje monitorowanie zdarzeń manipulacji.
TranslateX
Pozwala na zdarzenia manipulacji odnoszące się do osi poziomej.
TranslateY
Pozwala na zdarzenia manipulacji odnoszące się do osi pionowej.
TranslateRailsX
Pozwala na manipulację poziomą z użyciem trybu szyny.
TranslateRailsY
Pozwala na manipulację pionową z uży ciem trybu szyny.
Rotate
Pozwala na manipulacje powodujące obrót.
Scale
Pozwala na manipulacje zmieniające skalę elementu docelowego.
Translatelnertia
Pozwala na inercję w manipulacjach dotyczących przesunięć.
Rotatelnertia
Pozwala na inercję w manipulacjach dotyczących obrotów.
Scalelnertia
Pozwala na inercję w manipulacjach dotyczących skalowania.
All
Pozwala na wszystkie tryby manipulacji i inercji.
System
Zarezerwowane.
106
•
Rozdział 4.
Aplikacje Windows 8
Tryb szyny odnosi się do optymalizacji usprawniającej przesuwanie zawartości w wielu kierunkach. Zamiast dokładnie podążać za kierunkiem przesuwania się palca użytkownika przy przesuwaniu w pio nie lub w poziomie, co może powodować pewne „dryfowanie" w kierunku poprzecznym do właściwego ruchu, umieszczenie palca w zdefiniowanym obszarze, nazywanym szyną, pozwala zablokować jeden kierunek przewijania. Każdy ruch wykonany w tym obszarze będzie powodował dokładnie poziome lub pionowe przewijanie, natomiast ruch poza strefą umożliwi przewijanie we wszystkich kierunkach. Więcej informacji na temat szyn można znaleźć pod adresem http://msdn.microsoft.com!en-us!library!windows!
apps!hh46531 O.aspx. Aby ustawić wybrany tryb manipulacji w XAML, wystarczy zdefiniować go w elemencie w sposób przedstawiony w przykładzie. Jeżeli chcesz połączyć kilka manipulacji, odpowiednią wartość musisz usta wić programowo. Poniższy przykład łączy tryb skalowania i obrotów, ale bez włączania inercji: TouchGrid.ManipulationMode = ManipulationModes.Rotate
I
ManipulationModes.Scale;
Można również obsługiwać manipulacje za pomocą zdarzenia Manipul ateDelta. Zdarzenie to jest wywoływane w czasie manipulacji i informuje Cię o wartościach kilku punktów danych. Można w ten sposób śledzić zmiany skalowania, obrotu i przesunięcia, zarówno przy użyciu wartości kumulatywnych (od początku manipulacji), jak i przyrostów (od ostatniego zdarzenia manipulacji). W tym przykładzie element Grid ma ustawioną transformację CompositeTransform. Jest to transformacja pozwalająca na skalowanie, obroty i przesunięcia. Skala i przesunięcie są stosowane przyrostowa w czasie manipulacji, natomiast obrót bazuje na wartości sumarycznej: Transformation.ScaleX *= e.Delta.Scale; Transformation.ScaleY *= e.Delta.Scale; Transformation.TranslateX += e.Delta.Translation.X; Transformation.TranslateY += e.Delta.Translation.Y; Transformation.Rotation += e.Delta.Rotation;
Przykład ten jest prosty, ponieważ jedynie dodaje manipulacje bezpośrednio do obiektu siatki. Mo żesz zauważyć, że kontrolka odpowiada całkiem nieźle na obracanie, szczypanie i powiększanie, jak rów nież na przesuwanie. Obsługuje też inercję. Jeżeli przesuniesz palec w jednym kierunku z dużą prędko ścią, grafika „wyfrunie" z widocznego obszaru. Aby przywrócić początkowe wartości w siatce, wystarczy dwukrotnie stuknąć ekran. Procedura obsługi zdarzenia wyczyści wszystkie manipulacje: Transformation.ScaleX = 1.0; Transformation.ScaleY = 1.0; Transformation.TranslateX =O; Transformation.TranslateY =O; Transformation.Rotation =O;
Możesz korzystać z danych manipulacji do przeprowadzania dowolnych operacji w aplikacji - ma nipulując obiektami na ekranie albo wykonując inne funkcje. Ważne jest, aby zapewnić analogiczne funk cje dla innych rodzajów wprowadzania danych. Na przykład częstym sposobem na obsługę szczypania i powiększania z wykorzystaniem myszy jest użycie jej kółka; w przypadku klawiatury można nacisnąć
Ctrl i klawisze+ lub-.
Obsługa myszy Obsługa myszy w tym przykładzie jest zaimplementowana za pomocą zdarzenia PointerWheelChanged. Jest to inne „abstrakcyjne" zdarzenie, choć najprawdopodobniej będzie ono generowane kółkiem my szy. W rzeczywistości właściwość, jaką weryfikujemy w celu sprawdzenia kierunku obrotu kółka, posia-
Obsługa zdarzeń użytkownika
107
da w nazwie mouse. Spójrz na procedurę obsługi zdarzenia TouchGri d_Poi nterWheelChanged_ 1 w pliku MainPage.xaml.cs i zauważ, że kod weryfikuje właściwość MouseWheelDelta w celu sprawdzenia, czy skala jest zwiększana, czy zmniejszana: var factor
=
e.GetCurrentPoint((UIElement)sender)
.Properties.MouseWheelDelta
? 0.1 : -0.1;
Transformation.ScaleX
+=
factor;
Transformation.ScaleY
+=
factor;
>
O
Jeżeli korzystasz z myszy lub program działa w symulatorze, możesz zauważyć, że obracanie kółkiem daje te same efekty co szczypanie i powiększanie. Aby zachować spójność z kontrolką Semant i cZoom, mo żesz zaimplementować ten efekt wyłącznie w przypadku naciśnięcia przez użytkownika klawisza
Ctrl.
Oczywiście, ważne jest również, aby zapewnić obsługę klawiatury. W następnym punkcie przedstawię sposób realizacji tej samej akcji (szczypanie i powiększanie) za pomocą klawiatury.
Obsługa klawiatury Obsługa klawiatury jest realizowana za pośrednictwem zdarzeń KeyDown oraz KeyUp. W danym momen cie może być naciśnięte wiele klawiszy, więc kombinacja zdarzeń pozwala nam śledzić dowolne, ważne dla nas kombinacje. W przykładzie
Touch,
możemy skalować grafikę po przytrzymaniu klawisza
Ctrl
i naciśnięciu +lub-.
WSKAZÓWKA Aby zdarzenia klawiszy działały, kontrolka, do której te zdarzenia są podłączone, musi posiadać fo kus. Realizuje się to zwykle przez kliknięcie elementu lub przejście do niego za pomocą wskaźnika, klawisza
Tab
lub klawiszy ze strzałkami. Fokus nie jest ustawiany automatycznie. Ponieważ element
Gri d nie pozwala na programowe ustawienie fokusu, zdarzenia obsługi klawiszy zostały w tym przy
kładzie umieszczone w kontrolce Li stBox. Aby podłączyć zdarzenia bezpośrednio do kontrolki Gri d, możesz utworzyć własną klasę Control lub UserControl, której głównym elementem jest Gri d. Kla sa Control posiada metodę Focus i pozwala na ustawienie fokusu w kodzie, dzięki czemu można obsługiwać zdarzenia naciśnięcia klawiszy. Z techniki tej możesz korzystać w przypadku każdej kon trolki bazowej, która nie obsługuje ustawiania fokusu.
Pierwszym krokiem jest poczekanie na załadowanie kontrolki Li stBox i ustawienie fokusu, dzięki czemu może ona zacząć obsługiwać zdarzenia klawiatury: private void Eventlist- Loaded- l(object sender,
{
RoutedEventArgs e)
Eventlist.Focus(FocusState.Programmatic);
Następnie sprawdzamy stan klawisza
Ctrl.
Gdy klawisz ten zostanie naciśnięty, wewnątrz procedury
obsługi zdarzenia KeyDown ustawiamy znacznik: if (e.Key.Equals(VirtualKey.Control) && !_isCtrlKeyPressed)
{
isCtrlKeyPressed
=
true;
AddWithFocus("Naciśnięty klawisz Ctrl.");
•
108
Rozdział 4. Aplikacje Windows 8
Po zwolnieniu klawisza kasujemy znacznik: private void Eventlist_KeyUp_l(object sender, KeyEventArgs e)
{ if (e.Key.Equals(VirtualKey.Control))
{
_isCtrlKeyPressed = false; AddWithFocus("Zwolniony klawisz Ctrl.");
Na koniec, jeżeli klawisz+ lub - został wciśnięty razem z Ctrl, odpowiednio zmieniamy skalę. Kod procedury obsługi zdarzenia
KeyDown
jest przedstawiony na listingu 4.2.
Listing 4.2. Procedura obsługi zdarzeń do obsługi klawiatury private void Eventlist_KeyDown_l(object sender, KeyEventArgs e)
{
if (e.Key.Equals(VirtualKey.Control) && !_isCtrlKeyPressed)
{
_isCtrlKeyPressed = true; AddWithFocus("Naciśnięty klawisz Ctrl.");
else if (_isCtrlKeyPressed)
{
var factor = Od; if (e.Key.Equals(VirtualKey.Add))
{
factor = 0.1;
else if (e.Key.Equals(VirtualKey.Subtract))
{
factor = -0.1;
Transformation.ScaleX += factor; Transformation.ScaleY += factor;
Aplikacja obsługuje teraz wszystkie trzy urządzenia wejściowe - ekran dotykowy, mysz i klawiaturę.
Efekty wizualne Microsoft zaleca, aby wszystkim interakcjom wykorzystującym dotyk towarzyszyły efekty wizualne. Po winny one informować użytkownika, w jaki sposób aplikacja powinna działać, i pomagać mu zidentyfiko wać elementy interfejsu, które reagują na interakcje. Wszystkie kontrolki wbudowane na platformie Win dows 8 obsługują takie efekty. Jeżeli budujesz własną kontrolkę, musisz samodzielnie zadbać o te efekty. Efekty wizualne związane z dotykiem powinny mieć następujące cechy: •
wszystkie kontrolki muszą mieć własne efekty,
•
nawet krótki kontrakt powinien generować efekt, dzięki czemu można sprawdzić, czy interfejs dotykowy działa prawidłowo, aby pokazać, że cel nie został trafiony i że element nie odpowiada na dotknięcia,
Obsługa zdarzeń użytkownika
•
efekt powinien być uruchamiany natychmiast,
•
efekt powinien być ograniczony do dotkniętej kontrolki lub elementu,
•
efekt nie powinien przeszkadzać użytkownikowi w wykonaniu akcji,
•
przesuwanie i przeciąganie nie powinno generować efektów,
•
w czasie manipulacji cel powinien podążać za miejscem kontaktu,
•
109
jeżeli cel nie jest przesuwany, punkt dotknięcia powinien być połączony z celem linią przerywaną, aby wskazać, że manipulacja jest z nim związana.
Gdy użytkownik dotknie i przytrzyma element Ul, powinna być wyświetlona informacja konteksto wa, zależna od czasu przytrzymania. Krótkie dotknięcie, które trwa mniej niż 200 milisekund, powinno powodować wyświetlenie prostego dymku podpowiedzi z wyjaśnieniem akcji. Jeżeli przytrzymanie trwa około 2 sekund, należy wyświetlić okno lub szczegółową listę dostępnych poleceń. Aby zobaczyć przykład interakcji, stuknij i przytrzymaj dowolny element z menu
Start. Niektóre ele
menty mają dymki podpowiedzi, które zawierają szczegółowy opis kafelka. Zauważ również, że kafelek nieco się przesunął i wyświetlił znacznik. Akcja ta ma na celu pokazanie sposobu zaznaczenia pliku. Jest to demonstracja akcji przesunięcia. Teraz dotknij kafelek, ale zamiast go przytrzymać, powoli przesuń go w dół (jest to właściwy kieru nek przesuwania dla menu
Start). Zostanie wyświetlony szary znacznik. Po przesunięciu kafelka nieco
dalej znacznik zostanie wyróżniony. Gdy puścisz kafelek, pozostanie on zaznaczony. Powtórz tę akcję dla niewybranego kafelka. W taki sposób używamy przesuwania do zaznaczania, a sama kontrolka udo stępnia wizualne efekty zależne od czasu naciśnięcia. Może również rozpocząć przeciąganie kafelka w dół, a następnie przesunąć go z powrotem do początkowej pozycji, aby anulować akcję. Na koniec dotknij kafelek i przeciągnij go w dół - tym razem kontynuuj przeciąganie po zaznacze niu znacznika. W końcu przekroczysz punkt graniczny. W tym momencie kafelek przyklei się do palca, menu
Start nieco się zmniejszy, a pozostałe kafelki się rozsuną. Jest to tryb, za pomocą którego można
przesunąć kafelek w inne miejsce menu
Kafelek 1.
Start. Interakcje te są przedstawione na rysunku 4.5.
Kafelek 2.
Kafelek 3.
Strefa przesuwania
Kafelek4.
Kafelek 5.
Strefa przeciągania
Rysunek4.5. Przesuwanie i przeciąganie
11 O
•
Aplikacje Windows 8
Rozdział 4.
W tym przykładzie kafelek 4. został zaznaczony. Kafelek 5. jest przeciągany. Ponieważ nie został prze
kroczony punkt graniczny i kafelek jest przesuwany tylko w pionie, jako podpowiedź akcji zaznaczania wyświetlony jest znacznik. Jeżeli kafelek będzie przesunięty z powrotem, zostanie przyciągnięty do swo jego miejsca bez wykonywania zaznaczania. Kafelek 6. został przeciągnięty poza punkt końcowy i może być teraz przesuwany we wszystkich kierunkach.
Celowanie Celowanie odnosi się do budowania elementów Ul w taki sposób, aby zmaksymalizować interakcje do tykowe. Tworzenie odpowiednich celów wymaga spełnienia kilku warunków. Otóż cele muszą być wy starczająco duże, by można było łatwo w nie trafić. Zbyt małe cele są trudne do zaznaczenia i zwiększają możliwość popełnienia błędu przez użytkownika (co zwiększa jego frustrację). Zgodnie z opublikowa nymi wskazówkami krótszy bok celu musi mieć co najmniej 9 mm (48 pikseli na wyświetlaczu 135 ppi), a pomiędzy celami musi znajdować się odstęp co najmniej 2 mm (około 10 pikseli). Jeżeli cel zostanie przeciągnięty na odległość 2,7 mm (około 14 pikseli), to taka integracja powinna być traktowana jak stuknięcie. Przesunięcie na większą odległość powinno być traktowane jako przecią gnięcie. Jeżeli obsługujesz akcję przesunięcia, to zaczyna się ona po przekroczeniu punktu granicznego. Zaznaczenie zmieni się na przeciągnięcie w momencie, gdy użytkownik przesunie element o 11 milime trów (około 60 pikseli). Oprócz celu wizualnego, który jest elementem widocznym na ekranie, występuje również cel aktual ny, który reprezentuje obszar wokół elementu nadal odpowiadającego na dotknięcie. Zalecane jest, aby cel wizualny miał wielkość około 60% celu aktualnego. Cel aktualny może również posiadać podpowie dzi wizualne. Aby zobaczyć ich działanie, otwórz menu Start i przyjrzyj się informacjom o koncie. Przy kład jest przedstawiony na rysunku 4.6.
Rysunek4.6.
Informacje o koncie
Rysunek oraz tekst zapewniają podpowiedź wizualną. Kliknij teraz wewnątrz prostokąta, który obej muje tekst oraz rysunek. Dane konta zostaną rozjaśnione i pojawi się cel aktualny, który można kliknąć, aby otworzyć menu kontekstowe dla konta. Jest to pokazane na rysunku 4.7.
Rysunek4.7.
Dane konta z wyróżnionym celem aktualnym
Obsługa zdarzeń użytkownika
111
Innym ważnym aspektem celowania jest zminimalizowanie ryzyka wystąpienia błędów krytycznych. Elementy, których działanie powoduje poważne konsekwencje, powinny być zgrupowane i umieszczone daleko od pozostałych, często używanych elementów, dzięki czemu można uniknąć ich przypadkowej aktywacji. Jeżeli program na przykład zawiera ikony dodawania, edytowania i usuwania, powinieneś roz ważyć zgrupowanie ikon dodawania i edycji i umieszczenie ikony usunięcia w dużej odległości od nich, dzięki czemu zmniejsza się prawdopodobieństwo przypadkowego jej stuknięcia.
Men u kontekstowe Menu kontekstowe są krótkimi menu zawierającymi polecenia schowka (wycinanie, kopiowanie i wkle janie) lub własne polecenia, zazwyczaj wykonywane na wybranym obiekcie. W menu kontekstowym znaj duje się mała liczba poleceń - nie więcej niż pięć. Wytyczne Microsoftu dla menu kontekstowych są do stępne w internecie pod adresem http://msdn.microsoft.com!en-us!library!windows!apps!hh465308.aspx. Znajdziesz tam zalecenia dotyczące długości nazw poleceń (powinny być krótkie) i separatorów po między powiązanymi poleceniami. Polecenia powinny być właściwe dla kontekstu i powinny być upo rządkowane tak, aby najważniejsze znajdowały się na dole menu. Jeżeli tworzysz menu kontekstowe z po leceniami schowka, zawsze powinny mieć następujące teksty i kolejność: •
Wytnij
•
Kopiuj
•
Wklej
Menu kontekstowe powinno być umieszczane blisko obiektu, którego dotyczy, i powinno być wy woływane przez stuknięcie i przytrzymanie tego obiektu. W przykładowej aplikacji Touch menu kontek stowe jest podłączone do kontrolki
Li st Box ,
w której znajdują się zdarzenia dotknięcia. Jest ono wywo
ływane za pomocą zdarzenia Doubl eTapped. Procedura obsługi zdarzenia zawiera krótki blok kodu tworzący obiekt PopupMenu, dodaje polecenie, a następnie oczekuje na odpowiedź. Możliwe jest również tworzenie menu kontekstowego w XAML z wykorzystaniem właściwości Button. ContextMenu. Zawiera ona element ContextMenu z listą kontrolek MenuItem. Użytkownik może ukryć menu przez wybranie polecenia lub usunięcie z niego fokusu (na przy
kład przez stuknięcie innego obszaru aplikacji): var contextMenu = new PopupMenu(); contextMenu.Commands.Add(new UICommand("Wyczyść listę", args => _events.Clear())); var dismissed = await contextMenu.ShowAsync( e.GetPosition(Eventlist));
Obiekt UICommand oczekuje krótkiej nazwy dla polecenia oraz delegatu wywoływanego po wybraniu polecenia. Możesz oddzielać polecenia, dodając do ich listy obiekty klasy UICommandSeparator: contextMenu.Commands.Add(new UICommandSeparator());
Polecenia są wyświetlane w kolejności, w jakiej zostały dodane. Przyczynę zamknięcia menu można sprawdzić, odczytując wartość zwracaną przez metodę ShowAsync. Niektóre kontrolki automatycznie do starczają menu kontekstowe. Na przykład zaznaczenie tekstu powoduje udostępnienie poleceń do wyci nania, kopiowania i wklejania. Twoja aplikacja najprawdopodobniej będzie potrzebowała wielu poleceń, które nie pasują do ograniczonych zaleceń dla menu kontekstowego. Polecenia te najlepiej udostępnić za pomocą paska aplikacji.
112
•
Rozdział 4.
Aplikacje Windows 8
Pasek aplikacji Pasek aplikacji jest kontrolką pozwalającą na wyświetlanie poleceń na żądanie użytkownika. Nie jest on domyślnie widoczny i użytkownik musi przeciągnąć palcem od górnej lub dolnej krawędzi ekranu bądź kliknąć prawym przyciskiem myszy, aby go wyświetlić. Możliwe jest również jego programowe wyświe tlenie. Pasek aplikacji zawiera polecenia kontekstowe - mogą to być polecenia globalne, takie jak powrót do strony głównej, lub polecenia specyficzne dla wybranych elementów. W przykładzie Windows8Application wspólny obiekt UserControl pozwala utworzyć funkcję paska aplikacji. Zapewnia to centralną lokalizację dla funkcji oraz zapobiega powielaniu kodu i XAML (jeżeli chcesz, możesz umieścić inny pasek aplikacji na każdej stronie). Pasek aplikacji możesz umieścić na górze, na dole lub zarówno na górze, jak i na dole strony. Gdy użytkownik przesunie palec po raz drugi bądź wywoła akcję, pasek aplikacji zostanie automatycznie ukryty. Pasek ten jest implementowany za pomocą kontrolki AppBar. Na rysunku 4.8 pokazany jest pasek aplikacji dla głównej strony przed wyborem którejkolwiek po zycji. Akcje Dodaj i Wróć są wyłączone, ponieważ nie ma wybranej grupy i jest już wyświetlona strona główna. Pasek aplikacji jest zdefiniowany z wykorzystaniem elementu Page. BottomAppBar (możesz użyć również elementu Page. TopAppBar, jeżeli polecenia mają pojawiać się na górze strony).
Rysunek 4.8.
Pasek aplikacji z wyłączonymi poleceniami
Każdy element paska aplikacji musi zawierać kontrolkę AppBar, w której będzie się znajdował XAML z naszymi poleceniami. Poniżej zamieszczona jest definicja z GrouppeditemsPage.xaml:
< /AppBar>
W XAML znajduje się odwołanie do kontrolki UserControl. Aby zobaczyć definicję układu dla paska nawigacji, otwórz plik ApplicationCommands.xaml. W edytorze zostaną wyświetlone polecenia umieszczo ne na jasnoszarym tle. Polecenie Usuń jest realizowane przez przycisk po lewej stronie, a polecenia Dodaj i Wróć znajdują się z prawej strony. Są one umieszczone w kontrolce Gri d, aby zapewnić właściwy układ.
Pasek aplikacji
113
Zauważ, że polecenia są definiowane z użyciem statycznego zasobu:
Zasób ten jest zdefiniowany w pliku Common!StandardStyles.xaml, który jest generowany przez sza blon projektu. Style te zawierają najbardziej podstawowe polecenia. Każdy styl posiada domyślną ikonę i opis. Na przykład poniższy XAML definiuje polecenie uruchamiające pomoc (wszystkie style są prze znaczone dla kontrolki
Button
i bazują na zasobie AppBarButtonStyl e):
Jeżeli nie widzisz stylu odpowiadającego Twoim potrzebom, możesz po prostu utworzyć nowy za sób. Nie jest zalecane modyfikowanie zasobów w pliku StandardStyles.xaml, o ile nie wiesz dokładnie, co robisz, ponieważ może to spowodować błędne działanie aplikacji. Najbezpieczniej jest dodać nowy słownik z nowymi stylami i odwołać się do niego w pliku App.xaml (patrz MyStyles.xaml). Załóżmy, że budujesz aplikację wyświetlającą nowe artykuły i chcesz udostępnić polecenie do zmiany wielkości czcionki. Na początek zdefiniuj styl dla nowego polecenia:
Możesz ustawić właściwość automatyczną (jest to jednoznaczny identyfikator pomagający w auto matyzacji Ul, używany przy testowaniu i zapewnieniu dostępności) oraz nazwę polecenia:
Ostatnim krokiem jest lokalizacja ikony. Jeżeli masz umiejętności artystyczne lub masz projektanta w zespole, możesz wykonać ikonę we własnym zakresie. Jednak praktyczniejszym sposobem jest wyko rzystanie ikon dostarczanych w Windows 8 w formie czcionki Segoe Ul Symbol. Aby przejrzeć te sym bole, otwórz menu Start i wpisz
charmap.
W panelu wyników kliknij charmap.exe. Spowoduje to uru
chomienie narzędzia do przeglądania czcionek zainstalowanych w systemie. Wybierz czcionkę Segoe UJ
Symbol i przewiń niemal do końca. Zobaczysz tam kilka ikon. Na rysunku 4.9 przedstawiona jest ikona, która prawdopodobnie ma największy sens dla polecenia zmiany czcionki.
WSKAZÓWKA Jeżeli spojrzysz na kontrolkę paska aplikacji w edytorze, to zauważysz, że przyciski są wyświetlone jako duże prostokąty. Jest to domyślny widok kontrolki w edytorze. Możesz zmienić powierzchnię edytora za pomocą rozszerzenia
d:
w XAML. Jeżeli na przykład chcesz, aby kontrolka miała w edy
torze określoną szerokość, po deklaracji xml ns: d użyj
d: Des i gnWi dth=" 1024".
tor emulował tablet i korzystał z ustawień tabletu, dodaj deklarację
Jeżeli chcesz, aby edy
d: Extens i on Type=" Page".
Umoż
liwi to wybranie odpowiednich kontrolek i stanów wizualnych. Jest to mała sztuczka pozwalająca na poprawienie użyteczności funkcji projektowania.
114
•
Rozdział 4. Aplikacje Windows 8
- Cl -
Tablica znaków Czcig_nka:
I O Segoe Ul Symbol
���••m� /X ' (( � ( � " ( ./ (@> {!) @l(f}@@(D • f 11"• 'ó, Ó r;, '§ : 0-1 6 d i::. I ... .-1 „ 11 „ F.I X liii - + X .,/
x < > A
�
;:::; ':'-' T LiJ
.
„
C" ")
*
ł��*�o-=±BP?i©ną���* � � ��8 � �®* � ą 3 · �-� 9��� " ' t��� � � m �a��� a ��eov '" ill [;;j iiili) �I �== .: • :: D �:.J 'cl � !;;! • :� �>) .I'" ['.l
� 0 ff n� ���a�@ �- 1�� 1 IZ;,.J.! 1 AA ��� + � 9 � $omBY l �1 _ B ��� �
"'1::11�•1r;;:::::=�[t]::_;j( I
f.naki do skopio\l\1ania:
D Widok. zga_ "'1anso"'1any
I
l•ly!l_ierz
I
!0piuj
I U+E1 &5: Pnvate Use
Rysunek4.9. Sposób wyboru ikony za pomocą charmap.exe
Zanotuj kod wyświetlany w dolnej części okna. Możesz użyć tego kodu do ustawienia symbolu w stylu przez skopiowanie ciągu po znaku plusa
( + ):
Teraz masz styl, z którego możesz wszędzie korzystać. Kod dla kontrolki paska aplikacji obsługuje wyłączanie i włączanie ikon w zależności od bieżącego wyboru. Aby zobaczyć ten kod, możesz zajrzeć do pliku ApplicationCommands.xaml.cs. Na przykład po lecenie usuwania powinno być wyświetlane wyłącznie w przypadku, gdy jest zaznaczony element: var selected = App.Currentltem; Delete.Visibility = selected == null Visibility.Collapsed
?
: Visibility.Visible;
Przykład polecenia Usuń na pasku aplikacji jest zamieszczony na rysunku 4.10. Zwróć uwagę, że po lecenie
Dodaj zostało całkowicie usunięte, ponieważ nie ma sensu w kontekście pojedynczego elementu.
Rysunek4.1 O. Pasek aplikacji z włączonymi poleceniami
Pasek aplikacji
115
Implementacja polecenia Usuń jest nieco bardziej złożona. Aby uniemożliwić przypadkowe usunię cie elementu, wyświetlane jest okno potwierdzenia. Jeżeli jest wyświetlana strona szczegółów i użytkow nik potwierdzi akcję, kod spowoduje przejście do poprzedniej strony, ponieważ po wykonaniu operacji bieżący element przestanie istnieć. Okno dialogowe jest konfigurowane w następujący sposób: var msg = new Windows.UI.Popups.MessageDialog("Potwierdzenie usunięcia", string.Format("Czy na pewno chcesz usunąć element
11
{0}
"" ,
App.Currentltem.Title));
Przy tworzeniu polecenia OK podawany jest delegat, który pozwala na usunięcie bieżącego elementu z grupy, a następnie sprawdza, czy konieczne jest wyjście z bieżącej strony. Kod analizujący stronę znaj duje się w pliku App.xaml.cs: App.CurrentGroup.Items.Remove(App.Currentitem); if (App.NavigatedPage == typeof(ItemDetailPage))
{ ((Frame)Window.Current.Content).GoBack();
Polecenie Anuluj powoduje ukrycie paska aplikacji, więc nie ma potrzeby przekazywania do niego delegatu: msg.Commands.Add(new Windows.UI.Popups.UICommand("Cancel"));
Wynikowe okno dialogowe jest pokazane na rysunku 4.11.
Rysunek 4.11. Okno dialogowe potwierdzenia
Kontrolka AppBar może być otwarta lub zamknięta programowo przez ustawienie właściwości IsOpen. Po wykonaniu przez użytkownika operacji poza paskiem aplikacji pasek ten jest domyślnie ukrywany. Jeżeli ustawisz właściwość IsSti cky na true, pasek aplikacji pozostanie na ekranie do momentu, gdy użyt kownik usunie go za pomocą prawego przycisku myszy, klawiszy Ctrl+Z lub gestu przesunięcia. Ważne jest, aby przy organizowaniu poleceń i kontrolek spełniać zalecenia dla paska aplikacji. Zale cenia te są podsumowane poniżej:
116
•
Rozdział 4. Aplikacje Windows 8
•
polecenia globalne powinny być umieszczane po prawej stronie,
•
polecenia powinny być podzielone na części usytuowane po lewej i po prawej stronie,
•
podobne polecenia powinny być grupowane, a grupy powinny być rozdzielane separatorami,
•
polecenia kontekstowe powinny znajdować się maksymalnie po lewej stronie i w zależności od kontekstu powinny być ukrywane i pokazywane,
•
polecenia krytyczne powinny być oddzielone od pozostałych poleceń z wykorzystaniem dodatkowego miejsca, aby uniknąć przypadkowego aktywowania,
•
nie używaj paska aplikacji dla ustawień - są one aktywowane poprzez panel Ustawienia,
•
nie używaj paska aplikacji do wyszukiwania, o ile wyszukiwanie ma specjalny kontekst - zamiast tego zastosuj panel Szukaj,
•
nie używaj paska aplikacji do udostępniania treści - zamiast tego korzystaj z panelu
•
jeżeli pasek aplikacji stanie się zbyt zatłoczony, możesz przesunąć niektóre polecenia
Udostępnij,
na górny lub dolny pasek lub też rozszerzyć polecenia za pomocą menu kontekstowych. Wytyczne Microsoftu dla paska aplikacji są dostępne w internecie pod adresem http://msdn.microsoft.
com!en-us!library!windows!apps!hh465302.aspx. Uruchom ponownie aplikację i sprawdź działanie dodawania i usuwania obiektów. Zauważ, że do staliśmy to „za darmo" z wbudowanych kontrolek siatki. Gdy dodajesz lub usuwasz obiekt, nie tylko się on pojawia lub znika. Gdy istniejące elementy przesuwają się, są animowane do ich nowych lokalizacji za pomocą szybkiego i płynnego przesunięcia. Jest to realizowane automatycznie jako efekt manipulacji bazowymi kolekcjami. Pasek aplikacji nie jest ograniczony wyłącznie do ikon i poleceń. Można pomyśleć o umieszczeniu na pasku aplikacji innych danych. Może to być wskaźnik statusu (jeżeli korzystasz z Windows Phone, wiesz, w jaki sposób korzystać z paska aplikacji do sprawdzenia siły sygnału i poziomu naładowania baterii) lub mogą to być miniatury (spójrz na Internet Explorer zamieszczony na rysunku 4.12 i zwróć uwagę, że pasek narzędzi jest użyty do przełączania pomiędzy zakładkami oraz do dodawania nowych zakładek).
a• Księgarnia internetowa mf
�
C#er IMage
lvyBi r dge_ Clover Tail_ No, wail, Cloverview_ ARM? Ao t ml
Firs . t let 'sget some termioologyout o ftheway
�:�
glaoce at popula r
I I I I
Tablet
Windows
8 m odels e r 1eals quite h t e mix of processore t chnokig�s- Her' e s a quick
l l linte1Corei3-3217U I 3
AcerAspireS7
inte1Coe r i5-3317U
AcerlconiaW510
1ntelA o t mZ2760
AcerlconiaW700
NVIDIATegra
e li
htt1'
h 1r1
nr�
1 Il ieremyJ1kness com
© 0 0
Rysunek4.12. Kreatywne użycie paska aplikacji w IE10
117
Strona informacyjna
Ikony i ekrany powitalne Być może zauważyłeś, że aplikacja Windows8Application wyświetla przy uruchomieniu zielony ekran po witalny. Służy on do dwóch celów. Po pierwsze, ma pokazać, że jestem przede wszystkim programistą, a nie projektantem, i po drugie, ma pokazać, że możesz modyfikować ikony i obrazy skojarzone z aplikacją. Aby dostosować tytuł i ekran powitalny, kliknij dwukrotnie plik Package.appxmanifest, aby otworzyć okno dialogowe pakietu. Ustawienia dla ikony oraz ekranu powitalnego znajdują się na zakładce Appli
cation UJ, co jest pokazane na rysunku 4.13. Możesz tu określić, w jaki sposób i kiedy będzie wyświetlana nazwa aplikacji oraz jakie kolory zostaną użyte. Możesz wykonać obrazy z logo dla różnych konfiguracji kafelków (małe logo używane przy widoku oddalonym w menu Start), ustawić logo ekranu powitalnego i jego kolor tła. o(ł
_EILE
Windows8Application _EDIT
Y:IEW
.B_UILD
_QE.BUG •
� auwmami �
QuickLrnnch(Ctrl+Q)
Microsoft Visual Studio
.P_ROJECT
TEAM
SgL
„ Loc;i l M;ichi ne
•
IOOLS D ebug
•
T EST
ARCHITECTURE
ANALVZE
WINDOW
HELP
�-;-
lt·� I _ up� I _________________:_ "' m llll lMl*l* · Cl' � " �·m � D· t � ail�P'g � � '.'.!. . _:� G r n� ..d� � ' 'E ' m'.!.._ · m ,p "�
The: prope:rtie:s of the: de:ployme:ntpackage:foryour appi!re: containe:d in the: prope rties .
app man if�t fil e: . You can
use:the:Manife:st D�igne: rto set or modify one
S.olution Exp lor er
ormore of the
GJ
T •
i! �� E]i1 :·�
1'
[§ ab
P·
� Windows8Aprlication .111
iil]Properties t>
Requiredsize:15 0 x150pixels
Wide logo:
X
t>
[J
.li
Requiredsize: 3.10 x150pixds
As�ets\Small logo .pn g
X
[]
Requiredsize::::Ox:::Opixels
c•
iii]
Common
t>
ca
t>
ca
t>
ca LayoutAwarePage.cs
t>
All Log os
t>
Foreg roun d teKt
t> .li
As.semb lylnfo .cs
iiiiAs.sets
,0 Cl
Background color:
� X
·
SearchSolutionb:plorer(Ctrl+;)
.11
Small logo
"0
iii] t>
Boolean NegationConverter.c.s
BooleanToVisibilrtyConverter.cs MyStyles .xa ml
ReadMe.trl
ca RichText:Columns..c.s caSettings.Flyou t .cs
,O Stm dardStyl es..xam l ca SuspensionManager.cs. DataModel
ca SampleD ataSource.cs
,0 About.xaml t> ,0 App.xaml .111 ,O Ap plication C ommands.xaml t> tl ApplicationCommands.xaml.cs t> ,0 Group DetailPage .xaml t> ,0 GroupedltemsPage.xaml t> ,O ltemDetailPage.xaml � MetroApplicatio n_TemporaryKey.pfx �Package .appxmanife st t>
Badge logo:
X
[]
Requiredsize:24 x24pixels
ToastcJpJble:: Lock screen notifications:
(not
set)
(notset)
SplashSc reen:
Spl ash sc: reen:
X
Assets\SplashScrEen.png
Requiredsin::620x3.00pixels
[]
Solutionb:plorer TeamExplorer Properties
•
�X
Ba(kground(olor:
Ready
-----------
Rysunek4.13.
Zakładka Application Ul w oknie dialogowym pakietu
Okno zawiera wskazówki na temat prawidłowej wielkości elementów graficznych. Wszystkie te ele menty mogą być również dynamiczne. Więcej informacji na temat tworzenia ekranu powitalnego z wła snymi elementami możesz znaleźć w rozdziale 5., „Cykl życia aplikacji". Z kolei na temat kafelków i po wiadomień więcej informacji znajduje się w rozdziale 7., „Kafelki i powiadomienia".
Strona informacyjna Informacje na temat aplikacji, w tym ustawienia, preferencje oraz ekran powitalny, powinny być dostępne za pośrednictwem panelu Ustawienia. Gdy wchodzisz do ustawień, zawsze dostępna opcja Uprawnienia pozwala na wyświetlenie tytułu aplikacji, wersji i dostawcy, jak również listy uprawnień nadanych apli kacji. Jak pamiętasz, w rozdziale 2., „Zaczynamy", przy uruchamianiu aplikacji musieliśmy pozwolić na użycie kamery komputera.
118
•
Rozdział 4.
Aplikacje Windows 8
Pierwszym krokiem w przy budowaniu stron, które będą wyświetlane jako część panelu Ustawienia, jest utworzenie klasy obsługującej przesuwanie kontrolki od marginesu strony. Jest to nazywane przelo
tem i nie jest dostępne „z pudełka" w aplikacjach
XAML. Klasa jest dosyć prosta do zbudowania i jej za
daniem jest umieszczenie kontrolki w obiekcie Popup, dzięki czemu może nakładać się na brzeg aplikacji. W folderze Common aplikacji Windows8Application znajduje się definicja klasy SettingsFl yout, zamiesz czonej na listingu 4.3. Istnieją dwa standardowe rozmiary okien przelotu dla paneli - wąskie (o szero kości 346 pikseli) i szerokie (646 pikseli). Listing 4.3.
Klasa SettingsFlyout
class SettingsFlyout
{ private const int _width=
346;
private Popup _popup; public void ShowFlyout(UserControl control)
{ popup=
new Popup();
_popup.Closed +=
OnPopupClosed;
Window.Current.Activated +=
OnWindowActivated;
popup.IslightDismissEnabled= popup.Width=
true;
_width;
_popup.Height=
Window.Current.Bounds.Height;
control.Width=
_width;
control.Height= popup.Child=
Window.Current.Bounds.Height;
control;
popup.SetValue(Canvas.LeftProperty, Window.Current.Bounds.Width -
_width);
popup.SetValue(Canvas.TopProperty, O); popup.IsOpen=
true;
private void OnWindowActivated(object sender, Windows.UI.Core.WindowActivatedEventArgs e) if (e.WindowActivationState == Windows.UI.Core.CoreWindowActivationState.Deactivated) popup.IsOpen=
false;
void OnPopupClosed(object sender, object e)
{ Window.Current.Activated = -
OnWindowActivated;
Przyjrzyjmy się zawartości pliku About.xaml. Strony Ustawienia mają białe tło. Kontrolka Grid ma zdefiniowane przekształcenia, które zapewniają animowany efekt przelotu tekstu razem z pozostałymi kontrolkami. Specjalny styl Sett ingsBackButtonStyl e jest kopią BackButtonStyl e dostarczanego w ra mach szablonu, do którego zostało ustawione białe tło. Do strony zostały dołączone dwa polecenia. Pierwsze polecenie tylko wyłącza element nadrzędny (obiekt klasy SettingsFlyout) i powoduje powrót do ustawień aplikacji. Aby kod ten działał, konieczne jest dodanie polecenia using Windows. U I. Appli cationSettings:
Czujniki
119
private void Button_Click_l(object sender, RoutedEventArgs e)
{ if (this.Parent.GetType() == typeof(Popup))
{ ((Popup)this.Parent).IsOpen = false; SettingsPane.Show();
Drugie polecenie jest uruchamiane przez Hyperl i nkButt on, który ma ustawiony adres mojego blogu. Do otwarcia adresu Uri wykorzystywana jest klasa Launcher. Pozwala to platformie Windows 8 określić aplikacje zarejestrowane do obsługi Uri (najprawdopodobniej Internet Explorer 10), a następnie przeka zać Uri do aplikacji lub wcześniej uruchomić aplikację. private async void HyperlinkButton_Click_l(object sender, RoutedEventArgs e) await Windows.System.Launcher.LaunchUriAsync( new Uri("http://csharperimage.jeremylikness.com/"));
Ostatnim krokiem jest zarejestrowanie nowej strony w panelu Ustawienia. Gdy aplikacja jest urucha miana, musi być podłączona do zdarzenia CommandRequested z obiektu Sett i ngsPane. Zostanie ono uru chomione i rozpocznie budowanie listy opcji w momencie, gdy użytkownik wywoła panel Ustawienia. Rejestracja ta jest realizowana w pliku App.xaml.cs: SettingsPane.GetForCurrentView().CommandsRequested += App_CommandsRequested;
Do procedury obsługi jest przekazywany obiekt Request, zawierający listę poleceń. Możesz dodać do tej listy własne polecenia, dzięki czemu będą wyświetlane po wywołaniu panelu Ustawienia: var about = new SettingsCommand("about", "Informacje", (handler) =>
{ var settings = new SettingsFlyout(); settings.ShowFlyout(new About());
}); args.Request.ApplicationCommands.Add(about);
Uruchom aplikację i wypróbuj ją. Strona informacyjna jest pokazana na rysunku 4.14. Aby ją wy świetlić, przesuń palec od prawej strony ekranu lub umieść kursor myszy w prawym dolnym narożniku okna, co spowoduje wyświetlenie paska paneli. Stuknij panel Ustawienia i zwróć uwagę, że do wbudo wanego polecenia Uprawnienia zostało dodane polecenie Informacje. Stuknij polecenie Informacje
-
zobaczysz, że nowa strona zostanie wsunięta do widoku. W podobny sposób dodajemy do aplikacji stronę ustawień i preferencji użytkownika. Więcej infor macji na temat przechowywania i odczytywania wartości znajdziesz w rozdziale 5., a szczegółowy opis obsługi ustawień aplikacji - w rozdziale 6., „Dane".
Czujniki Oprócz zdarzeń dotykowych do sterowania aplikacjami Windows 8 mogą być wykorzystywane również inne metody. Wiele urządzeń Windows 8 zawiera specjalne sensory, które dostarczają takich informacji, jak fizyczna orientacja tabletu lub współrzędne GPS. Windows Runtime zawiera API pozwalające skorzystać
120
•
Rozdział 4.
Aplikacje Windows 8
® Informacje Aplikacja Windows 8 z rozdziału 4. Jeremylikness Odwiedżmójblog http://csharperimage.jeremylilcness....
Rysunek 4.14.
Strona Informacje
z tych sensorów i zbudować aplikację, która odpowiada na takie zdarzenia, jak potrząśnięcie tabletu, prze chylenie go lub pobranie informacji o lokalizacji użytkownika. W tym podrozdziale przedstawię krótko dostępne API czujników. Jeżeli nie masz urządzenia z jednym z przedstawionych czujników, możesz pobrać i uruchomić przy kładowe aplikacje korzystające z sensorów w centrum programistycznym Microsoftu. Poniższe łącze prowadzi do strony, z której możesz pobrać zbiór przykładowych projektów dla każdego z wymienio nych tu czujników (szukaj przykładów zawierających w tytule Accelerometer, Gyrometer, Sensor oraz Location ) : http:!!code.msdn.microsoft.com!windowsapps!Windows-8-Modern-Style-App-Samples.
Przyspieszeniomierz Przyspieszeniomierz dostarcza danych na temat wpływu grawitacji na urządzenie mierzonej według trzech różnych osi. API zapewnia odczyt bieżących wartości i generuje zdarzenia w momencie zmiany odczytów. Zdarzenie dostarcza danych na temat przyspieszenia mierzonego według osi X, Y i Z. Kod z listingu 4.4 demonstruje sposób odczytywania tych danych. Listing 4.4. Odczyt wartości z przyspieszeniomierza async private void ReadingChanged(object sender, AccelerometerReadingChangedEventArgs e) await Dispatcher.RunAsync(CoreDispatcherPriority.Normal, () => { AccelerometerReading reading = e.Reading; ScenarioOutput X.Text = String.Format("{0,5:0.00}", reading.AccelerationX); ScenarioOutput Y.Text = String.Format("{0,5:0.00}", reading.AccelerationY); ScenarioOutput Z.Text = String.Format("{0,5:0.00}", reading.AccelerationZ); });
Czujniki
121
Więcej informacji na temat akcelerometru oraz przykładowe aplikacje można znaleźć w dokumenta cji MSDN pod adresem
http://msdn.microsoft.com!en-us!library!windows!apps!windows.devices.sensors.
accelerometer.aspx. Kompas Jeżeli urządzenie jest wyposażone w kompas, można odczytać jego położenie w stosunku do północy
Północ rzeczywista to kierunek geograficznego bieguna północnego; północ magnetyczna to kierunek magnetycznego bieguna północnego. Biegun magnetyczny nie zawsze znajdu
rzeczywistej i magnetycznej.
je się w tym samym miejscu, ponieważ przesuwa się on w odpowiedzi na zmiany w rdzeniu magnetycz nym Ziemi. Na listingu 4.5 jest pokazany sposób odczytu położenia kompasu. Listing 4.5. Odczyt położenia kompasu
async private void ReadingChanged(object sender, CompassReadingChangedEventArgs e) await Dispatcher.RunAsync(CoreDispatcherPriority.Normal, () => {
CompassReading reading = e.Reading; ScenarioOutput MagneticNorth.Text = String.Format("{0,5:0.00}", reading.HeadingMagneticNorth); if (reading.HeadingTrueNorth != null) {
ScenarioOutput TrueNorth.Text = String.Format(" {0,5:0.00}", reading.HeadingTrueNorth);
else {
ScenarioOutput TrueNorth.Text
"Brak danych";
});
Więcej informacji na temat czujnika kompasu można znaleźć pod adresem
http://msdn.microsoft.
com!en-us!library!windows!apps!windows.devices.sensors.compass.aspx. Geolokalizacja API geolokalizacji agreguje dane z różnych źródeł, dzięki czemu może dostarczyć aplikacji przybliżone położenie urządzenia. Informacje te mogą pochodzić z dostawcy Windows Location Provider, który ko rzysta z triangulacji Wi-Fi oraz adresu IP lub też innych źródeł, takich jak wbudowany odbiornik GPS. API pobiera te informacje, aby dostarczyć możliwie dokładną lokalizację. Na listingu 4.6 przedstawione jest użycie API do pozyskania informacji o długości i szerokości geo graficznej urządzenia wraz z szacowaną dokładnością odczytu. Listing 4.6. Odczyt informacji na te mat lokalizacji urządzenia
Geoposition pos = await -geolocator.GetGeopositionAsync() .AsTask(token);
122
•
Rozdział 4. Aplikacje Windows 8
ScenarioOutput_Latitude.Text ScenarioOutput_Accuracy.Text
pos.Coordinate.Latitude.ToString();
=
ScenarioOutput_Longitude.Text
pos.Coordinate.Longitude.ToString();
=
pos.Coordinate.Accuracy.ToString();
=
Więcej informacji na temat API geolokalizacji można znaleźć pod adresem http://msdn.microsoft.
com!en-us/Zi braryIwindowsiappsiwindows.devices.geolocation.aspx.
Żyroskop Czujnik żyroskopu dostarcza danych na temat szybkości kątowej lub sposobu obrotu urządzenia. Podob nie jak inne czujniki, posiada on API pozwalające na odczytanie bieżących wartości, jak również gene rowanie zdarzeń w momencie zmiany odczytu. Na listingu 4.7 pokazany jest sposób interpretacji wyni ków ze zdarzenia. Listing 4.7. Odczyt żyroskopu async private void ReadingChanged(object sender, GyrometerReadingChangedEventArgs e) await Dispatcher.RunAsync(CoreDispatcherPriority.Normal, ()
=>
GyrometerReading reading ScenarioOutput_X.Text
=
=
e.Reading;
String.Format("{0,5:0.00}",
reading.AngularVelocityX); ScenarioOutput_Y.Text
=
String.Format("{0,5:0.00}",
reading.AngularVelocityY); ScenarioOutput_Z.Text
=
String.Format("{0,5:0.00}",
reading.AngularVelocityZ); });
Więcej informacji na temat żyroskopu można znaleźć pod adresem http://msdn.microsoft.com!en-us!
library!windows!apps!windows.devices.gyrometer.aspx.
Inklinometr Inklinometr dostarcza danych o kącie pochylenia, obrotu i odchylenia urządzenia. Pozwala na określenie orientacji urządzenia względem podłoża (lub dokładniej, kierunku, w którym na urządzenie działa gra witacja). Dzięki temu czujnikowi można określić, czy urządzenie jest obrócone lub przechylone. Wyjaśnie nie zjawisk pochylenia, obrotu i odchylenia znajduje się w artykule umieszczonym na witrynie NASA, pod adresem http://www.grc.nasa.gov!WWWIK-12/airplane!rotations.html. Na listingu 4.8 zamieszczony jest kod pozwalający na odczyt kąta pochylenia, obrotu i odchylenia urządzenia. Listing 4.8. Odczyt inklinometru async private void ReadingChanged(object sender, InclinometerReadingChangedEventArgs e)
Czujniki
123
await Dispatcher.RunAsync(CoreDispatcherPriority.Normal, ()
=>
InclinometerReading reading ScenarioOutput_X.Text
=
=
e.Reading;
String.Format("{0,5:0.00}",
reading.PitchDegrees); ScenarioOutput_Y.Text
=
String.Format("{0,5:0.00}",
reading.RollDegrees); ScenarioOutput_Z.Text
=
String.Format("{0,5:0.00}",
reading.YawDegrees); });
Więcej informacji na temat inklinometru można znaleźć pod adresem
http://msdn.microsoft.com/
en-us!library!windows!apps!windows.devices.inclinometer.aspx. Czujnik światła Czujnik światła wykrywa jakość i intensywność światła w otoczeniu urządzenia. Pozwala aplikacji na ko rygowanie sposobu wyświetlania, na przykład zmniejszenie jasności w przypadku pracy w ciemnym po mieszczeniu. Ograniczenie jasności wyświetlacza pozwala wydłużyć czas pracy na baterii. Na listingu 4.9 zademonstrowany jest sposób odczytu wartości z czujnika światła. Listing 4.9.
Odczyt czujnika światła
async private void ReadingChanged(object sender, LightSensorReadingChangedEventArgs e) await Dispatcher.RunAsync(CoreDispatcherPriority.Normal, ()
=>
LightSensorReading reading ScenarioOutput_LUX.Text
=
=
e.Reading;
String.Format("{0,5:0.00}",
reading.Illuminancelnlux); });
Więcej informacji na temat czujnika światła można znaleźć pod adresem
http://msdn.microsoft.com/
en-us!library!windows!apps!windows.devices.sensors.lightsensor.aspx. Czujnik orientacji Czujnik orientacji posiada macierz reprezentującą obroty oraz kwaternion, który może być używany do korygowania perspektywy użytkownika w aplikacji. W przeciwieństwie do prostego czujnika orientacji, który był używany we wcześniejszej części rozdziału do zmiany orientacji z pionowej na poziomą, peł ny czujnik orientacji jest zwykle wykorzystywany w grach w celu zmiany sposobu generowania grafiki w zależności od orientacji tabletu. Kwaternion jest specyficzną notacją używaną do opisywania orienta cji i obrotów. Na listingu 4.10 przedstawiony jest sposób odczytu wartości orientacji.
124
•
Rozdział 4. Aplikacje Windows 8
Listing 4.1 O. Odczyt orientacji
async private void ReadingChanged(object sender, OrientationSensorReadingChangedEventArgs e) await Dispatcher.RunAsync(CoreDispatcherPriority.Normal, () => OrientationSensorReading reading = e.Reading; li Wartości kwaternionu SensorQuaternion quaternion = reading.Quaternion; ScenarioOutput_X.Text String.Format("{0,8:0.00000}", quaternion.X); ScenarioOutput_Y.Text String.Format("{0,8:0.00000}", quaternion.Y); ScenarioOutput_Z.Text String.Format("{0,8:0.00000}", quaternion.Z); ScenarioOutput_W.Text String.Format("{0,8:0.00000}", quaternion.W); li Wartofri macierzy obrotu SensorRotationMatrix rotationMatrix = reading.RotationMatrix; ScenarioOutput_Mll.Text = String.Format("{0,8:0.00000}", rotationMatrix.Mll); Scenario0utput_Ml2.Text = String.Format("{0,8:0.00000}", rotationMatrix.Ml2); Scenario0utput_Ml3.Text = String.Format("{0,8:0.00000}", rotationMatrix.Ml3); Scenario0utput_M21.Text = String.Format("{0,8:0.00000}", rotationMatrix.M21); Scenario0utput_M22.Text = String.Format("{0,8:0.00000}", rotationMatrix.M22); Scenario0utput_M23.Text = String.Format("{0,8:0.00000}", rotationMatrix.M23); Scenario0utput_M31.Text = String.Format("{0,8:0.00000}", rotationMatrix.M31); Scenario0utput_M32.Text = String.Format("{0,8:0.00000}", rotationMatrix.M32); Scenario0utput_M33.Text = String.Format("{0,8:0.00000}", rotationMatrix.M33); });
Więcej informacji na temat czujnika orientacji można znaleźć pod adresem http://msdn.microsoft. com!en-us!library!windows!apps!windows.devices.sensors.orientationsensor.aspx.
Podsumowanie W rozdziale tym skupiliśmy się na układach oraz operacjach wykorzystywanych w aplikacjach Windows 8. Przedstawiłem Visual State Manager oraz rolę, jaką pełni on w oddzielaniu logiki prezentacji od kodu aplikacji, omówiłem symulator pozwalający na emulowanie funkcji takich jak dotyk oraz pokazałem sposób zarządzania różnymi orientacjami i formatami widoku. Opisałem kontrolkę Semant i cZoom, która pozwala użytkownikowi szybko nawigować w dużych listach danych.
Podsumowanie
125
Zapoznałeś się z niuansami zdarzeń dotykowych oraz sposobów zarządzania nimi w środowisku Win dows 8. Na podstawie przykładowej aplikacji zademonstrowałem, jak zapewnić akcje myszy, klawiatury oraz dotyku do uruchamiania różnych poleceń, a także jak włączyć i monitorować zdarzenia manipulacji. Pokazałem też, jak wykonać stronę początkową oraz kafelki, jak obsłużyć polecenia w aplikacji za pomo cą kontrolki AppBar oraz jak dodać do panelu Ustawienia stronę informacyjną. Urządzenia Windows 8 mogą zawierać różne czujniki pozwalające odczytywać informacje na temat orientacji, światła, przyspieszenia i lokalizacji. Dostępne są różne API, za pomocą których możemy spraw dzać dostępność czujników oraz odczytywać udostępniane przez nie dane, aby wykorzystać je w aplikacji. Czujniki te pozwalają na reakcję na zmiany w środowisku, jak również dostarczają danych kontekstowych. Środowisko programistyczne oraz szablony projektu pomagają szybko uruchomić w miarę skom plikowany przykładowy projekt zawierający grupowanie elementów i zapewniający funkcje nawigacji, dodawania i usuwania elementów. W zwykłych przypadkach, gdy przejdziesz do innej aplikacji, pozo stawiając działającą główną aplikację, stan tej ostatniej zostanie zachowany w pamięci, dzięki czemu po powrocie do niej będzie ona w tym samym stanie. Nie ma jednak gwarancji, że pozostanie ona w pamię ci, ponieważ Windows Runtime może zakończyć jej działanie. Użytkownicy zazwyczaj oczekują, że będą mieli możliwość powrotu do stanu aplikacji sprzed jej za kończenia. W następnym rozdziale przedstawię cykl życia aplikacji oraz sposoby wykrywania, czy apli kacja jest zatrzymana, czy została wznowiona, czy też została zakończona i powtórnie uruchomiona. Po znasz również sposoby zachowywania stanu przez aplikacje, dzięki czemu możemy je przywracać, dając użytkownikowi wrażenie ciągłej pracy aplikacji.
126
•
Rozdział 4. Aplikacje Windows 8
s. Cykl życia aplikacji W
TRADYCYJNYM ŚRODOWISKU WINDOWS użytkownik zarządza czasem życia aplikacji uruchamia ją, i ona działa do momentu, gdy użytkownik zdecyduje o jej zamknięciu. W modelu
tym występuje poważny problem, ponieważ aplikacja wykorzystuje takie zasoby systemu, jak pamięć i CPU, nawet jeżeli nie znajduje się ona na pierwszym planie. Wpływa to na wydajność aplikacji uru chamianych przez użytkownika, a także powoduje szybsze wyczerpanie baterii, jeżeli urządzenie nie jest podłączone do sieci elektrycznej. Bardzo łatwo jest pokazać to tradycyjne podejście w trybie pulpitu Windows 8. Jeżeli nie posiadasz pliku wideo, skorzystaj z poniższej witryny, udostępniającej wszystkie wideo z sesji konferencji BUILD, na której Microsoft zaprezentował Windows 8: http:!!channel9.msdn.com!Events!BUILDIBUILD2011. (Być może czytasz to po konferencji z roku 2012; jeżeli tak, to powinieneś być w stanie skorzystać ze zaktualizowanej witryny i pobrać z niej aktualne nagrania). Przejdź do wybranego filmu i pobierz go w średniej lub wysokiej jakości na swój dysk. Może to zająć od kilku minut do godziny, w zależności od rozmiaru pliku. W czasie oczekiwania na pobranie pliku uruchom Menedżer zadań, który pozwala na przegląd aplikacji działających w systemie. Istnieje kilka sposobów na jego uruchomienie. •
W menu Start Windows 8 wpisz menedżer zadań i wybierz program z wyświetlonych wyników wyszukiwania.
•
Kliknij na pulpicie prawym przyciskiem myszy pasek zadań i wybierz opcję Menedżer zadań.
•
W dowolnym miejscu naciśnij jednocześnie Ctrl+Sh ift+Esc.
Po uruchomieniu Menedżera zadań wyświetli się prosty widok pokazany na rysunku 5.1. Domyślny widok zawiera listę działających aplikacji. Aby zobaczyć bardziej zaawansowany widok, kliknij łącze Więcej szczegółów w lewej dolnej części ekranu. Spowoduje to otwarcie widoku zaawanso wanego przedstawionego na rysunku 5.2. Zostaną pokazane nie tylko działające aplikacje z informacja mi na temat zużycia zasobów, ale również działające procesy tła, takie jak sterowniki w systemie, które obsługują różne urządzenia. Upewnij się, że Menedżer zadań działa w widoku zaawansowanym i że jest widoczny na ekranie. Teraz uruchom pobrany plik wideo przez kliknięcie prawym przyciskiem myszy w oknie Eksploratora Win dows i wybranie Odtwarzanie za pomocą programu Windows Media Player. Możesz zauważyć, że zużycie procesora oraz pamięci zacznie rosnąć. Wielkość tych wzrostów zależy od konfiguracji systemu. Teraz otwórz Notatnik i rozciągnij go, aby całkowicie zakrył film. Po tej operacji zużycie procesora nie zmieni
128
•
Rozdział 5.
Cykl życia aplikacji
-
Menedżer zadań �
Aplikacja Window> 8 (32 hity]
i1:f.!
Data B nd ng
�
I nternet Explorer
i i
D
m l>ity)
� Micro>oft Vi>ual Studio 2012 ( 32 bity) @:ł Paint
[] Pogoda Tablica znaków
�Zdjęcia
G Więcej s:zczeg&łów Rysunek 5.1.
Zakcńcz zadanie
Prosty widok Menedżera zadań - D„
Menedżer zadań
Procesy
I Wydajność I Hi,>toria aplikacji I Uru ch amianie I Użytkownicy I Szczegóły I U>ługiI
I Stan
Nazwa
I
10%
Procesor„.
I
48%
Pannięć I
0% Dysk
I
0%
Sieć
I
Aplikacje (9)
p likacja Window> 8 (32 hity)
A
0%
15,5 MB
OMB/>
�
DataBinding (32 l>ity)
0%
7,5 MB
OMB/s
OMl>/s
�
Internet Explorer
0%
105,5MB
OMB/s
OMl>/>
11>
��
Menedźer zadań
I>
�
Micro>oftVi>ual Studio2012
I>
@:ł
Paint
_
(32...
[] Pogoda Tablica znaków
jęcia
� Zd
Procesy w tle
I>
OMl>/>
0%
7,2 MB
OMB/s
OMb/>
0%
152,5MB
OMB/s
OMl>/>
0%
11,3MB
OMB/s
OMb/s
0%
55.7MB
OMB/s
OMb/s
0%
1,5MB
OMB/s
OMl>/>
0%
35,1 MB
OMB/s
OMb/>
(12)
a
Adobe® Flash® Player Util ty
0%
1,4MB
OMB/s
OMb/s
�
Communications: Service
0%
5,5 MB
OMB/s
OMl>/>
.@.
lndek>ator programu
0%
9,5MB
OMB/s
OMb/>
i
o oft
Mi cr >
„.
0 .Mniej Rczegółów
..,
Zał;cńcz zadan e
i
Rysunek 5.2.
Zaawansowany widok Menedżera zadań
się, choć już nie oglądamy filmu. Aplikacja i tak realizuje zadanie przetwarzania wideo, choć przez otwarcie programu Notatnik na pierwszym planie pokazaliśmy, że nie jesteśmy obecnie zainteresowani filmem. W aplikacjach Windows 8 scenariusz ten uległ zmianie. Użytkownik decyduje, która aplikacja bę dzie działać na pierwszym planie, i tylko jedna aplikacja może działać w taki sposób (z wyłączeniem wi doku przyciągniętego, pozwalającego na działanie dwóch aplikacji, z których jedna zajmuje mały pasek przestrzeni). Następnie system określa, co się powinno stać z pozostałymi aplikacjami tła. Jeżeli nie zbu dujesz swojej aplikacji prawidłowo, będzie ona powodowała negatywne efekty uboczne, wywołujące pro blemy w interakcji z użytkownikiem. Zarządzanie aplikacjami w Windows Run time jest nazywane zarzą dzaniem czasem życia procesu (ang.
Process Lifetime Management
-
PLM).
Zarządzanie czasem życia procesu
129
Zarządzanie czasem życia procesu Aplikacje Windows 8 działają wyłącznie wtedy, gdy są na pierwszym planie. Pozwala to użytkowniko wi na skupienie się na głównej aplikacji, z którą zamierza pracować. Aplikacje w tle przechodzą w stan wstrzymania, w którym wątki aplikacji są zamrożone. Aplikacja przestaje korzystać z zasobów systemo wych, dzięki czemu zmniejsza się tempo rozładowywania baterii. W większości przypadków aplikacja pozostaje w pamięci. Pozwala to na szybkie przełączanie aplikacji, więc gdy użytkownik cofnie się do apli kacji poprzedniej, będzie ona natychmiast wznawiana, tak jakby cały czas działała. Istnieją jednak przypadki, gdy wstrzymana aplikacja może być wyłączona przez system. Jest to zależne od zasobów systemu. Jeżeli na przykład aplikacja działająca na pierwszym planie wymaga przydzielenia dużego obszaru pamięci, który spowoduje zajęcie niemal całej dostępnej pamięci, system może wyłączyć przynajmniej jedną aplikację będącą w stanie wstrzymania. System wybiera do wyłączenia tę aplikację, która zajmuje najwięcej pamięci. Aby zobaczyć ten proces w działaniu, uruchom menu Start przez naciśnięcie klawisza Windows. Otwórz Menedżer zadań i umieść go na ekranie Windows 8. Upewnij się, że wybrana została opcja Zaw sze na wierzchu, znajdująca się w menu Opcje. Teraz uruchom aplikację, a następnie wróć do menu Start i uruchom kolejną. Powtarzaj ten proces kilka razy. Zauważysz, że po kilku sekundach aplikacje będą przechodziły w stan Wstrzymany. Jeżeli status nie jest wyświetlany, przejdź do Widok, Wartości stanu i zaznacz Pokaż stan wstrzymany. Na rysunku 5.3 pokazany jest wynik uruchomienia kilku aplikacji, gdy na pierwszym planie znajduje się aplikacja Pogoda. Zwróć uwagę, że inne aplikacje Windows 8 są w sta nie Wstrzymany.
�
.P_lik
Qpcjy
j
Widok
Wydo;rm�ć
I
Hi�torio aplikaqi
I
I
Uruchamianie
I
Użytkownicy
Szczegóły
I
I
U>lugi
0%
°'''I
Aplikacje(9) ,..oataBinding(32bity}
� lnt
(
new
p
SettingsFlyout();
O Debugger: Beginning ofApplication: Main, App.g.i.c:s O Live [vent: Breakpoint Hit: MoveNert,. App.xaml.cs. lin
Factori al (factor)
Może być ono czytane następująco: „Nic nie idzie do wywołania Factorial z parametrem factor". Za pomocą wyrażeń lambda można tworzyć metody „na bieżąco". W poprzednich przykładach z wywo łaniami śniadania, lunchu i obiadu do obsłużenia zdarzeń zakończenia przetwarzania były wykorzysty wane metody. Mogłyby to być również wyrażenia lambda: breakfast.MealCompleted += (sender, eventArgs) =>
li Wykonaj operacje
}; W tym przypadku to wyrażenie lambda można przeczytać: „Wartości sender oraz eventArgs idą do zbioru instrukcji wykonujących operacje". Parametry wywołania zdarzenia są dostępne w wyrażeniu lambda jako zmienne lokalne zdefiniowane w otaczającej je metodzie. Wyrażenia lambda są używane jako skróty do przekazywania delegatów. Trzeba jednak pamiętać o kilku pułapkach związanych z używaniem wyrażeń lambda. O ile nie przy piszesz wyrażenia lambda do zmiennej, nie ma możliwości odwołania się do niego w kodzie, przez co nie można wyrejestrować procedury obsługi zdarzeń zdefiniowanej za pomocą wyrażenia lambda. Wy rażenia lambda odwołujące się do zmiennych z metody przechwytują te zmienne, przez co mogą one żyć dłużej, niż wskazuje na to zakres metody (dzieje się tak, ponieważ do wyrażenia lambda można się od wołać po zakończeniu działania metody), więc należy pamiętać o efektach ubocznych z tym związanych. Więcej informacji na temat wyrażeń lambda można znaleźć pod adresem http://msdn.microsoft.com/
en-us!library!bb397687(v=vs.11O).aspx.
Metody pomocnicze IO Klasy PathIO oraz Fil eIO zawierają metody pomocnicze ułatwiające odczyt i zapis plików. Klasa PathIO pozwala na wykonywanie operacji na plikach przez przekazanie ścieżki bezwzględnej do pliku. Utworze nie pliku tekstowego i zapisanie do niego danych może być wykonane w jednym wierszu kodu: awai t Pa thIO.Wri teTextAsync ("ms-appdata: ///local /tmp. txt", "Tekst.");
Prefiks ms-appdata jest specjalnym Uri, który wskazuje na lokalny magazyn dla aplikacji. Możesz również korzystać z lokalnych zasobów umieszczonych w aplikacji, stosując prefiks ms-appx. W przykła dowej aplikacji początkowa lista blogów do załadowania jest zapisana w formacie JSON w Assets!Blogs.js.
Odczyt i zapis danych
Kod odwołujący się do tej listy znajduje się w klasie BlogDataSource (w folderze
DataModel)
153
-
plik jest
ładowany za pomocą jednego wiersza kodu: var content
=
await Pathro.ReadTextAsync("ms-appx:///Assets/Blogs.js");
Klasa Fil ero zapewnia podobne operacje. Zamiast przekazywać ścieżkę i automatycznie otwierać plik, jej metody akceptują parametr typu IStorageFi le. Klasy Filero można użyć, gdy już mamy refe rencję do pliku lub potrzebujemy skorzystać z takiego typu przetwarzania, który nie może być wykona ny z zastosowaniem ścieżki. W tabeli 6.2 zamieszczona jest lista dostępnych metod. W przypadku klasy Pathro wszystkie te me
tody oczekują bezwzględnej ścieżki do pliku, a w przypadku klasy Filero
-
obiektu IStorageFile (uzy
skanego za pomocą API przechowywania). Tabela 6.2. Metody pomocnicze w klasach PathlO oraz FilelO Nazwa metody
Opis
AppendlinesAsync
Dołącza wiersze tekstu na końcu pliku.
AppendTextAsync
Dołącza tekst na końcu podanego pliku.
ReadBuf ferAsync
Odczytuje zawartość podanego pliku do bufora.
ReadlinesAsync
Odczytuje zawartość podanego pliku jako wiersze tekstu.
ReadTextAsync
Odczytuje zawartość podanego pliku do jednego wiersza tekstu.
WriteBufferAsync
Zapisuje dane z bufora do podanego pliku.
WriteBytesAsync
Zapisuje tablicę bajtów do podanego pliku.
WritelinesAsync
Zapisuje wiersze tekstu do podanego pliku.
WriteTextAsync
Zapisuje tekst do podanego pliku.
Korzystaj z tych metod pomocniczych wszędzie tam, gdzie ma to sens. Pozwalają one znacznie upro ścić kod.
Osadzone zasoby Istnieje kilka sposobów na osadzenie danych w aplikacji i ich odczyt. Często spotykanym powodem osa dzania danych jest zapewnienie wartości początkowych dla lokalnej bazy danych lub pamięci podręcz nej, jak również zapewnienie specjalnych plików, takich jak umowy licencyjne. Możliwe jest osadzanie zasobów dowolnego typu, w tym plików graficznych lub tekstowych. Aplikacja, z którą już się zapozna łeś, zawiera zasoby graficzne.
Solution Explorer Properties albo zaznacz zasób i naciśnij Alt+Enter. Na rysunku 6.3 jest pokazany wynik zaznaczenia pliku Blogs.js w folderze Assets i otwarte okno Properties. Zwróć uwagę na właściwości Build Action oraz Copy to Output Directory. Gdy wybierzesz akcję budowania Content, zasób zostanie skopiowany do folderu właściwego dla pa Aby się przekonać, w jaki sposób są osadzane zasoby, kliknij nazwę zasobu w oknie
prawym przyciskiem myszy i wybierz
kietu Twojej aplikacji. Oprócz kontenerów przechowywania, wspomnianych w rozdziale 5., każdy pa kiet posiada lokalizację instalacji zawierającą lokalne zasoby, dla których właściwość Build Action została ustawiona na
Content.
Dotyczy to również takich zasobów jak zdjęcia.
154
•
Rozdział 6. Dane
Blogs.js. ;;i X
�:�· �
[
•
), { ), { ), { ), {
"BlogUri":
"http://feeds2. feedburner. com/CSharperimage"
"BlogUri":
"http: I /w....wintellect.com/c /blog /jpro ise/r
"BlogUri „:
"http: I /wwi.'l'.wintellect.com/cs/blogs/jeffreyr/rss. aspx"
··slogUri „:
" http: //M'.'L.,,.wintellect.com/cs/blogs/jro bbins/rss. aspx"
"BlogUri":
"http://M.'11..,..wintellect.com/cs/blogs /jga rl a nd/rss. aspx"
·U
BlogsJs FileProperties.
„
BuildAction
s
s
s
ss. aspx"
Content
ewa.m11!l§MW Capy always Cu stom To ol Custom Tool N11meo;pac!': Blogs..js. C:\helion\lmd\Rozdzial6\Wintellc
Rysunek 6.3. Właściwości zasobu
Lokalizację, w której jest zainstalowany, pakiet można znaleźć za pomocą klasy Package: var package = Windows.ApplicationModel.Package.Current; var installedlocation = package.Installedlocation; var loc = String.Format("Lokalizacja instalacji: {O}", installedlocation.Path);
Do plików tych można odwołać się w prosty sposób, korzystając z prefiksu ms-appx. Otwórz plik
BlogDataSource.cs. Plik Blogs.js jest ładowany w metodzie LoadLiveGroups. Przy tej operacji został wyko rzystany specjalny prefiks pakietu: var content = await PathIO.ReadTextAsync("ms-appx:///Assets/Blogs.js");
Możliwe jest również osadzanie zasobów bezpośrednio w pliku wykonywalnym aplikacji. Zasoby te nie są widoczne w systemie plików, ale nadal są dostępne w kodzie aplikacji. Aby osadzić zasób, ustaw jego właściwość Build
Action na Embedded Resource. Dostęp do takiego zasobu jest nieco bardziej skom
plikowany. Aby odczytać zawartość osadzonego zasobu, musisz odwołać się do bieżącego podsystemu. Podsys tem jest blokiem budulcowym aplikacji. Jednym ze sposobów na uzyskanie informacji o podzespole jest pobranie danych na temat zdefiniowanej przez nas klasy: var assembly = typeof(BlogDataSource).GetTypeinfo().Assembly;
Wewnątrz podzespołu znajduje się osadzony zasób. Po uzyskaniu referencji do podzespołu możesz otworzyć strumień zasobu, korzystając z metody GetMani festResourceStream. Sposób uzyskania referen cji nie jest jednak oczywisty. Nazwa zasobu zawiera przestrzeń nazw podzespołu. Z tego powodu zasób w głównym węźle projektu o domyślnej przestrzeni nazw Win tellog będzie miał następującą ścieżkę: Wintellog.ResourceName
Plik
ReadMe.txt z folderu Common ma więc nazwę Wintellog.Common.ReadMe.txt. Plik ten został
osadzony w projekcie wyłącznie w celu zilustrowania tego przykładu. Po uzyskaniu strumienia dla zaso bu można użyć klasy StreamReader do jego odczytania. Po uzyskaniu referencji do podzespołu zawartość pliku można pobrać w następujący sposób: var stream assembly.GetManifestResourceStream(txtFile); var reader = new StreamReader(stream); var result = await reader.ReadToEndAsync(); return result;
Osadzanie zasobów wykorzystuje się zwykle, gdy zachodzi potrzeba ukrycia pewnych danych w pod zespole. Trzeba pamiętać, że nie powoduje to całkowitego ich ukrycia, ponieważ za pomocą odpowiednich narzędzi można przeglądać zawartość podzespołów razem z osadzonymi zasobami. Osadzanie zasobów
Kolekcje
155
za pomocą akcji budowania Content nie tylko ułatwia przeglądanie tych danych, ale również pozwala na wykrywanie plików w systemie plików zainstalowanego pakietu, dzięki czemu aplikacja może dynamicz nie zarządzać wieloma zasobami.
Kolekcje Kolekcje są podstawowymi strukturami używanymi do manipulowania danymi w aplikacji. Klasy te im plementują wspólne interfejsy, dzięki czemu w spójny sposób udostępniają metody do odpytywania i za rządzania danymi zapisanymi w kolekcji. Kolekcje są często związane z kontrolkami UL W przykładzie
Wintellog kolekcja blogów tworząca grupę najwyższego poziomu jest wiązana z kontrolką Gri dView. Ko lekcja artykułów wewnątrz blogów stanowi widok szczegółowy dla grupy. Windows Runtime posiada zbiór często stosowanych typów kolekcji. Typy te są automatycznie od wzorowywane na typy .NET Framework przez CLR. W kodzie nie odwołujesz się bezpośrednio do typów Windows Runtime. Zamiast tego korzystasz z odpowiedników .NET, a CLR automatycznie realizuje kon wersję. W tabeli 6.3 wymienione są typy Windows Runtime oraz ich odpowiedniki .NET, jak również krótki opis i przykład klasy implementującej dany interfejs. Tabela 6.3. Typy kolekcji w Windows Runtime oraz .NET WinRT
.NET Framework
I Iterable
IEnumerable
I Iterator
IVector
IEnumerator
Ilist
Przykład
Opis
Większość typów
Zapewnia interfejs wspierający
kolekcji.
przeglądanie kolekcji.
Udostępniany poprzez
Interfejs do realizacji
typ kolekcji.
przeglądania kolekcji.
List
Kolekcja pozwalająca na dostęp bezpośredni poprzez indeks.
IVectorView
IReadOnlylist
ReadOnlyCollection
Odmiana kolekcji indeksowanej, która nie może być modyfikowana.
IMap
IDictionary
Dictionary
Kolekcja wartości, które są identyfikowane przez klucze.
IMapView
IReadOnlyDictionary
ReadOnlyDictionary
Odmiana kolekcji z parami
klucz-wartość, która nie może być modyfikowana.
IBindableiterable
IBindableVector
IEnumerable
IList
Udostępniany przez
Obsługuje przeglądanie
kolekcje niegeneryczne.
kolekcji niegenerycznych.
Niestandardowe klasy
Obsługuje niegeneryczne
implementujące ILi st.
kolekcje zapewniające dostęp poprzez indeks.
Ważną listą, która nie jest odwzorowana na Windows Runtime, jest ObservableCo11 ection. Jest to specjalna lista, ponieważ działa ona w systemie wiązania danych; informacje na jego temat znajdują się w rozdziale 3., „Język XAML (Extensible Application Markup Language)". Klasa ObservableCo11 ection implementuje interfejs I Noti fyCo11 ectionChanged, który został zaprojektowany w celu powiadamiania nasłuchów o zmianach na liście - gdy na przykład elementy zostały dodane lub usunięte albo została odświeżona cała lista.
156
•
Rozdział 6. Dane
Dla zapewnienia odpowiedniej wydajności system wiązania danych nie kontroluje stale list związa nych z kontrolkami UL Zamiast tego początkowo dowiązane listy są używane do generowania kontrolek na ekranie. W czasie manipulacji listami system wiązania danych otrzymuje powiadomienie za pomocą zdarzenia Co11 ect i onChanged i może użyć listy dodanych i usuniętych elementów do odświeżenia wy świetlanych kontrolek. Bez tego interfejsu jedynym sposobem na odświeżenie listy w Ul jest wygenero wanie zdarzenia PropertyChanged dla właściwości udostępniającej listę. Jest to nieefektywne, ponieważ powoduje odświeżenie całej listy, a nie tylko zmienionych elementów.
Zapytania zintegrowane z językiem {LINQ) Jedną z głównych zalet korzystania z kolekcji jest możliwość pisania dla nich zapytań z zastosowaniem systemu zapytań zintegrowanych z językiem, czyli LINQ. Funkcja ta rozszerza składnię języka C# o moż liwość odpytywania i aktualizacji danych. Sam mechanizm LINQ korzysta z dostawców dla różnych typów magazynów danych, na przykład baz danych (SQL) lub dokumentów XML. Dostawca LINQ to Objects obsługuje klasy implementujące interfejs I Enumerable, dzięki czemu może być wykorzystywany do ope racji na większości kolekcji. Dostawca LINQ to Objects jest implementowany jako zbiór metod rozszerzających dla istniejącego interfejsu I Enumerable. Te metody rozszerzające są zadeklarowane w przestrzeni nazw System.Li nq. Me tody rozszerzające pozwalają na dodanie metod do istniejących typów bez potrzeby tworzenia nowego typu. Są to specjalne metody statyczne, które korzystają z modyfikatora thi s dla pierwszego parametru. Więcej informacji na temat metod rozszerzających można znaleźć pod adresem http://msdn.microsoft. com!en-us!library!bb383977(v=vs.11 O).aspx.
Aby skorzystać z zapytania LINQ, należy wykonać trzy podstawowe kroki. Pierwszym jest zapewnie nie źródła danych lub kolekcji, na którym będzie operowało zapytanie. Drugim jest utworzenie zapyta nia, a ostatnim jest wykonanie tego zapytania. Trzeba pamiętać, że utworzenie zapytania nie powoduje jeszcze wykonania jakiejkolwiek akcji na źródle danych. Zapytanie jest wykonywane, gdy jest potrzebne, na przykład w momencie pobrania przez nas wyników. Jest to nazywane wykonaniem opóźnionym. LINQ obsługuje różne operacje zapytań. Obsługuje również wiele składni odpytywania danych. W kla sie BlogDataSource z projektu Wintellog znajduje się metoda Li nqExamples. Metoda ta nie jest wywoływa na przez aplikację, jej zadaniem jest pokazanie różnych typów zapytań LINQ oraz ich składni. Pierwsza składnia jest określana jako składnia zapytań LINQ i przypomina składnię T-SQL, którą wykorzystuje się przy pracy z bazami danych. Druga składnia jest oparta na metodach, więc jest nazywana składnią metod. Składnia metod wykorzystuje wyrażenia lambda.
Poniższa seria przykładów pokazuje obie składnie, zaczynając od składni zapytań. Zapytania Za pomocą prostych zapytań można przeglądać kolekcje i zwracać interesujące nas właściwości. Poniż sze przykłady tworzą listę zawierającą tytuły z grup blogów: var query = from g in Grouplist select g.Title; var query2 = Grouplist.Select(g => g.Title); Filtry Filtry pozwalają na ograniczenie zakresu danych zwracanych przez zapytanie. Filtrowanie można reali zować za pomocą funkcji porównujących i operujących na właściwościach. W poniższych przykładach lista jest ograniczona do grup, których tytuł zaczyna się od litery A.
Zawartość WWW
157
var filter = from g in Grouplist where g.Title.StartsWith("A") select g; var filter2 = Grouplist.Where(g => g.Title.StartsWith("A"));
Sortowanie Dane można sortować w porządku rosnącym lub malejącym, według wybranych właściwości. Poniższe zapytania sortują blogi według tytułów: var order = from g in Grouplist orderby g.Title select g; var order2 = Grouplist.OrderBy(g => g.Title);
Grupowanie Zaawansowaną funkcją LINQ jest możliwość grupowania podobnych wyników. Jest to szczególnie uży teczne w aplikacjach Windows 8 dostarczających listy dla kontrolek obsługujących grupy. Poniższe za pytania tworzą grupy, bazując na pierwszej literze tytułu blogu: var group = from g in Grouplist group g by g.Title.Substring(O, l); var group2 = Grouplist.GroupBy(g => g.Title.Substring(O, l));
Złączenia i projekcje Możliwe jest połączenie ze sobą wielu źródeł danych i dokonanie projekcji na nowy typ zawierający istot ne w danej chwili właściwości. Poniższe zapytanie łączy elementy z dwóch blogów na podstawie daty publikacji, a następnie dokonuje projekcji wyniku na nową klasę z właściwościami dla tytułu źródłowe go i docelowego: var items = from i in Grouplist[O].Items join i2 in Grouplist[l].Items on i.PostDate equals i2.PostDate select new SourceTitle = i.Title, TargetTitle = i2.Title };
To samo zapytanie zapisane z użyciem wyrażeń lambda wygląda następująco: var items2 = Grouplist[O].Items.Join( Grouplist[l].Items, gl => gl.PostDate, g2 => g2.PostDate, (gl, g2) => new { SourceTitle = gl.Title, TargetTitle = g2.Title });
W tym punkcie pokazałem jedynie niewielki fragment możliwości LINQ. Więcej informacji na temat
LINQ można znaleźć pod adresem http://msdn.microsoft.com!en-us!library!bb383799(v=vs.110).aspx.
Zawartość WWW Windows Runtime ułatwia pobieranie i przetwarzanie danych WWW. Do odczytywania stron WWW wykorzystywana jest klasa HttpCl i ent. Klasa ta jest podobna do WebCl i ent, którą powinni znać progra miści Silverlight. Jest ona używana do wysyłania i odbierania podstawowych żądań protokołu HTTP.
158
•
Rozdział 6. Dane
Może być stosowana do wysyłania dowolnych standardowych żądań HTTP, w tym GET, PUT, POST oraz DELETE. Klient zwraca obiekt HttpResponseMessage wraz z kodem statusu oraz nag łówkami odpowiedzi.
Właściwość Content zawiera aktualną, pobraną zawartość strony WWW.
•DOSTĘP SIECIOWY Użycie klasy HttpCl i ent wymaga, aby aplikacja otrzymała odpowiednie uprawnienia. Do lokalizo wania serwera docelowego potrzebne jest kilka różnych uprawnień. Jeżeli serwer WWW znajduje się w sieci prywatnej lub domowej, należy zadeklarować uprawnienie Private Networks (Client & Server). W większości przypadków będziemy korzystać z serwera znajdującego się w internecie. Wymaga to zadeklarowania uprawnienia Internet (Client), które jest automatycznie ustawiane przy tworzeniu nowego projektu.
Klasa Bl ogDataSource zawiera metody pomocnicze zwracające obiekt HttpCl i ent. Metody te usta wiają wielkość bufora w taki sposób, aby mogły być załadowane duże strony, oraz przypisują odpowied nią wartość user agent dla żądań. Wartość user agent jest najczęściej wykorzystywana do identyfikacji przeg lądarki wysyłającej żądanie. W przypadku dostępu programoweg o przekazujemy wartość charak terystyczną dla aplikacji oraz zawierającą oczekiwaną zgodność. Przekazanie wartości określającej urzą dzenie mobilne może spowodować, że serwer WWW zwróci stronę zoptymalizowaną dla przeg lądarek mobilnych. Windows Runtime ułatwia pobieranie strony w sposób asynchroniczny i przetwarzanie wyników. Poniższe dwa wiersze kodu pozwalają na pobranie strony: var client = GetClient(); var page = await client.GetStringAsync(item.PageUri);
Grafika zwykle nie jest dołączana do kanału RSS, więc kod pobiera stronę docelową pozycji, a na stępnie wyszukuje w niej obrazy. Jest to realizowane za pomocą wyrażeń reg ularnych. Składnia wyrażeń regularnych zapewnia spójny sposób na dopasowywanie wzorców w tekście. Jest to idealne do analizo wania znaczników, takich jak używane w HTML.
•WYRAŻENIA REGULARNE Wyrażenia regularne są bardzo zaawansowanym mechanizmem do wyszukiwania i zamiany wzor ców w tekście. Pierwsze parsery wyrażeń reg ularnych były dostępne we wczesnych dystrybucjach systemów uniksowych i były zintegrowane z edytorami tekstu oraz narzędziami wiersza polecenia, co pozwalało na analizowanie dużych zbiorów danych. W przypadku .NET Framework dostępna jest klasa System. Text. Regul arExpressi ons.Regex, która pozwala przetwarzać tekst za pośrednictwem wyrażeń reg ularnych. Większość operacji wymaga przekazania dwóch ciągów znaków - docelowe go ciąg u zawierającego tekst do przetwarzania oraz ciągu wzorca zawierająceg o wyrażenie reg ular ne. Więcej informacji na temat składni wyrażeń regularnych oraz sposobu ich użycia w .NET znaj dziesz na stronie http://msdn.microsoft.com!en-us!library!hs600312.aspx.
Pierwsze wyrażenie regularne pozwala wyszukać wszystkie znaczniki obrazów w kodzie źródłowym strony WWW:
Udostępniana zawartość
159
public const string IMAGE_TAG = @11lideSmal1ImageAndText03 {
Są u areCo nt ent = są ua reTile
);
=
Title ; wideTile. Image. Src = item. DefaultimageUri.ToSt rin g(}; w ide Til e. Te:xtBodyUra p . TeKt = item. Title; wi deTile . I ma ge . A lt
Cl
item .
Far
notification = \.,.id e: Tile: .Cre:ate:ffotification(LI notification. Tag = string. Format (" Ele me nt {0}" J x++); Ti le:Upd ate:ł1anager .Cre:ate Tile:UpdaterForApplication() .U p d a te: (notification ) ;
I
11 wysłanie: powiad omien i a if (notificationCount--
Efekt działania operacji udostępniania jest pokazany na rysunku 8.11. Zwróć uwagę, że wyświetlane są tytuł i opis, po którym znajduje się tytuł jako hiperłącze i zawartość artykułu. Aplikacja wyświetli pra widłowo takie dane pochodzące z dowolnej aplikacji korzystającej z tego samego schematu. Kontrakt Share jest zaawansowaną funkcją pozwalającą na współdzielenie treści pomiędzy aplikacjami. Nasza aplikacja może wyświetlać dane bez konieczności sprawdzania, w jaki sposób są zainstalowa ne inne aplikacje. Pozwala to na obsługę zaawansowanych scenariuszy, na przykład wysyłania treści na witrynę Twitter lub Facebook bez konieczności samodzielnej implementacji odpowiedniego kodu. Gdy użytkownik zainstaluje aplikację obsługującą media społecznościowe jako cel udostępniania, to Twoja aplikacja może udostępniać dane w sieci po kilku stuknięciach w opcje.
Ustawienia
209
Rysunek 8.11. Udostępnianie artykułu z blogu
Ustawienia Kontrakt Settings pozwala na zapewnienie spójnego sposobu na udostępnianie informacji o aplikacji oraz jej ustawień. W rozdziale 4., „Aplikacje Windows 8", pokazałem, jak można podłączyć ekran ustawień. W przykładzie tym była wykorzystana własna kontrolka obsługująca animację panelu. W tym rozdziale pokażę, w jaki sposób użyć biblioteki open source, aby jeszcze łatwiej tworzyć panel ustawień. Autorem tej biblioteki, o nazwie Callisto, jest pracownik Microsoftu, Tim Heuer.
http :IItimheuer.comlblogiarchivel20121051311introducing-callisto-a-xaml-toolkit jor-metro-apps.aspx Pierwszym krokiem jest zainstalowanie Callisto za pomocą NuGet. We wcześniejszej części rozdzia łu pokazywałem, jak używać Package Manager Console. Istnieje również interfejs graficzny. Aby otwo rzyć to okno dialogowe, wybierz Tools!Manage NuGet Packages for Solution. W lewym panelu wybierz opcję Online i wpisz Calli sto w polu wyszukiwania. Po wyświetleniu nazwy pakietu kliknij przycisk
Install, aby pobrać pakiet i dodać do projektu referencję do niego, jak jest to pokazane na rysunku 8.12. Pakiet ten można też pobrać z repozytorium pod adresem https:llgithub.comltimheuer!callisto. Po zainstalowaniu Callisto możesz szybko i łatwo dodać panel ustawień. Na początek dodawany jest nowy typ dziedziczący po UserControl o nazwie WintellogSettings. XAML zawiera prostą listę z nazwą aplikacji, łącze do witryny z kodem źródłowym oraz przycisk do pobrania Uri kanału (będzie on teraz dostępny w ustawieniach, a nie jako polecenie paska aplikacji, jak poprzednio). Kod XAML panelu usta wień jest zamieszczony na listingu 8.8. Listing 8.8. Prosty kod XAML dla panelu ustawień
st ed a ka es. ln all
p c
g
All
StableOnly
r ..._..
callisto
"' Sort by: MostDownloa ds.
Calirto A�ontrol suitefor some c mm n thingsa � � _ WindowsSXAML app llcat 1onm1ghtwa ntto.„
�
NuGetofficial packa g e source
I> Updates.
·�
i
o
� ' :
I·
Id: Callis to Version:1,2.6 LastUpdated:l/2>/2013
'
�l: �:��� :��:� !'.:��: ;��
X
Cre.atedby:Tim Heu er
n i e Cal b i um.M u i o with
the Callis to'sd ial ogs in Windows8 Store apps.
I> Recentpackages
Down loads: 12465 V i e wlicenseTerms Pr
oj ct nforma e
l
ReportAbus.e
tion
Descriptkm: Acontrolsuite:forsome:commonthn i gsa Wn i dowsBXAML applicat i on mg i htwantto m i lude suc has aFlyout,Menu ,Rating, Settings.Pane, and Pivot c ontrol. Tags: ll:amlwinrtflyouts.ettings popup menuwinSme tropivotratingi;.
D
fli pvi � włl t r!"' m11 r k: epe nden cies: NDDep en den c ies.
Each packageis.licens.edtoyou byrts. owner.Micros.oftis.notrespons.ible for,nordo�i tgrant11nylic!"'ns.!"'s.to, third-p11rtyp11ck:11gs !"' .
Rysunek 8.12. Użycie okna NuGet Package Manager do zainstalowania Callisto Content="Kliknij, aby pobrać kod źródłowy"/>
Zamieszczony na listingu 8.9 kod ukryty obsługuje kliknięcie przycisku w celu pobrania adresu Uri kanału oraz wyświetlenia go. Listing 8.9. Kod wyświetlający adres Uri kanału private async void Button_Click_l(object sender, RoutedEventArgs e)
{ var message = App.Instance.Channel
!= null
? "Kanał został skopiowany do schowka." : string.Format("Błąd:
{O}",
App.Instance.ChannelError);
var dataPackage = new DataPackage(); if (App.Instance.Channel != null)
{ dataPackage.SetText(App.Instance.Channel.Uri); Clipboard.SetContent(dataPackage); var dialog = new MessageDialog(message); await dialog.ShowAsync();
Procedura obsługi dla CommandsRequested jest rejestrowana w klasie App w momencie uruchomienia aplikacji: private void RegisterSettings()
{ var pane = SettingsPane.GetForCurrentView(); pane.CommandsRequested += Pane_CommandsRequested;
Ustawienia
211
W procedurze obsługi rejestrowana jest z kolei opcja menu o nazwie „Informacje": void Pane_CommandsRequested(SettingsPane sender, SettingsPaneCommandsRequestedEventArgs args) var aboutCommand = new SettingsCommand("About", "Informacje", SettingsHandler); args.Request.ApplicationCommands.Add(aboutCommand);
Na koniec użyta jest klasa Callisto Sett i ngsFl yout w celu pokazania panelu. Kod ten jest zamieszczo ny na listingu 8.10. Listing 8.1 O. Użycie klasy SettingsFlyout
z
Callisto
private SettingsFlyout _flyout; private void SettingsHandler(IUICommand command)
{ flyout = new SettingsFlyout
{ HeaderText = "Informacje", Content = new WintellogSettings(), IsOpen = true
}; flyout.Closed += (o, e) =>
flyout
null;
Zwróć uwagę, że użycie specjalnej kontrolki polega wyłącznie na zdefiniowaniu nagłówka, przypisa niu jej zawartości (w tym przypadku kontrolki użytkownika) i jej otwarciu. Dodatkowo po zamknięciu panelu ustawień wszystkie referencje do kontrolki są usuwane. Wynik otwarcia nowej strony informa cyjnej z panelu Ustawienia jest pokazany na rysunku 8.13.
Rysunek 8.13. Panel informacyjny
z
ustawień
212
•
Rozdział 8. Tworzenie paneli w aplikacji
Ten prosty przykład demonstruje hiperłącze i przycisk, ale tego samego podejścia możesz użyć do skonstruowania okna z wieloma ustawieniami z aplikacji. Wystarczy zbudować interfejs użytkownika dla dostępnych ustawień i zapisać go za pomocą metod pokazanych w rozdziale 6., „Dane".
Podsumowanie W rozdziale tym wyjaśniłem, jak budować panele aplikacji wykorzystujące wbudowane kontrakty Win dows 8. Kontrakty zapewniają spójny, standardowy sposób interakcji aplikacji z innymi aplikacjami oraz platformą Windows 8. Można dzięki temu zapewnić wyszukiwanie zintegrowane, udostępnianie tekstu sformatowanego, obrazów i innych danych, jak również utworzyć standardowy interfejs użytkownika dla ustawień aplikacji. W następnym rozdziale, „MVVM i testowanie", przedstawię sposoby lepszej organizacji kodu w opar ciu o wzorzec MVVM. Jedną z zalet tego wzorca jest zwiększenie możliwości testowania. Wyjaśnię, dla czego testowanie jest ważne i jak budować automatyczne testy jednostkowe dla aplikacji Windows 8. Po każę, jak MVVM może pomóc budować aplikacje korzystające z innych technologii, takich jak WPF lub Silverlight, które współdzielą kod z aplikacją Windows 8.
9. MVVM i testowanie
M
VVM TO SKRÓT OD NAZWY WZORCA PROJEKTOWEGO „model-widok-widok-model". Jest to wzorzec (uniwersalnie stosowane rozwiązanie często spotykanego problemu) wprowadzony
wiele lat temu w programowaniu dla Windows Presentation Foundation (WPF), a później zaadaptowa ny dla Silverlight, aplikacji WWW takich jak knockout.js oraz aplikacji dla Windows Phone, Xbox i Win dows 8. Podstawowym zadaniem MVVM jest oddzielenie implementacji Ul od prezentacji i logiki biz nesowej, korzystających z wiązania danych do połączenia warstw. Podejście takie ma kilka zalet, takich jak ułatwienie pracy nad projektem (wyglądem i zachowaniem) oraz testowania aplikacji. Dzięki zasto sowaniu wzorca MVVM można korzystać z przenośnej biblioteki klas (PCL) do wykonania komponen tów i testów, które można współdzielić między aplikacjami WPF, Silverlight oraz Windows 8. Więcej informacji na temat PCL znajduje się w dalszej części rozdziału. Być może zauważyłeś, że w Visual Studio 2012 dla C# z szablonami XAML wzorzec MVVM jest ob sługiwany w standardowy sposób. Klasa LayoutAwarePage zawiera właściwość słownikową Defaul tVi ew Model. Dane, w tym klasy implementujące powiadomienia o zmianie wartości właściwości, są wiązane
ze słownikiem, a następnie używane w kodzie. MVVM jest preferowanym wzorcem w aplikacjach Win dows 8, ponieważ korzysta z systemu wiązania danych w XAML, na którego temat informacje znajdują się w rozdziale 3., „Język XAML (Extensible Application Markup Language)". Inną zaletą wzorca MVVM jest ułatwienie korzystania z testów. Testowanie jest jednym z tych zadań, do których programiści mają skrajne uczucia, od uwielbienia do nienawiści. Mam nadzieję, że uda mi się pokazać w tym rozdziale, że prawidłowo realizowane testy jednostkowe mogą zaoszczędzić wiele czasu w trakcie programowania i ułatwić utrzymanie i rozszerzal ność aplikacji. MVVM zapewnia dobrą podstawę w pracy nad testami, ponieważ dobrze zdefiniowany kod ułatwia również pisanie testów. Właściwe użycie MVVM z testami ułatwia budowanie aplikacji, szczególnie w przypadku pracy w du żych zespołach lub osobnych zespołach projektantów interfejsu i programistów. Użycie testów jednostko wych pozwala też zredukować liczbę problemów zgłaszanych przez klientów, ponieważ błędy są wykrywane na wcześniejszych etapach procesu produkcji. Testy jednostkowe ułatwiają rozszerzanie i przebudowy wanie aplikacji, a sam wzorzec MVVM pozwala na realizację procesu nazywanego przeze mnie izolacją
przebudowy, który umożliwia wprowadzanie modyfikacji do określonych obszarów aplikacji bez koniecz ności przeglądania i modyfikowania każdego modułu z powodu efektów ubocznych zmian.
214
•
Rozdział 9. MWM i testowanie
Wzorce projektowania interfejsu użytkownika Wzorce projektowe interfejsu użytkownika (UI) są uniwersalnymi rozwiązaniami, jakie zostały opraco wane w celu rozwiązywania problemów z utrzymaniem warstwy prezentacji aplikacji w sposób niezależ ny od bazowej logiki biznesowej, usług i danych. Przykładami tak rozwiązywanych problemów są: •
Elastyczność interfejsu użytkownika - z czasem zmiany w wyglądzie, działaniu oraz interakcji stają się znaczące. Dobrze zdefiniowany i prawidłowo zaimplementowany wzorzec projektowy
Ul pozwala izolować te zmiany, dzięki czemu minimalizują wpływ na podstawowe funkcje logiki biznesowej oraz logiki danych. Objawia się to w istniejących szablonach, które mogą udostępniać dane w różnych widokach (przyciągnięty, poziomy i pionowy) bez konieczności zmiany bazowych klas dostarczających dane. •
Równoległe programowanie i projektowanie - często zdarza się, że zespół projektantów jest oddzielony od zespołu programistów z uwagi na różne wymagane umiejętności. Wzorce projektowe Ul mogą zmaksymalizować efektywność przepływu pracy pomiędzy tymi zespołami i zapewnić wymaganą separację pozwalającą na jednoczesną pracę obu zespołów przy minimalnej liczbie konfliktów. Dane dostępne na etapie projektowania pozwalają programistom na operowanie bezpośrednio na XAML bez konieczności jego rozumienia lub bez potrzeby interakcji bezpośrednio z bazową logiką.
•
Oddzielenie logiki prezentacji
-
w warstwie prezentacji istnieją często stosowane wzorce,
takie jak listy elementów z możliwością wyboru jednego elementu, które mogą być zrealizowane na kilka sposobów (lista rozwijana, siatka, pole listy itd.). Wzorce projektowe Ul pomagają przy oddzielaniu elementów danych od prezentowanych informacji, dzięki czemu podstawowe funkcje mogą pozostać bez zmian, niezależnie od sposobu realizacji wzorca. •
Testowanie logiki widoku - realizacja złożonej logiki widoku jest zadaniem programistów. Testowanie logiki jest ułatwione, jeżeli nie jest wymagane uruchamianie pełnego interfejsu użytkownika. Przykładem mogą być listy zależne - wybór elementu z pierwszej listy determinuje zawartość drugiej z nich. Idealnie byłoby zaimplementować tę funkcję i przetestować ją bez konieczności rysowania odpowiednich kontrolek list rozwijanych oraz przetwarzania zdarzeń kliknięcia.
W roku 2005 John Gassman, programista pracujący nad WPF - który w tym czasie miał nazwę ko dową Avalon
-
opublikował na blogu artykuł, w którym przedstawił światu wzorzec MVVM (http:!!
blogs.msdn.com!b!johngossman!archive/2005/10/081478683.aspx). W artykule tym opisał „odmianę wzorca
model-widok-kontroler (MVC), który jest przystosowany dla platform programowania nowoczesnych
Ul, w których za widok jest odpowiedzialny projektant, a nie programista". We wprowadzeniu do artykułu przedstawił wartościowy punkt widzenia na oryginalne przyczyny powstania wzorca - przepływ pracy pomiędzy projektantem i programistą. Artykuł Gossmana wyja śnia, że widok jest definiowany deklaratywnie (z użyciem XAML) i jest odpowiedzialny za pola danych, skróty klawiszowe, elementy wizualne itd. Model widoku jest odpowiedzialny za te zadania, które są zbyt specyficzne dla ogólnego widoku (na przykład złożone operacje Ul), utrzymanie stanu widoku oraz pro jekcja modelu na widok, szczególnie gdy model zawiera typy danych, których nie da się bezpośrednio odwzorować w kontrolkach. MVVM korzysta z wiązania danych oraz Visual State Manager (VSM) do komunikacji pomiędzy im plementacją Ul a logiką biznesową oraz prezentacji. Zamiast generować zdarzenia, widok steruje mode lem za pomocą wiązania danych - albo przez aktualizację wartości zsynchronizowanej z właściwością modelu widoku, albo przez odwzorowanie zdarzenia na polecenie uruchamiane w modelu widoku. Logi-
Wzorce projektowania interfejsu użytkownika
215
ka prezentacji istnieje w modelu widoku w postaci kodu, który realizuje zachowania, wyzwalacze, stany wizualne oraz konwersję wartości w widoku. W aplikacji bazującej na szablonach Visual Studio 2012 klasa LayoutAwarePage automatycznie wykry wa zmiany w stanie widoku (na przykład przechodząc do widoku przyciągniętego lub zmieniając orien tację z pionowej na poziomą). Metoda I nvali dateVi sual State korzysta z VSM do ustawienia nowego stanu wizualnego: string visualState
=
DetermineVisualState(ApplicationView.Value);
foreach (var layoutAwareControl in this._layoutAwareControls)
{ VisualStateManager.GoToState(layoutAwareControl, visualState,
false);
VSM pozwala w XAML na definiowanie odpowiednich szablonów dla różnych stanów. We wcze śniejszych rozdziałach książki pokazałem, jak zrealizować widok przyciągnięty oraz jak przełączyć się z kontrolki Gri dVi ew na Li st Vi ew w momencie zmiany orientacji. Projekt jest zdefiniowany w XAML niezależnie od bazowego kodu, co zapewnia jasne rozdzielenie zadań. Działanie takiego mechanizmu w projekcie Wintellog jest zilustrowane na rysunku 9.1. Zwróć uwa gę, że klasa LayoutAwarePage zawiera słownik modelu widoku, obsługuje zmiany za pomocą VSM oraz jest klasą bazową, po której dziedziczy XAML przy tworzeniu widoku. Klasa BlogDataSource współdzia ła z resztą aplikacji w celu pobrania danych i ich udostępnienia poprzez słownik modelu widoku dostęp ny poprzez właściwość Groupli st.
W1ązan1e danych
Model
Rysunek 9.1. Wzorzec MWM używany przez aplikację Wintellog
Podobnie jak inne wzorce, MVVM jest rozwiązaniem często spotykanych problemów. Jeżeli jest on prawidłowo użyty, powinien ułatwiać zadanie budowania aplikacji Windows 8. Niestety, wzorzec ten może być zastosowany w niewłaściwy sposób, co w efekcie spowolni projekt i niepotrzebnie go skompli kuje. Osobiście napisałem kilka aplikacji użytkowych, korzystając z wzorca MVVM, i jestem zadowolo ny, że Microsoft zdecydował się, aby użyć go w swoich szablonach aplikacji Windows 8. Pierwszym za stosowaniem MVVM w Visual Studio były szablony Panorama, wykorzystywane przy programowaniu dla Windows Phone. Choć wzorzec jest używany od wielu lat, nadal bywa wykorzystywany niewłaściwie. W tabeli 9.1 wymieniono często spotykane błędne wyobrażenia na jego temat oraz podano prawidłowe zastosowania.
216
•
Rozdział 9. MWM i testowanie
Tabela 9.1. Często spot y kan e błędne wyobrażenia na temat MWM Nieprawda
Prawda
MWM jest niesamowicie
Wzorzec MVVM może być niezwy kle prosty, jeżeli zostanie prawidłowo
skomplikowany.
zaimplementowany.
W MWM nie jest dozwolone użycie kodu ukrytego.
Kod ukryty jest właściwie rozszerzeniem deklaratywnego XAML dla widoku. Widok jest odpowiedzialny za zarządzanie interfejsem użytkownika, w tym wprowadzanie danych przez użytkownika, więc nie ma powodu, aby kod ukryty nie mógł operować na zdarzeniach i interakcjach.
MWM to trudny
Istnieje wiele bibliotek (na przykład MVVM Light oraz Caliburn.Micro)
do implementacji.
pozwalających na utworzenie i uruchomienie nowego projektu w kilka minut, w tym wbudowane w Visual Studio 2012 szablony dla C# z XAML.
MWM eliminuje potrzebę korzystania z konwerterów
Konwertery wartości są uniwersalnymi, łatwymi do testowania modułami kodu, które pomagają odwzorowywać model na widok, więc nie ma powodu,
wartości.
aby eliminować je z wzorca MWM.
MWM zmniejsza wydajność
Niewłaściwa implementacja wzorca może powodować problemy z wydajnością. Prawidłowe użycie MVVM z wykorzystaniem testów
aplikacji.
pomaga w dostrajaniu i poprawianiu wydajności. MWM nadaje się tylko do
Dobrą bibliotekę MVVM można stosować zarówno w małych, jak i dużych
bardzo dużych projektów.
projektach.
MWM nadaje się do obsługi
MVVM pozwala definiować zadania różnych modułów w kodzie. Polecenia,
systemów poleceń
biblioteki komunikatów i inne konstrukcje są po prostu pomocnikami
i komunikatów.
i elementami budulcowymi.
MWM jest trudny
Wzorzec MVVM nie jest trudniejszy do zrozumienia niż wiązanie danych i Visual State Manager, ponieważ jest tylko wzorcem, który opisuje możliwie
do zrozumienia.
najlepszy sposób użycia tych funkcji.
W dalszej części tego rozdziału przedstawię różne elementy MVVM i pokażę, w jaki sposób można je wykorzystać przy testowaniu. Jeżeli przeczytałeś poprzednie rozdziały książki i analizowałeś przykłady, znasz już MVVM, ponieważ tworzyłeś klasy implementujące powiadomienia o zmianie wartości właści wości w celu realizacji wiązania danych. Klasy te mogą być uważane za modele widoku. Więcej informa cji na temat widoków modeli znajduje się w dalszej części rozdziału. Pomimo wielu błędnych wyobrażeń na temat MVVM istnieje wiele zalet tego wzorca, dzięki którym oddzielenie projektu od kodu staje się bardzo łatwe. Jeżeli będziesz stosował wzorzec MVVM w aplika cjach, to zgodnie z moim doświadczeniem możesz liczyć na następujące korzyści: 1.
Odpowiednie rozdzielenie problemów (separacja)
-
MVVM zapewnia realizacje najlepszych
praktyk architektury oprogramowania. 2.
Przepływ zadań między projektantami i programistami
-
dzięki wykorzystaniu danych
projektowych MVVM pozwala na równoległe programowanie oraz projektowanie przez wielu członków zespołów pracujących nad tym samym projektem. 3.
Testowanie jednostkowe
-
więcej informacji na temat testowania znajduje się w dalszej
części rozdziału. 4.
Użycie wiązania danych
-
MVVM w sposób bezpośredni wykorzystuje zaawansowany
system wiązania danych dostępnych w XAML i aplikacjach Windows 8, który pozwala również na stosowanie danych projektowych.
Wzorce projektowania interfejsu użytkownika
5. Ulepszone wielokrotne użycie kodu
-
217
modele widoku mogą być używane do zasilania wielu
widoków, a klasy pomocnicze i szkielety mogą być wykorzystywane wielokrotnie w projekcie, jak również w różnych produktach tworzonych w Twojej organizacji, nawet zbudowanych z użyciem innych technologii, takich jak WPP i Silverlight. 6. Modularność
-
MVVM zachęca do projektowania modularnego, które ułatwia modyfikowanie
części aplikacji w sposób niezależny od pozostałych. 7. Refaktoring kodu
-
dzięki odpowiedniemu rozdzieleniu problemów MVVM minimalizuje
wpływ refaktoringu modułów na pozostałe jej obszary. 8. Rozszerzalność
-
dobrze zaprojektowana biblioteka MVVM ułatwia rozszerzanie aplikacji
przez dodawanie nowych ekranów i modułów. 9. Obsługa narzędzi
-
w Visual Studio wbudowane są różnorodne narzędzia projektowe,
takie jak Expression Blender, które mogą bezpośrednio korzystać z MVVM. 10. Słownik wzorców.
Ostatni punkt, słownik wzorców, wymaga dodatkowego wyjaśnienia. W czasie nauki czytania istnie je silna korelacja pomiędzy rozmiarem słownika a zdolnością rozumienia czytanego tekstu. Nie jest to niespodzianka, ponieważ wszyscy rozumiemy, że słownik zawiera bloki budulcowe tekstu, jaki chcemy zrozumieć, a brak rozumienia tych bloków prowadzi do nieprawidłowych konkluzji i błędnej interpre tacji tekstu. Choć istnieje ta silna korelacja, słownik nie gwarantuje zrozumienia, ponieważ konieczna jest umiejętność łączenia słów ze sobą i określanie ich znaczenia jako całości. Tworzenie oprogramowania jest również zadaniem wykorzystującym słownik. Zaczynamy od słow nika języka, w którym programujemy. Programy mają własną składnię i gramatykę, a ich zrozumienie zależy od możliwości prawidłowej interpretacji słów kluczowych i rozumienia ich w kontekście. Wzorce stanowią słownik wyższego poziomu, który może opisywać całe procedury i komponenty w systemie. Podobnie jak w przypadku słownika, znajomość wzorców nie jest równoznaczna ze zrozumieniem, w jaki sposób stosować je w aplikacjach. Im lepiej będziesz w stanie rozumieć i integrować wzorce, tym większy słownik zbudujesz i będziesz lepiej rozumiał złożone systemy oprogramowania. Zauważyłem, że programiści zaangażowani w najbar dziej udane projekty oraz pracujący przy najbardziej złożonych systemach zwykle mają bardzo rozbudo wany słownik wzorców. Nie tylko mają wiedzę na temat wielu wzorców istniejących w oprogramowaniu, ale również wiedzą, kiedy ich stosowanie ma sens. Uważam, że MVVM jest popularnym wzorcem dzięki dostarczaniu wcześniej wymienionych korzy ści przy jego prawidłowym zastosowaniu. MVVM jest ważnym wzorcem dla aplikacji Windows 8, po nieważ jest standardowym wzorcem stosowanym we wbudowanych szablonach C# z XAML. Podobnie jak inne wzorce, jest tylko narzędziem, które musi być użyte w celu zrealizowania właściwego zadania. W następnych kilku punktach przedstawię dokładniej poszczególne elementy MVVM, co ułatwi Ci na uczenie się tego wzorca i wykorzystanie go w aplikacjach. Zacznę od omówienia komponentów składa jących się na MVVM.
Model Model jest często mylony z „modelem danych", który jest znacznie bardziej szczegółowy. Lepszą defini cją jest aplikacyjny model świata. Jest to model, który obejmuje wszystko, co musi być wykonane w celu rozwiązania problemu biznesowego bez definiowania specyficznego interfejsu użytkownika lub prezen
modelem domeny, model w MVVM jest faktyczną implementacją.
tacji danych. Niektórzy lubią nazywać tę część natomiast
ale jest to reprezentacja koncepcyjna,
218
•
Rozdział 9. MWM i testowanie
Na przykład system bankowy może zawierać klientów i konta. Reprezentacja klientów i kont jest czę ścią modelu. Model opisuje sposób, w jaki te komponenty są ze sobą związane (klient ma przynajmniej jedno konto), opisuje stan (konto jest otwarte lub zamknięte) i zawiera definicje zachowań (konto pod lega oprocentowaniu). Tworzenie modelu wymaga zdefiniowania klas z właściwościami, bazy danych do przechowywania informacji, różnych API do pobierania i przesyłania danych oraz zastosowania róż nych algorytmów. Prawidłowo zbudowany model powinien udostępniać tylko elementy potrzebne dla aplikacji. Na przykład warstwa prezentacji nie powinna zajmować się sposobem zapisu danych (czy jest to baza da nych, czy plik XML) czy też pobierania danych (czy były przekazane jako obiekt binarny poprzez gniaz do TCP/IP, czy wysłane przez usługę REST). Zbyt otwarty model powoduje powstawanie niepotrzebnych zależności i zwiększenie komplikacji kodu. Model dla aplikacji Wintellog obejmuje blogi i artykuły, jak również API sieciowe oraz API współ pracy wykorzystywane do ich pobierania. Zawiera też API WinRT wykorzystywane do wysyłania kafel ków i powiadomień. Częścią modelu jest ponadto kod używany do zapisywania elementów w pamięci podręcznej i pobierania ich stamtąd. Wszystkie te komponenty współpracują ze sobą, aby dostarczyć użytkownikowi informacje, ale nie istnieje bezpośrednia interakcja z użytkownikiem. Gdy blog jest wy świetlany w aplikacji, nie jest to fizyczna strona WWW, ale dane związane z encją Blag Item. Naszym głównym celem jest napisanie elastycznego, rozszerzalnego, łatwego do testowania i utrzy mania kodu. Gdy model aplikacji jest zgodny z tymi zasadami, wzorzec MVVM może łatwo podłączać się do potrzebnych interfejsów i klas, bez konieczności tworzenia zależności z częściami systemu nie mającymi nic wspólnego z logiką prezentacji. Model ten jest „modelem aplikacji" w realnym świecie, ale w którymś momencie model ten musi być zaprezentowany użytkownikowi. Jest to realizowane przez da ne wyjściowe, co w przypadku aplikacji Windows 8 oznacza użycie bogatego i zaawansowanego interfej su użytkownika
(Ul). Ekrany prezentowane użytkownikowi są nazywane widokami.
Widok Widok w aplikacjach Windows 8 służy do interakcji z użytkownikiem. Sam widok stanowi interfejs użyt kownika. Interfejs użytkownika niemal zawsze jest definiowany w postaci deklaratywnego kodu XAML. XAML współpracuje z systemem właściwości zależnych, dzięki czemu widok jest w stanie prezentować dane użytkownikowi oraz odpowiadać na jego akcje. W tabeli 9.2 przedstawione są elementy widoków oraz ich funkcje. Z tabeli 9.2 powinno jasno wynikać, że widok nie ignoruje całkowicie logiki prezentacji. Polecenia pozwalają na odwzorowanie kontrolek na akcje w modelu widoku, a deklaracje wiązania danych wyma gają wiedzy na temat struktury bazowych danych. Animacje, stany wizualne, szablony, zachowania i wy zwalacze reprezentują różne komponenty logiki biznesowej odnoszące się do widoku. Choć może nie być to oczywiste, wszystkie te komponenty są bezstanowe w odniesieniu do modelu aplikacji. Serie ujęć zapewniają obsługę stanu (uruchamianie, zatrzymywanie, odtwarzanie itd.), podob nie jak grupy stanów wizualnych, ale wszystkie te stany odnoszą się do interfejsu użytkownika. Zacho wania i wyzwalacze również operują na zdarzeniach lub działają na kontrolkach, więc nie powinny mieć zależności z bazowymi danymi i logiką biznesową. Nawet kod ukryty jest zwykle pisany w taki sposób, aby obsłużyć określone aspekty
UL
Bardziej skomplikowany kod powinien być umieszczony w innej
warstwie - nie dlatego, że istnieją zdefiniowane zasady budowania kodu ukrytego, ale dlatego, że bar dziej skomplikowany kod wymaga testowania, a wykonanie osobnych i separowanych klas ułatwia prze prowadzenie testów bez konieczności podłączania pełnego interfejsu użytkownika.
Wzorce projektowania interfejsu użytk ownika
219
Tabela 9.2. Widok w MWM Komponent XAML
Opis Deklaratywne znaczniki pozwalające na definiowanie układu, kontrolek i innych komponentów składających się na ekran.
Konwertery wartości
Specjalne klasy używane do transformowania danych na typ elementu użytkownika i z powrotem.
Szablony danych
Szablony odwzorowujące elementy danych na kontrolki.
Grupy stanów wizualnych
Nazwane stany, które wpływają na właściwości różnych elementów, kontrolujące stan fizyczny bazujący na stanie logicznym kontrolek.
Serie ujęć
Animacje i przejścia.
Działania
Algorytmy uniwersalne, które mogą być stosowane dla różnych kontrolek, zwykle korzystające z właściwości dołączanych.
Wyzwalacze
Algorytmy, które mogą być związane z kontrolkami i wywoływane na podstawie skonfigurowanych zdarzeń, zwykle obsługiwanych za pomocą właściwości dołączanych.
Kod ukryty
Rozszerzenia znaczników XAML pozwalające na realizowanie dodatkowych zadań specyficznych dla Ul.
Gdzie więc powinna być umieszczona logika prezentacji i która część jest odpowiedzialna za utrzy manie stanu biznesowego aplikacji? Stan ten obejmuje prezentowane dane oraz status poszczególnych poleceń i procesów, które sterują interfejsem użytkownika i reagują na akcje użytkownika. Odpowiedzią jest główna część wzorca MVVM, która stanowi o jego odmienności - model widoku.
Model widoku Elementem odróżniającym MVVM od innych wzorców jest
model widoku.
Jest to po prostu klasa, której
zadaniem jest koordynowanie interakcji pomiędzy widokiem i modelem. W modelu widoku powinna być umieszczona większość logiki prezentacji. W mojej opinii dobrze napisany model widoku może być testo wany bez tworzenia żadnych widoków i posiada trzy główne metody do komunikowania się z widokiem: •
wiązanie danych,
•
stany wizualne,
•
polecenia i (lub) wywołania metod.
Pamiętając o tej definicji, napisałem już kilka modeli widoku. Klasa Bl ogDataSource udostępnia wła ściwość Groupl i st, która z kolei zawiera obiekty Bl ogGroup oraz Blag Item. Model widoku zwykle imple mentowany jest jako interfejs z powiadomieniami o zmianie wartości właściwości. Zawiera on często odwołania do API, które włączają wymianę danych i komunikowanie się z modelem. Użycie interfejsu po woduje, że znacznie łatwiej jest pisać przenośny kod, który może być wielokrotnie używany w organizacji. To wszystkie komponenty MVVM. Kluczowym elementem MVVM jest model widoku lub klasa ob sługująca powiadomienia o zmianach właściwości, dzięki czemu może być ona użyta w procesie wiąza nia danych. Model widoku może być zwykłym obiektem domeny, tak jak Blag Item, lub klasą udostęp niającą kolekcje, polecenia i interakcje z innymi interfejsami, podobnie jak Bl ogDataSource. Oddzielenie modelu widoku od Ul pozwala nie tylko na testowanie, ale również na wielokrotne używanie kodu. W po łączeniu z przenośnymi bibliotekami klas (PCL) można efektywnie tworzyć logikę biznesową, którą można współdzielić na różnych platformach.
220
•
Rozdział 9. MWM i tes t owanie
Przenośna biblioteka klas Przenośna biblioteka klas (PCL) jest specjalnym typem projektu w Visual Studio 2012, pozwalającym na pisanie podzespołów pracujących na wielu platformach .NET. Jest to idealny sposób na tworzenie współ dzielonych komponentów z logiką biznesową, które można wykorzystywać w aplikacjach Windows 8 oraz aplikacjach pulpitu. Podzespół zbudowany na bazie szablonu projektu PCL może działać na tych platformach bez konieczności rekompilacji. PCL udostępnia podzbiór API, które są wspólne dla wszystkich platform. Przy tworzeniu projektu PCL jesteś proszony o wybór platform, na których chcesz uruchamiać ten kod, jak pokazano na rysunku 9.2.
g
Add Portable Class Library Iarget frameworks::
1.NET i [;.;] lw n ows Phone 7 [;.;] .NET
[;.;] [;.;]
Framework4.5
silverlight 4 and higher i d
and higher
for Windows Store apps
D Xbox360
work> „. ln>l:all additional fra m e
OK
Rysunek 9.2.
11
Cancel
Wybór docelowych platform dla przenośnej biblioteki klas
Wielkość dostępnego kodu przenośnego zależy od tego, które platformy wybierzesz, ile ich będzie i jak będą stare. Na przykład projekt przeznaczony dla Xbox będzie miał znacznie mniej dostępnych API niż projekt przeznaczony dla Silverlight. Podobnie .NET Framework 4.0 wprowadza więcej ograniczeń niż .NET Framework 4.5. Aby sprawdzić, jakie API będą dostępne po zaznaczeniu platformy, rozwiń węzeł
References z projektu w oknie Solution Explorer. Kliknij prawym przyciskiem myszy Properties i spójrz na właściwość Path. Skopiuj ścieżkę z tej właściwości i otwórz ją w eksploratorze Windows. Na rysunku 9.3 pokazana jest zawartość folderu w przypadku zaakceptowania domyślnych ustawień. Każda kombinacja platform powoduje utworzenie nowego profilu, który zawiera zbiór API działających na wszystkich wybranych platformach. Referencje korzystają z nowej funkcji o nazwie Extension SDK, która pozwala referencjom na dołączanie wielu plików i konfiguracji w przeciwieństwie do jednego pro jektu lub podzespołu we wcześniejszych wersjach. Więcej informacji na temat funkcji Extension SDK można znaleźć pod adresem http://msdn.microsoft.com! en-us!library!hh768146(v=vs.11O).aspx. Jak widzisz, przykładowy profil obsługuje kilka bibliotek. Oprócz podstawowych usług mamy obsłu gę sieci, serializacji oraz usług sieciowych, jak również XML z LINQ. Dla każdego podłączonego podze społu można użyć narzędzia ILDASM.exe do sprawdzenia dostępnych API. Podzespoły te są po prostu kopiami podzespołów z .NET Framework, które są obsługiwane w określonym profilu. Projekt WintellogMccm został w tym rozdziale przebudowany w taki sposób, aby skorzystać z prze nośnych bibliotek kodu. Projekt PortableWintellog ma włączoną obsługę .NET Framework 4.5 oraz apli kacji Windows 8. Projekt zawiera kilka klas i interfejsów, które mogą być współdzielone pomiędzy apli kacjami pulpitu i Windows 8 bez wprowadzania żadnych modyfikacji. Folder Contracts zawiera interfejsy współdzielone pomiędzy platformami. Projekty PCL są doskona łym miejscem dla definicji interfejsów i kontraktów, które nie mają silnych zależności z nieprzenośnymi
Przenośna biblioteka klas
221
Profile? Udostę:pnianie
@
...-
'f'
I
« Framework
,_ .NETPortable
„ v4.S •
Profile • Profile7
•
�Ostatniemiejsca j.Pobrane Pulpit
�
B i b lioteki
[] Dokumenty
./I Muzyka �Ob"zy IE!I Wideo
Komputer
,:!. Dysk lokalny(C:) C':] >tacJa dyskówCD(C �helion(\\vbon.rv}(E �helion(\\vbon.rvJ(2 """Ilf
Sieć
v
Prz5Zukaj:Profile7
C
Typ
*Ulubione
"U.L:'>LLILO:lllO: a p11„.„
lj Microsoft.CSh11rp �Microsoft.Visual81'lsic.dll [:j Microsoft.VisualBasic � ms rn rlib.dll � S.ystem,Collections.Concurrent.dll
O System.Collections.Concurrent
�System.Collfilions..dll [j S ys.tem.Collectiom � Sys.tem,ComponentModel.Annotations.dll
lJ System.ComponentModel.Annotations
� System,ComponentModel.DataAnnotatr...
Rozsz!"'rz!"'nt!"'aplik:... 2012-07-0901'40
Rozszerzenie a lik:...
lllKB
2012-07-0901:40
RozszErzenie aplik:.„
31 KB
2012-06-0423:11
Plik XML
p
1 KB
Rozsz!"'rz!"'nt!"'aplik:... 2012-06-0423:11
Plik XML
2012-07-0901:40
Roz�erzenie aplik:...
2012-06-0423:11
Plik XML
1 KB 31 KB 1 KB
2012-07-0901:40
Rozszerzenie aplik:...
22KB
2012-07-0901: 40
Rozszerzenreaplik:...
21 KB
� Syste:m,ComponcntModcl.dll i§] S ystem.Com p onentMo del.EventBas!"'dAs.. [j System.ComponentModel.EventBasedAs..
2012-06-0423:11
Plik XML
D System.ComponentModel
2012-06-0423:11
Plik XML
� S ystem.Core.dll � System.Diagnostics.Contrads.dll
2012-07-0901:40
Rozszerzenie a lik:„.
2012-07-0901:40
Rozszerzenie aplik:...
2012-06-0423:11
Plik XML
2012-07-0901:40
Rozszerzenie aplik:...
23KB
2012-07-0901:40
Rozszerzenie a lik:.„
21 KB
2012-06-0423:11
Plik XML
LJ S.ystem,Diagno�tics.Contracts
� S.ystem.Diagnostics.Debug,dll [j System.Diagnostics.Debug � S.ystem.Diagnostics.Tools.dl l
[] System.Diagnostics.Tools
�System.Diagnostics.Tracing.dll
Rozsz!"'rzenieaplik:... 1 KB 1 KB
p
24KB 25KB 1 KB
p
1 KB
Rozszerzenieaplik:...
E lementy: 11 9
§oo �
Rysunek 9.3. Profil przenośnej biblioteki klas
API. Interfejsy te mogą pomóc oddzielić logikę specyficzną dla platformy od pozostałej logiki dzięki za stosowaniu mechanizmu odwrócenia sterowania, w skrócie: IoC. IoC pomaga budować klasy, które są łatwiejsze do testowania i mogą być współdzielone pomiędzy platformami. W poprzedniej wersji aplikacji klasa StorageUtility była statyczną klasą używaną do zapisu i odczytu z lokalnej pamięci podręcznej dla aplikacji. Klasa BlogDataSource kontrolowała dostęp do StorageUtility. Miała ona więc dodatkowe zadania związane z interfejsem, realizowane przez statyczne metody klasy. Choć jest to prosty sposób na dostęp do magazynu, tworzy się wówczas silna zależność lub sprzężenie pomiędzy źródłem danych i implementacją logiki przechowywania. Uniemożliwia to współdzielenie klasy Bl ogDataSource przez wszystkie środowiska niedziałające na platformie Windows 8. Dodatkowo trudno
testować tę klasę, ponieważ każdy test będzie wymagał istnienia odpowiedniego magazynu. W projekcie PortableWintellog sterowanie zostało odwrócone. Oznacza to po prostu, że klasa Blog DataSource nie zawiera już funkcji definiujących sposób działania magazynu. Zamiast tego korzysta z in
terfejsu IStorageUtility. Interfejs ten zawiera sygnatury metod pozwalających na zapisanie i pobranie elementów, ale nie wskazuje na jakikolwiek typ implementacji. Dzięki temu klasa Bl ogDataSource stała się luźniej powiązana, ponieważ nie ma już bezpośredniej zależności od implementacji magazynu. Podejście takie ma wiele zalet. Po pierwsze, jest możliwe (i łatwe) testowanie logiki przechowywania w klasie BlogDataSource bez konieczności istnienia fizycznego magazynu. Można napisać klasę pomoc niczą (co pokażę w dalszej części rozdziału), która będzie emulować magazyn na potrzeby testowania. Po drugie, można zaimplementować odpowiedni magazyn dla docelowego środowiska. Projekt Wintel logMvvm zawiera implementację dla aplikacji Windows 8. Projekt WintellogWpf, aplikacja pulpitu ba zująca na WPP, zawiera implementację dla aplikacji pulpitu. Nawet jeżeli implementacje te różnią się, interfejs pozwala na współdzielenie klasy BlogDataSource w obu wersjach aplikacji. Przyjrzyj się projektowi WintellogWpf. Istnieje w nim odwołanie do przenośnej biblioteki klas; dzię ki temu cała logika znajdująca się w klasie BlogDataSource została powtórnie użyta. Obejmuje to logikę pobierania pojedynczych blogów i artykułów z listy, interakcję z pamięcią podręczną, a nawet niektóre funkcje sieciowe. Klasa HttpCli ent jest współdzielona pomiędzy aplikacjami pulpitu i Windows 8, więc może być używana w obu wersjach do ładowania strony artykułu w celu pobrania związanych z nim zdjęć.
222
•
Rozdział 9. MWM i testowanie
Implementacja StorageUt il i ty korzysta z lokalnego systemu plików do przechowywania pamięci podręcznej, a nie z izolowanego magazynu. Wewnętrzna metoda pomocnicza określa ścieżkę folderu aplikacji w systemie: private static string GetRootPath()
{
return Path.Combine( Environment.GetFolderPath( Environment.SpecialFolder.LocalApplicationData), "Wintellog");
Poniżej pokazany jest kod realizujący operację pobrania listy plików. Przed odczytaniem listy pli ków sprawdza on, czy katalog istnieje. Kod jest opakowany w obiekt Task, aby mógł być wykonany asyn chronicznie: var directory= Path.Combine(GetRootPath(), folderName); return Directory.Exists(directory)
? Directory.GetFiles(directory) : new string[O];
Czy pamiętasz wcześniejszy opis odwrócenia sterowania? Aplikacja kontroluje zależności przez ich wstrzykiwanie w czasie uruchamiania. W pliku App.xaml.cs znajdują się poniższe fragmenty kodu, które odwzorowują przenośny kontrakt na implementacje specyficzne dla WPF: Ioc = new Tinyloc(); Ioc.Register(ioc=> new StorageUtility()); Ioc.Register(ioc=> new ApplicationContext()); Ioc.Register(ioc => new WpfDialog()); Ioc.Register(ioc=> new SyndicationHelper());
Po określeniu zależności narzędzie IoC jest używane do wstrzyknięcia ich do klasy Bl ogDataSource z zastosowaniem jej konstruktora: Ioc.Register(ioc=> new BlogDataSource( ioc.Resolve(), ioc.Resolve(), ioc.Resolve(), ioc.Resolve()));
Technika użycia zewnętrznej klasy pomocniczej do wstrzykiwania zależności jest nazywana wstrzy kiwaniem zależności (DI) i jest standardową metodą realizacji IoC. Mała klasa IoC zawarta w przykła dowej aplikacji pokazuje jedynie niewielką część scenariuszy, w których można korzystać z odwrócenia sterowania. Dostępne są liczne dojrzałe biblioteki, w tym używana przeze mnie od kilku lat Managed Extensibility Framework (MEF), która jest dostępna w Windows 8 w postaci pakietu NuGet: http://nuget.
orglpackages!Microsoft.Composition!. Po umieszczeniu logiki w osobnych współdzielonych i lokalnych klasach utworzenie kodu XAML w pliku MainPage.xaml było bardzo łatwe. Jest ona znacznie prostsza niż w aplikacji Windows 8, ale wy korzystuje istniejące klasy. W ten sposób zademonstrowałem, jak można uzyskać inny wygląd i działanie przy użyciu tej samej logiki biznesowej z klas bazowych (rysunek
9.4).
Współdzielenie kodu pomiędzy platformami jest przydatne, ale istnieje jeszcze większa zaleta użycia przenośnej biblioteki klas dla wspólnego kodu - testowanie. Z zastosowaniem tego podejścia będziemy musieli testować główne komponenty tylko raz, nawet jeżeli mogą być one wykorzystywane w wielu apli kacjach. Być może zapytasz, po co testować oprogramowanie.
Dlaczego testujemy? - D-
MainWindow
C#er: IMage
_
Jeffrey Ri
Jeff Prosise's Blog
Review of the Lenovo Idea Pad
Enumerating Cameras and
Yoga 13 for Development
Camera Locations on Your
Blog W h at's new
Surface RT After several m on ths
Edition as ce
ofcomparingvariou s Wind ows 8 devi
� Pas.sed Tests
>o [§ :il,
ret urne d ."
instance was not
G iven TypeConfig ur e dlJhenTypeRe q ue stedThen Type Shoul dBeRet u r ned()
{ _target.Register(tinyioc => new
K
{id = Guid.Ne \'łG ui d( )});
dynamie expected = _target . Reso l ve () ;
Assert, Is ins tan c eOfType( e pe cte d , id, typeof
(Guid), "Tes t
fa iled :
dynamie
[TestMethod] public void GivenTypeConfiguredlJhenSharedinstanceRequestedThenSharedinstanceSI
{
-
100%
_target.Register(tinyioc => new
var e)(pected = _tar get . Reso lve()
;
{id = Guid . NewGui d(} } )
;
S.Olution Explor er
�
Te.amExplorer
Prop erties
Error List Ready
Ln1
Co11
INS
Ch1
--- ·---- ·-- ------
Rysunek 9.5. D4
Wyniki działania testów jednostkowych w Visual Studio 2012
Q l uick
WintellogMwm - Microsoft Visual Studio
EILE
!oDIT
YIEW
8 *@• � C"'� [:� „ ICI
EROJECT
P
�UILD
File at h : " T iny locTes.ts..c �'
QEBUG
I Run._•
(4) O GivenlocContainerWhenlnterf.a... O G ivenType ConfiguredWhen„. < 1 ms O Give.nTyp eConfiguredWhenS.„ < 1 ms O GivenTypeConfiguredWhenT... 78 ms
� Passed Tests
IOOLS
„ ... Local achine „ Debug •Q Tinylo cTe.sts.cs -J;;i X X 1-... �WintellogTei!:.TinylocTests
Streamir.g Video: lmp roving quality wit •
Run All
M
SQL
T EAM
1�:�:: �;�:::�
TE>T
AR!;HITECTURE
A!'!ALYZE
\\'INDOW
l:!ELP
aunch ( C trl
:: i �; : � � �
....
:� "
Te
dio.
,t
P
G'r
lo tform. Uo it Te
, tFramework;
'0 - � �J � '�
ublic class
p ri vate.
M
[Te s tl nitializ e ]
_target „ ne\.,o
Tinyloc( )
;
References iii lmages iiil T estHelp m
•·•
I>
es BlogDlltaSC>urce.Te.sts.c.s �Package.appxmanifest
I>
� Tinyloc Tesh.cs
łEJ I>
[E!I
WintellogTeil:_Te.mporaryKey. p fx
WintellogWpf
[ Tes t:Method ] pu bl ic void GivenlocContaine rhlhe. ninterfaceR e q ue s tThe. nContainerShouldB e Ret urne1 { var actual =
_target. Re. s o lve { }
Assert.AreSame(_targ,et, actua
l,
;
"Test failed: inst a nce was not re tu r ne d . "
[Te stł1eth od]
public void Given TypeConfiguredl JhenTypeReq u estedThe nTy p eShouldBeRetu r ne d()
{
X
P·
I>
_target;
public void Testlnitiali:ze()
{
r5J
>o § � -
Cij Solution 'Winte.ll C>g wm' (4 projects) IE!! P o rtab leWint ellC> g I> IE!! WintellogMvvm „ [E!I Win tello gT est I> 1' Pmpertie�
TinylocTests ITinyioc
i= SearchSolutionExplorer(Ctrl+;)
[Testelass]
�
-
.... Ił- X
Solu tion Explorer
_ lliillil_target
EJnamespace WintellogTest
I
p
;!M-;-
I>
I{
Q)
+
{id = Guid . Ne wGui d () }) ; _target. Reso lve. ( } ; fType(e x: pecte d , id, typeo f ( Gui d) "Test failed:
_target.Register(tinyioc => new
O
dynami e e. xp ecte d=
Assert, Is inst ance
,
dynamie
[ Te stMe th od ] public void GivenTypeConfiguredlJhenSh a redlnsta n c eRe que s tedThen Sha redlnstanceSI { _targ e t. Re. giste. r(tinyio c => ne\.,o {id= Guid.Ne\'łGuid()}); var expected = _target.Resolve(};
Solution Explorer
Ready �.-�
Rysunek 9.6.
Filtrowanie według pliku testów
TeamExplC>rer
Properties
Testy jednostkowe
229
[Testlnitialize] public void Testlnitialize() {
target= new Tinyloc();
Następnie definiowane są testy metod opatrzonych atrybutem TestMethod. Istnieje wiele różnych sposobów nazywania i określania zakresu testów. Zwykle staram się tworzyć testy skupione na jednym aspekcie lub bloku kodu z docelowej metody, ale czasami wymaga to wykonania testów wspierających. Testy nazywam z użyciem wzorca „Jeśli ..., to".
Jeśli przy określonych założeniach jest wykonana akcja, to jaki powinien być wynik? Choć metoda ta pomaga nazwać test, to w jego wnętrzu są niemal zawsze wykonywane następujące trzy kroki - przy gotowanie, wykonanie i asercje. Przygotowujemy test do działania (czyli tworzymy konfigurację), wyko
nujemy go przez wywołanie metody z klasy docelowej, a następnie sprawdzamy asercje, określając, czy otrzymaliśmy właściwe wyniki. Na początek przyjrzyjmy się prostej metodzie testowej. Kontener IoC konfiguruje się samodzielnie, więc gdy zażądamy interfejsu ITi nyioC, powinniśmy otrzymać instancję kontenera IoC. Można to prze czytać w następujący sposób:
„Jeśli jest utworzona klasa pomocnicza IoC i zostanie zażądany interfejs, to metoda pomocnicza po winna zwrócić ten sam obiekt klasy pomocniczej". Test wygląda następująco: [TestMethod] public void GiveniocContainerWheninterfaceRequestThenContainerShouldBeReturned() {
var actual= target.Resolve(); Assert.AreSame( target, actual, "Test nieudany: nie został zwrócony obiekt.");
Przygotowanie jest realizowane w metodzie Test I ni t i al i ze w czasie, gdy tworzony jest obiekt do celowy. Realizacja jest wywołaniem metody Resol ve dla interfejsu. Asercje kontrolują, czy oczekiwany wynik (ten sam obiekt) jest taki sam jak wartość zwrócona przez klasę. Jeżeli została znaleziona różnica, test jest nieudany i generowany jest określony komunikat. Przejdźmy teraz do nieco bardziej skompliko wanego przykładu:
„Jeśli dla obiektu pomocniczego IoC jest skonfigurowany typ i typ ten zostanie zażądany, to zostanie zwrócony obiekt odpowiedniego typu". Jest to definicja sposobu działania mechanizmu IoC. Lekki kontener, jaki napisałem dla tej aplikacji, pozwala na przekazanie typu (zwykle jest to interfejs lub klasa abstrakcyjna, ale może być to również zwykła klasa) oraz funkcji, która zwróci nowy obiekt danego typu. Domyślnie klasa IoC zwraca jeden obiekt danego typu. Jest on nazywany instancją współdzieloną. Możesz jednak zażądać zwrócenia nowej instancji, co spowoduje wykonanie funkcji generującej nową, niewspółdzieloną instancję. Poniżej znajduje się przykład takiego odwzorowania - typem bazowym jest po prostu Systern. Object, a odwzorowanym typem jest dynami c: target.Register(tinyloc=> new {id= Guid.NewGuid()}); dynamie expected= _target.Resolve(); Assert.IsinstanceOfType(expected.id, typeof (Guid), "Test nieudany: nie został zwrócony typ dynamie."); W czasie fazy przygotowania tworzony jest obiekt IoC, który po zażądaniu typu object zwraca ele
ment o typie dynami c. W fazie realizacji wywoływana jest metoda kontenera, która pozwala utworzyć
230
•
Rozdział 9. MWM i testowanie
instancję. Na koniec asercja weryfikuje, czy faktycznie został zwrócony typ dynamiczny z właściwością id o typie Guid.
Możesz przejrzeć kolejne testy, aby zobaczyć warunki dla kolejnych wywołań zwracających tę samą instancję (współdzieloną) przy żądaniach zwrócenia nowej instancji. Są to dosyć proste przykłady, które te stują w miarę niezależny komponent. Co możemy zrobić, gdy mamy komponent taki jak Bl ogDataSource, który używa innych komponentów? W tym celu musimy wykorzystać imitacje i zręby.
Imitacje i zręby W przypadku testów jednostkowych skupiamy się na jednym fragmencie kodu. Zgodnie z założeniami testujemy główną funkcję kodu i nie zajmujemy się zewnętrznymi komponentami, które mogą zawierać inne części bieżącej aplikacji. W przypadku klasy Bl ogDataSource zajmujemy się kodem odczytu blogów, analizy pamięci podręcznej oraz tworzenia listy grup i elementów, które są udostępniane w naszej apli kacji. Do zadań tej klasy nie należy ani znajomość sposobu działania magazynu, ani tworzenie okna dia logowego na platformie docelowej. Zadania te są delegowane do innych komponentów. Bardzo trudno znaleźć precyzyjną definicję imitacji i zrębu, ale osobiście staram się korzystać z ogól nych wskazówek, według których zręb jest po prostu specyficzną implementacją klasy, dzięki której moż na uruchomić inną klasę, od niej zależną. Imitacja jest nieco inna. Imitacja jest również implementacją (czyli jest utworzona specjalnie do testowania i nie jest częścią systemu produkcyjnego), ale oprócz tego, że umożliwia działanie innych klas, może przechowywać dane na temat stanu, które mogą być spraw dzane w asercji testu. Pozwala to na sprawdzanie, czy określone metody zostały wywołane we właściwy sposób, dzięki czemu kod w docelowym komponencie działa prawidłowo. Istnieje kilka sposobów na tworzenie zrębów i imitacji. Jednym z nich jest tworzenie własnych klas pomocniczych. W projekcie WintellogTest znajdują się one w folderze TestHelper. Klasa Dial ogTes t jest przykładem imitacji, ponieważ nie tylko emuluje asynchroniczny dialog, ale również zapisuje przekaza ny komunikat, pozwalając na jego późniejsze sprawdzenie. Pełna klasa jest zamieszczona na listingu 9.1. Listing 9.1. Imitacja interfejsu !Dialog
public class DialogTest : !Dialog { public string Message { get; set; public Task ShowDialogAsync(string dialog) { return Task.Run(() => Message
=
dialog;
});
Imitacja nie korzysta z żadnego typu z Ul, więc może być bez trudu użyta w systemie testowym. Za pisuje ona przekazany komunikat, dzięki czemu można testować, czy zależny komponent w sposób pra widłowy wykorzystuje okno dialogowe. Inne klasy realizują podobne funkcje przez uruchomienie fałszy wego źródła danych dla klas zależnych lub zapisywanie wartości właściwości, aby umożliwić ich późniejsze sprawdzenie. Sposób użycia imitacji możesz zobaczyć w klasie Bl ogDataSourceTests. Znajduje się tu jeden duży test:
„Jeśli istnieje nowy element i zostanie wypełniona grupa blogu, to liczba pobranych i nowych elemen tów powinna wskazywać prawidłową wartość".
Testy jednostkowe
231
Test ten emuluje sytuację, gdy w pamięci podręcznej znajdują się elementy, a w sieci pojawią się no we artykuły. Test ten ujawnia również błąd w projekcie klasy Bl ogDataSource. Sama klasa nadal próbuje użyć HttpCl i ent do pobrania strony z danych testowych, co się nie powiedzie, ponieważ nie istnieje ad res URL. Choć komponent obsługuje tę sytuację bez problemów i test sprawdzi, czy zostało wyświetlone okno dialogowe z komunikatem o błędzie, to jednak odwołanie sieciowe powinno zostać przeniesione do interfejsu. Pozwoli to nam na utworzenie imitacji wywołania i samodzielnie zdecydować, czy powie dzie się ono, czy nie, oraz jakie zwróci wyniki. Pierwszym krokiem jest zdefiniowanie przykładowego zapamiętanego elementu, przykładowego blo gu oraz imitacji zawartości magazynu z fałszywym przetwarzanym kodem mieszającym:
var cached= new Blogitem {Id= Guid.NewGuid().ToString()}; var blog= new BlogGroup { Id= Guid.NewGuid().ToString() }; storageUtilityTest.Items = new[] {"123"}; Imitacja magazynu jest przekazywana do funkcji, która zwróci blog lub zapisany element w zależno ści od oczekiwanego elementu:
storageUtilityTest.Restore= (type, folder, hashCode) => { if (type== typeof (BlogGroup)) { return blog; return cached; }; Na koniec symulowany „nowy element" jest dodawany wraz z blogiem do imitacji klasy pomocniczej udostępniania, która przetwarza kanały:
var newitem= new Blogitem {Id= Guid.NewGuid().ToString()}; syndicationHelperTest.Blogitems.Add(newitem); syndicationHelperTest.BlogGroups.Add(blog); Pierwszym krokiem jest załadowanie grup. Po tym wywołaniu sprawdzamy, czy lista zawiera odpo wiednią liczbę przetworzonych blogów:
await target.LoadGroups(); Assert�AreEqual(1, target.Grouplist.Count, "Test nieudany: nie ma wygenerowanej jednej grupy."); Następnie grupy są przeglądane i ładowane są poszczególne artykuły. Zwróć uwagę, że moglibyśmy tu użyć jednego wywołania, korzystając ze sposobu konfiguracji testu, ale wolę ściśle stosować się do spo sobu implementacji, jaki został użyty w docelowej klasie:
foreach (var group in _target.Grouplist) { await _target.LoadAllitems(group); Teraz test został przygotowany i wykonany, więc czas na użycie asercji na wynikach. Sprawdzamy wartość licznika elementów, porównujemy listy, a na koniec sprawdzamy w imitacji okna dialogowego, czy zawiera ono komunikat o błędzie przy próbie załadowania pustego adresu URL. Pisząc ćwiczenie po kazujące wartość testowania, udało mi się wykryć, że w poprzedniej wersji aplikacji był błąd, powodują cy, że suma artykułów nie była prawidłowo aktualizowana. Dzięki testowi szybko wyszło to na jaw i mo głem od razu wykonać poprawkę. Końcowy zestaw asercji jest zamieszczony na listingu 9.2.
232
•
Rozdział 9. MWM i testowanie
Listing 9.2. Asercje dla testu klasy BlogDataSource
Assert.AreEqual (2, target.Grouplist[O] .ItemCount, "Test nieudany: liczba elementów powinna wynosić 2."); Assert.AreEqual (1, target.Grouplist[O] .NewitemCount, "Test nieudany: liczba nowych elementów powinna wynosić l."); CollectionAssert.AreEquivalent(new[] {cached, newltem}, target.Grouplist[O] .Items, 11 Test nieudany: listy nie pasują do siebie."); Assert.IsTrue(!string.IsNullOrEmpty(_dialogTest.Message), "Test nieudany: okno dialogowe nie zawiera komunikatu o błędzie.");
Istnieje kilka bibliotek, które ułatwiają tworzenie zrębów i imitacji. Dzięki Microsoft Fakes czy MOQ możemy dynamicznie konfigurować zręby i imitacje w testach jednostkowych. Pozwala to uniknąć two rzenia wielu skomplikowanych imitacji i zrębów oraz umożliwia dostosowanie zachowania do konkret nego pisanego testu. Przykłady z tego rozdziału opierają się na projekcie testów jednostkowych Windows Stare. Jeżeli korzystasz z PCL do współdzielenia kodu pomiędzy projektami, możesz równie łatwo napi sać tradycyjny projekt testów jednostkowych i w nim zbudować swoje testy, stosując wybraną bibliote kę imitacji.
Podsumowanie W rozdziale tym przedstawiłem wzorzec MVVM oraz jego zalety przy budowie aplikacji. Pokazałem, w jaki sposób można użyć przenośnej biblioteki klas (PCL) do tworzenia kodu współdzielonego pomiędzy różnymi platformami, i zbudowałem aplikację WPF korzystającą z tych samych klas co aplikacje Win dows 8. Omówiłem również zalety testowania oraz kilka metod pisania testów jednostkowych w Visual Studio 2012. Pokazałem, jak ręcznie imitować zależności między klasami. W następnym rozdziale wyjaśnię, jak przygotować aplikację dla Windows Stare. Opiszę, jak ustawić ceny aplikacji, jak włączyć zakupy wewnątrz aplikacji, pozwalające na aktywowanie funkcji (nazywanych „produktami"), oraz jak te funkcje testować. Przedstawię również zastosowanie Windows App Cert Kit do testowania certyfikatów aplikacji przed wysłaniem jej do sklepu i pokażę wygodny sposób tworzenia pakietu dystrybucyjnego pozwalającego na współdzielenie kodu poza sklepem.
10. Pakiety i instalacja
G
DY APLIKACJA JEST JUŻ GOTOWA, MUSISZ ZNALEŹĆ SPOSÓB, aby wysłać ją do potencjal nych klientów. Istnieje kilka możliwości wykonania takiej operacji, w tym technika nazywana łado
waniem bocznym, która zostanie przedstawiona w dalszej części rozdziału. Wielu programistów będzie chciało wykorzystać możliwości, jakie daje partnerstwo z Microsoftem i udostępnianie aplikacji w Skle pie Windows. Sklep ten jest dostępny zarówno w postaci stron HTML utworzonych dla aplikacji, jak i w postaci lokalnej aplikacji Windows 8 o nazwie „Sklep", preinstalowanej na komputerze z Windows 8. Koncepcja użycia sklepu z aplikacjami ma już kilkanaście lat, a ostatnio została spopularyzowana przez różne platformy smartfonów. Sklep jest centralną lokalizacją pozwalającą na zakup aplikacji, ich pobieranie i instalowanie oraz zarządzanie nimi. Pomysł użycia centralnego sklepu pozwala utworzyć centralny punkt zainteresowania użytkowników, którzy w nim będą szukać aplikacji oraz poprawić bez pieczeństwo użytkowników końcowych, ponieważ aplikacje udostępniane w sklepie są analizowane i te stowane. Więcej informacji na temat procesu analizy aplikacji wysłanych do Sklepu Windows znajduje się w dalszej części rozdziału.
Sklep Windows Sklep Windows oferuje programistom i firmom usługę publikacji aplikacji (zarówno aplikacji Windows 8, jak i tradycyjnych aplikacji pulpitu), a użytkownikom usługi pozwalające na wyszukanie, zakup i zain
stalowanie tych aplikacji. W sklepie dostępne są funkcje wyszukiwania aplikacji bezpośrednio w Win dows 8 oraz poprzez stronę WWW. Zapewnia to znaczący zasięg, który przekłada się na większe poten cjalne zyski dla programistów sprzedających swoje aplikacje. Dostępnych jest kilka modeli biznesowych, jakie można przyjąć w celu wygenerowania zysku ze swojej aplikacji, w tym integracja reklam poprzez sieć ogłoszeniową Microsoftu lub innych firm, takich jak AdDuplex ( www.adduplex.com).
Wyszukiwanie Niezwykle istotne jest, aby potencjalny klient nie tylko mógł w prosty sposób znaleźć Twoją aplikację, ale również zakupić ją i zainstalować w systemie. Windows 8 oraz Internet Explorer 10 współpracują w tym zakresie, oferując funkcje pozwalające w sposób łatwy przejść ze strony internetowej do lokalnie zainsta lowanej aplikacji Sklep Windows. Gdy wyślesz aplikację do Sklepu Windows, będzie ona automatycznie promowana zarówno poprzez strony Windows Marketplace, jak i w samej aplikacji Sklep Windows.
234
•
Rozdział 1 O.
Pakiety i instalacja
Aby zobaczyć, w jaki sposób działa taka integracja, otwórz Internet Explorer 1 O z ekranu startowego (uruchom wersję Windows 8, a nie wersję dla pulpitu). Przejdź na stronę aplikacji Cut the Rope, dostęp nej pod adresem http://cuttherope.ie/. Otwórz pasek aplikacji - zauważ, że ikona klucza ma znaczek plusa ( +), oznaczający dostępność roz szerzonych funkcji. Po kliknięciu klucza wyświetli się kilka opcji, w tym opcja umożliwiająca zainstalo wanie aplikacji dla witryny, jak pokazano na rysunku 10.1.
Getappforthissite Findonpage View on the desktop
e rłl
lit p
" . cuttherope 1e
@ 0 @
© 2012 ZeptoLab UK Limited. Wszystkie prawa zastrzeżone Rysunek 10.1.
Przykład integracji pomiędzy witryną a Sklepem Windows
Po kliknięciu opcji Pobierz aplikacje dla tej witryny otwierana jest odpowiednia strona w Sklepie Win dows, z której możesz pobrać aplikację. Po zainstalowaniu aplikacji rozszerzone menu w Internet Explo rerze będzie zmienione i teraz będzie w nim wyświetlana opcja uruchomienia lokalnej wersji aplikacji. Zastanawiasz się, w jaki sposób witryna zapewnia taką integrację? Użyj ikony klucza do otwarcia witry ny na pulpicie i podejrzyj jej źródło (kliknij prawym przyciskiem myszy na dowolnym miejscu strony i z menu podręcznego wybierz opcję Pokaż źródło). Możesz tam znaleźć kilka znaczników meta, pokaza nych na listingu 10.1. Listing 10.1. HTML
zapewniający integrację witryny Cut the Rope z Sklepem Windows
Znaczniki te zawierają dane kontekstu, zapewniające możliwość wyświetlenia łącza przez Internet Explorer 10. Najważniejszym znacznikiem jest msAppl ication-PackageFamilyName, który zawiera nazwę definiowaną w manifeście aplikacji. Na podstawie tej nazwy Internet Explorer 10 może określić, czy apli kacja jest zainstalowana, a jeżeli nie - przekazać jej identyfikator do Sklepu Windows.
Sklep Windows
235
Aby zobaczyć inny przykład integracji, otwórz wyszukiwarkę Bing w Internet Explorerze dla Windows 8 i wpisz do niej Rowi, czyli moją ulubioną aplikację obsługującą Twitter. Przewiń w dół. Pozycja dotyczą ca Rowi zawiera ikonę sklepu, ocenę oraz łącze do pobrania aplikacji, jak pokazano na rysunku 10.2. rowi - Windows Phone I Cell Phones Motlile Downloads Mobile
__
www.windowsphone.com/en-USJepps/304c9bfd-9b65-e011-81d2-78e7d1fai76f8 .... Rowi is an easy to use Twitter app for Win do ws Phone with a clean and simple interface. Whether you are a serious Twitte r user or a beginner, this is the app for youl
Welcome I Rowi rowilimited.com .... At Rowi Ud, we have a wide range of Electronics ranging Washing Machines.
from St a nding Fan, Fridges,
Plas ma TV etc...
Rowi lforme�y Okarito brown kiwil: New Zealand native land birds www.doc.govtnz/.. Jland-birds/kiwi/rowi-forrnerly--0karito-brown-kiwi .... Rowl are New Zealand's r ares t kiwi specl es, wlth an estlmated 370 survlvlng In Just one patch of forest in Ók&rito, South Westland rowi !lite! -Windows Phone I Cell Phones Mobile Downloads ... www.windowsphone.com/s?appld=5da58f1f-562e-e011-854c-00237de2db9e
•
Rowi is an easy to use Twitter app for Windows Phone with a dean and simple interface. Whether you
are
a serious Twitter user or a beginner, this is the app for youl
Rowi is an easy to use Twitter app for Wi11dows with a dean and simple interface. Ił you are a seńous Twitter user or a beginner, !hi. .. ---�views Download
Related searches for rowl Rowi Twitter
Rowi Twitter App
Rowi Kiwi
Rowi WP7
Rowi Hidden Pi neapple
Hidden Pineapple
Rowi ap p
Windows Phone Rowi
1
2
3
4
5
Next
@20ł2Micro:sołll Priv11cy11ndCookies I Legal I Advettise I .6.boulouralb I Help I Feedback
Źródło: Hidden Pineapp/e, LLC. Użyte za pozwoleniem Rysunek 10.2.
Dane wyszukiwarki Bing dla aplikacji Twitter firmy Rowi dla Windows 8
Kliknięcie łącza powoduje przejście do właściwego miejsca w Sklepie Windows na urządzeniu Win dows 8. Jest to realizowane dzięki temu, że URL zaczyna się od ms-wi ndowsstore i zawiera unikatowy identyfikator, który może być przekazany do aplikacji Sklep Windows w celu pokazania wpisu. Znacznie ułatwia to przeglądanie informacji na temat aplikacji, a kliknięcie przycisku Zainstaluj powoduje jej in stalację na lokalnym komputerze. Strona z aplikacji Sklep Windows jest pokazana na rysunku 10.3. Oczywiście, najłatwiejszą metodą wyszukiwania aplikacji jest uruchomienie samego Sklepu Windows. Główna strona zawiera wyróżnione aplikacje i pozwala na przeglądanie różnych kategorii z najwyżej ocenionych aplikacji oraz ostatnio dodanych. Sklep Windows korzysta również z powiększania seman tycznego, dzięki temu mamy szybki dostęp do różnych kategorii, jak pokazano na rysunku 10.4. Sposób wyświetlania aplikacji w Sklepie Windows przedstawię w dalszej części tego rozdziału. Mo żesz zadać pytanie, dlaczego miałbyś chcieć listować je poprzez sklep. Aby odpowiedzieć na to pytanie, powinieneś wcześniej dowiedzieć się więcej na temat zasięgu Sklepu Windows oraz o kosztach wykorzy stywania go.
Zasięg Według Microsoftu Sklep Windows pozwala programistom na sprzedawanie aplikacji na ponad 200 rynkach oraz posiada obsługę walut dla 70 różnych rynków i opcje lokalizacji dla 100 różnych rynków. To całkiem spory zasięg - więcej na ten temat możesz przeczytać na stronie
windowsstore!archive/2012101/05/global-reach.aspx.
http:!!blogs.msdn.com!b!
236
•
Rozdział 1 O. Pakiety i instala cja
®
Rowi
Descrlption Rowi is an easy to use Twitter app for Windows with a clean and simple inteńace lf you are a serious Twitter user or a beginner, this is the app for you! lnstead of
Features Simple, easy to use, thumb
d
rv
i en experience designed for slate devices
Calumns for home tlmeline, mentions, direct messages, favorites, media filter and tren ds
Źródło: Hidden Pineapp/e, LLC. Użyte za pozwoleniem Rysunek 10.3. Strona Sklepu Windows dla Rowi
Sto re
Ga mes
Social
Entertainment
Rysunek 10.4. Semantyczne powiększanie w Sklepie Windows
Według Apple do marca 2012 roku sprzedano 365 milionów urządzeń iOS1• Porównaj to z ponad 600 milionami licencji Windows 7 sprzedanych do lipca 2012 roku2• To znaczna liczba urządzeń. Win dows 8 jest zgodny z urządzeniami Windows 7 we wszystkich wersjach poza Windows RT (ARM), więc potencjalny rynek jest niezwykle duży. Aplikacje Windows 7 zakupione przez tylko 0,1% całego rynku osiągają 600 OOO instalacji. Sklep Windows pozwala ustawić cenę aplikacji pomiędzy 1,49 a 999,99 dolara i dowolnie wyceniać zakupy funkcji wewnątrz aplikacji. Więcej informacji na ten temat znajdziesz w następnym podrozdzia
30% dla Microsoftu i 70% dla programisty. Gdy programista 25 OOO dolarów, pobierana przez Microsoft prowizja spada do 20%, a programista otrzymuje 80% z kolejnych sprzedaży. Jeżeli ustawisz najniższą cenę (1,49 dolara) w odniesieniu do po przedniego przykładu 600 OOO instalacji, to otrzymasz ponad 700 OOO dolarów, już po odliczeniu prowizji. le. Model podziału zysków zaczyna się od
osiągnie próg zysków
1 http://techcrunch.com/2012/06/ 11/apple-wwdc2012-iphones-ipads-sold!. 2 http:!/www.engadget.com/2012/06/06/over-600-million-windows-7-licenses-sold!.
Sklep Windows
237
Aby móc zarabiać pieniądze na swoich aplikacjach, musisz zainwestować w konto programisty w Micro sofcie. Pozwala ono na wysyłanie aplikacji do Sklepu Windows. Obecnie stosowane są dwie ceny kont
-
49 dolarów za rejestrację jednego programisty oraz 99 dolarów dla firm. Obie subskrypcje pozwalają na
wysyłanie wielu aplikacji do Sklepu Windows.
Modele biznesowe Istnieje kilka modeli biznesowych, za pomocą których możesz zarabiać na swoich aplikacjach. Pierwszym krokiem powinno być określenie całkowitego kosztu aplikacji. Możesz ustawić cenę aplikacji oraz usta lić, czy dostępny jest okres próbny. Okres próbny może trwać pewien czas (czyli użytkownik korzysta z pełnego zakresu funkcji, ale musi zakupić aplikację po danym czasie), z kolei aplikacja może mieć ogra niczony zakres funkcji (niektóre funkcje są zablokowane do momentu zakupu pełnej wersji). Przykład wyboru jest przedstawiony na rysunku 10.5. Mome
��11rd
Doo
�mples
Oownloads
Support
Sample Paid App: Release
Community
1
Sell1ng deta1ls
Appname Sellingdet11ils
Pió:theapp'spricetier,frectrialperiod,.irndwhereyouwanttosc-llit
n edfe.atu r es �r11ting Cryplogntphy Adva c
will sec in the Windowi; Store. Your ciatomen; will �e the �lling pric:e in thcir own the "'mount �id to you un �ary by country. Lum rnore
The price tier determlneo.; the selling price th11t c:m-tomcrs currency. The pric:e -111 c:ustomer �ys 11nd
P11clui9es
OeKription
Pricetier* O
Not�totestm;
19.99USO
Markets
vl
Frtttrialperiod*
11�
O
vl
6
Algeria
Argentina
7000ZD
39.99ARS
S!Hil
Bulgari•
16.998Rl
1S.998GN
[;z]'"""''" ElJ
Belgium
8.49EUR
!;z]
9.99CAO Colombia
4,SOOCLP
18,000COP
CortaRica
Cro.atia
5,000CRC
50.00HRK
[;z] Cypru< 8.49EUR
[;zj":Jypt 60.00EGP
Cudilkpublic
200.00QI( .,.,,....
8.49EUR
Finland
8.49EUR
�rman.y
Hong Kong SAR
8.49EUR Hunga.ry
2,.IOOHUF
Rysunek 10.5.
Canada
SO.OOHKD lndia
5001NR
85,000IDR
Wybór ceny oraz okresu próbnego dla aplikacji
Api konwersji z wersji próbnej na pełną jest bardzo proste. Skorzystaj z tego łącza i pobierz próbkę SDK do konwersji wersji próbnych i zakupów w aplikacji
-
http:!!code.msdn.microsoft.com!windowsapps!
Licensing-API-Sample-19712fl a. W przedstawionym przykładzie użytkownik korzysta z okresu próbnego i może kliknąć przycisk w celu zakupu pełnego produktu. Pierwszym krokiem powinno być pobranie danych licencyjnych z bie żącej aplikacji: var licenselnformation
=
CurrentApp.Licenseinformation;
Jeżeli aplikacja działa w trybie próbnym, zażądaj zakupu pełnej aplikacji. Sterowanie przejmie sklep Windows 8 i zajmie się zarządzaniem transakcją:
238
•
Rozdział 1 O. Pakiety i instalacja
if (licenseinformation.IsTrial)
{ await CurrentApp.RequestAppPurchaseAsync(false);
Nie możesz korzystać z serwera licencji do momentu prawidłowego przesłania aplikacji do Sklepu Windows. Aby przetestować konwersję wersji próbnej oraz zakupy wewnątrz aplikacji, możesz skorzystać z wbudowanego symulatora, ale wymaga to wymiany odwołań do CurrentApp na CurrentAppSimul a tor (znajdziesz je w pobranych przykładach). Symulator pozwala na załadowanie specjalnego dokumentu XML do symulowania stanu licencji i opcji zakupu dla aplikacji. Na listingu 10.2 przedstawiony jest przy
kładowy plik dla aplikacji działającej w trybie próbnym, która ma być skonwertowana do wersji pełnej poprzez zakup o wartości 4,99 dolara. Listing 10.2. Przykładowy dokument XML do symulowania opcji licencjonowania
2Bl4D306-D8F8-4066-A45B-OFB3464C67F2 http://apps.microsoft.com/app/2Bl4D306-D8F8-4066-A45B-OFB3464C67F2 en-US 3
Zmiana wersji próbnej na pełną Przykładowa aplikacja demonstrująca zarządzanie licencją próbną 4.99 $
true true 2013-0l-OlTOO:OO:OO.OOZ
Plik ten jest ładowany do symulatora aplikacji w sposób pokazany w pliku TrialMode.xaml.cs: StorageFolder proxyDataFolder = await Package.Current.Installedlocation.GetFolderAsync("data"); StorageFile proxyFile = await proxyDataFolder .GetFileAsync("trial-mode.xml"); await CurrentAppSimulator.ReloadSimulatorAsync(proxyFile);
Aby przetestować inne scenariusze, musisz ponownie załadować symulator. W kodzie jest również tworzona procedura obsługi zdarzeń, która jest wywoływana za każdym ra zem, gdy zmienią się dane licencyjne, na przykład poprzez symulowany zakup (lub rzeczywisty zakup, gdy aplikacja jest dostępna w sklepie): licenseChangeHandler = new LicenseChangedEventHandler(TrialModeRefreshScenario); CurrentAppSimulator.Licenseinformation.LicenseChanged += licenseChangeHandler;
Sklep Windows
•
239
•WSKAZÓWKA Symulator działa jako symulator pamięciowy. Podczas ładowania pliku proxy możesz wprowadzać takie zmiany, jak symulacja zakupów w aplikacji. Zmiany te są odzwierciedlane w pamięci i nie zmie niają pliku licencyjnego. Aplikacja po ponownym uruchomieniu jest przywracana do stanu zapisa nego w pliku XML. Jeżeli chcesz testować różne scenariusze, możesz przygotować wiele plików, tak jak jest to pokazane w przykładzie dostarczonym z SDK. Przykład ten ładuje odpowiedni plik dla testowanego scenariusza, a ponowne załadowanie tego pliku pozwala przywrócić początkowy stan. Pamiętaj, że po przygotowaniu aplikacji do wysłania powinieneś usunąć pliki testowe i zmienić na zwy wszystkich odwołań do symulatora.
Symulator pozwala na wybranie, jaki jest wynik symulowanego zakupu. Na przykład możesz poprzez symulator wybrać nieudany zakup, dzięki czemu możesz sprawdzić, czy aplikacja prawidłowo zarządza błędami. Program symulatora pokazany jest na rysunku 10.6. Po kliknięciu przycisku zakupu wyświetlane jest okno dialogowe Sklepu Windows, które pozwala wybrać wynik symulowanego zakupu. lJ Windows 8 SDK Samples
ln-app purchase and trial management sample lnput Description:
SeJectScenario:
Trial-made scenario
This scen ar io illustrates how an app can determine what type of license the customer has and
2) ln-apppurchase
then enable the products that correspond to that license.
3} Expiring product
Current license made: Trial license Trial period
Read the expiration date of the trial period, subtract today's date
from the expiration date, and then display the result, converted to days, in the output area. After the customer buys the app, the
expiration date is no long er meaningful. Read the current license state to enable a product during the trial
period and display the result in the output area. Read th
Windows Stare
used af
output
aga in. Read th
Trialmanagemeritful\icense
You can
Click Bu license E-INVALIDARG E-FAil E-OOTOR-EMOR'f
Output
ffiRORALREAD'fEXISTS
Buyingtheflllllicense.„
Microsoft 02011Micro'iOftCorporation.Allrightsreioenied
Tenru;; af use I Trademarh I Pri11acy Statement
Rysunek 10.6. Symulator Sklepu Windows
Udostępnienie trybu próbnego jest bardzo ważne. Zgodnie ze statystyką Microsoftu dla Windows Phone aplikacje mające tryb próbny są pobierane 70 razy częściej niż inne aplikacje. Dodatkowo dają one 10-procentowy współczynnik konwersji i dostarczają 10 razy więcej dochodu niż aplikacje, które nie oferują trybu próbnego. Artykuł z tymi informacjami można znaleźć pod adresem http://bit.ly/ekk9s5. Aplikacje mogą oferować specjalne „produkty", czyli funkcje aktywowane poprzez osobne zakupy. Pozwala to użytkownikom na dostosowywanie aplikacji do swoich preferencji i zakup tych funkcji, któ re są im potrzebne. Na przykład edytor graficzny może posiadać standardowy zestaw formatów, ale wy maga dodatkowych zakupów w celu udostępnienia kolejnych formatów, używanych najczęściej przez za wodowych projektantów, a nie hobbystów, którzy tylko sprawdzają możliwości narzędzia. Produkty są konfigurowane w sieci poprzez konto programisty, ale mogą być również symulowane za pomocą pro stego kodu XML w pliku proxy:
240
•
Rozdział 1 O.
Pakiety i instalacja
Produkt l l.99 $
Na listingu 10.3 pokazany jest sposób odczytania danych licencyjnych i wyświetlenia ich użytkownikowi. Listing 10.3. Odczyt danych
o produktach
Listinglnformation listing = await CurrentAppSimulator.LoadlistinginformationAsync(); var productl = listing.Productlistings["productl"]; var product2 = listing.Productlistings["product2"]; ProductlSellMessage.Text = "Możesz kupić " za:
"
+
productl.FormattedPrice
+
Product2Sel1Message.Text = "Możesz kupić " za:
"
+
product2.FormattedPrice
+
"
+
productl.Name
+
product2.Name
+
"."; "
+
".";
Produkt zawiera właściwość I sAct i ve, która informuje Cię, czy został on kupiony i aktywowany. Dzięki temu można blokować te funkcje, które nie zostały zakupione. Żądanie zakupu produktu jest re alizowane identycznie jak zakup aplikacji; jedyną różnicą jest dodatkowy parametr wskazujący produkt do zakupu: await CurrentAppSimulator.RequestProductPurchaseAsync("productl", false);
Dodatkowo można zdefiniować datę wygaśnięcia produktu. Pozwala to generować powtarzalne do chody dzięki funkcjom, które wygasają po określonym czasie i wymagają od użytkownika wykonania kolejnego zakupu, aby nadal korzystać z tej funkcji. Produkt posiada właściwość Expi rat i on Date, dzięki której można wyświetlać użytkownikowi informacje o wygasających produktach.
Reklamy Jedną z możliwości zarabiania za pomocą aplikacji jest wyświetlanie reklam. Często stosowane są mo dele, w których aplikacja przynosi zyski poprzez reklamy, lub dostępna jest wersja bezpłatna z reklama mi, którą można skonwertować do wersji płatnej, bez reklam. Microsoft daje nam dwie możliwości do dania reklam do aplikacji Windows 8. Pierwszą jest wykorzystanie dowolnej firmy zewnętrznej, a drugą użycie usługi Microsoftu, dostępnej w internecie pod adresem www.windows-advertising.com. Aby rozpocząć korzystanie z platformy reklamowej Microsoftu, odwiedź tę witrynę i pobierz SDK. Pobrany pakiet zawiera wszystkie narzędzia pozwalające na zintegrowanie reklam z aplikacją. Po pobra niu SDK możesz zapoznać się z dokumentacją dostępną pod adresem http://msdn.microsoft.com!en-us! library!hh506371 (MSADS.10).aspx. Pełny opis integracji reklam z aplikacją zbudowaną z użyciem XAML i C# możesz znaleźć pod adre sem http://msdn.microsoft.com!en-us!library!hh506359(v=msads.10).aspx. Musisz również założyć konto, w którym określisz sposób otrzymywania pieniędzy oraz będziesz mógł śledzić wyniki reklam. Jeżeli zdecydujesz się na skorzystanie z zewnętrznego dostawcy reklam, takiego jak AdDuplex, będziesz musiał prawdopodobnie pobrać jego SDK i w celu zintegrowania tych reklam ze swoją aplikacją wykonać operacje zalecane przez dostawcę. Sklep Windows jest elastyczny i pozwala aplikacjom na wyświetlanie reklam od różnych dostawców, o ile tylko spełniają one warunki umieszcze-
Sklep Windows
241
nia ich w sklepie, które przedstawię w dalszej części tego rozdziału. Informacje na temat aplikacji mogą być przekazywane dostawcy reklam, dzięki czemu będzie mógł on lepiej dostosować wyświetlane rekla my, co prawdopodobnie zwiększy współczynnik kliknięć i dochód.
Przygotowanie aplikacji do sklepu Aby przygotować aplikację do wysłania do Sklepu Windows, powinieneś wykonać kilka kroków. Na po czątek zapoznaj się z wymaganiami certyfikacji aplikacji, które są dostępne w internecie pod adresem
http://msdn.microsoft.com!en-us!library!windows!apps!hh694083.aspx. Gdy powstawała ta książka, znajdowało się tam siedem warunków, jakie musi spełniać aplikacja, aby była umieszczona w Sklepie Windows. Sześć z nich, opisanych poniżej, odnosi się do aplikacji Windows 8.
Dostarczanie wartości Aplikacja powinna stanowić pewną wartość dla użytkownika. Nie powinny się znajdować w niej obszary oznaczone jako „w czasie budowy" lub wyglądające na niekompletne. Jeżeli oferujesz tryb próbny, musi on w sposób rozsądny odzwierciedlać pełny zakres funkcji - albo przez udostępnienie całego zakresu funkcji przez ograniczony czas, albo przez ograniczenie zakresu funkcji.
Oferowanie czegoś więcej niż reklam lub funkcji witryny internetowej Aplikacja może zawierać reklamy, ale musi oferować coś więcej poza nimi - nie będzie zaakceptowana, jeżeli nie będzie w niej nic innego poza reklamami. Nie możesz również korzystać z kafelków, tytułu aplikacji, opisu, powiadomień lub paska aplikacji do wyświetlania dodatkowych reklam. Funkcje aplika cji powinny być realizowane wewnątrz niej - aplikacja nie powinna jedynie przekierowywać użytkow nika do innej lokalizacji, na przykład witryny internetowej.
Przewidywalne działanie Aplikacja powinna stosować się do wytycznych Windows 8, które przedstawiałem w tej książce. Obejmuje to obsługę różnych orientacji i trybów (w tym przyciągniętego). Aplikacja powinna prawidłowo obsłu giwać wstrzymywanie i wyłączanie oraz nie powinna być kodowana w sposób, który powoduje zamra żanie lub brak odpowiedzi, jeżeli wystąpią takie problemy, jak brak połączenia sieciowego. Aktualiza cja aplikacji powinna zwiększać stabilność aplikacji i nigdy nie powinna ograniczać dostępnego zakresu funkcji. Ważne jest, aby korzystać wyłącznie z API WinRT dostępnego dla aplikacji Windows 8.
Zapewnienie klientowi kontroli Aplikacja powinna spełniać wszystkie wskazówki dotyczące powiadamiania użytkownika o takich funk cjach, jak API lokalizacji, i pozwolić mu na wyłączenie tych powiadomień. Jeżeli zbierasz dane perso nalne, musisz dostarczyć zasady prywatności, które jasno definiują Twoje intencje i spełniają wszystkie odpowiednie przepisy. Jeżeli masz zamiar udostępniać dane osobiste, musisz pozwolić użytkownikowi na wyrażenie zgody na takie działania. Twoja aplikacja nie powinna działać w sposób złośliwy i nie po winna zachęcać użytkownika do wykonania akcji, które mogą uszkodzić jego urządzenie.
Przygotowanie dla globalnego odbiorcy Aplikacja nie może zawierać treści przeznaczonych tylko dla dorosłych. Metadane skojarzone z aplika cją powinny zawierać informacje odpowiednie dla wszystkich grup wiekowych. Najwyższy ranking, jaki
242
•
Rozdział 1 O.
Pakiety i instalacja
mogą otrzymać dane i metadane w Sklepie Windows to 12+, czyli treści odpowiednie dla klientów ma jących 12 lat lub więcej. Twoja aplikacja nie powinna zawierać treści, które propagują dyskryminację, nienawiść lub przemoc. Nie możesz zachęcać do nielegalnych działań ani udostępniać treści, które mogą być uznane za obsceniczne. Pełną listę zastrzeżeń możesz znaleźć na wcześniej zamieszczonej stronie.
Łatwość identyfikacji i zrozumienia Twoja aplikacja powinna mieć jasny i jednoznaczny tytuł oraz odpowiedni ranking. Musisz zapewnić wsparcie techniczne dla aplikacji. Musisz znajdować się w co najmniej jednym geograficznym Sklepie Windows i zlokalizować aplikację dla wszystkich języków w nim obsługiwanych. Gdy udostępniasz ak tualizacje, musisz dokładnie opisać zmiany. Musisz również zamieścić przynajmniej jeden ekran w cza sie przesyłania aplikacji. Więcej informacji na te tematy znajduje się w następnym punkcie.
Proces Pełny proces wysyłania aplikacji jest opisany pod adresem http://msdn.microsoft.com!en-us!library!
hh454036(v=vs.11O).aspx. Wymaga to wykonania następujących operacji: 1. Otwórz konto programisty. Pamiętaj, że należy kupić konto indywidualne za 49 dolarów
lub konto firmowe za 99 dolarów. 2. Zarezerwuj nazwę dla aplikacji. Nazwę dla aplikacji możesz zarezerwować na rok przed
przesłaniem aplikacji. Więcej informacji na temat zaleceń dotyczących nazywania aplikacji znajdziesz pod adresem http://msdn.microsoft.com!en-us!library!windows!apps!hh694077.aspx. 3. Uzyskaj licencję programisty. 4. Zmień odpowiednio manifest aplikacji. 5. Skojarz aplikację ze Sklepem Windows. W tym celu kliknij prawym przyciskiem myszy projekt
w oknie Solution Explorer, a następnie wybierz Store!Associate App with the Store, jak jest to pokazane na rysunku 10.7. 6. Skopiuj zrzuty ekranu. Kliknij prawym przyciskiem myszy projekt w Solution Explorer,
a następnie wybierz Store!Capture Screenshots. Spowoduje to uruchomienie symulatora, co pozwala wykonać zrzuty ekranu przez kliknięcie ikony aparatu na pasku narzędzi. 7. Utwórz pakiet aplikacji. Kliknij prawym przyciskiem myszy projekt w Solution Explorer,
a następnie wybierz Store!Create App Package. Zostaniesz poproszony o zalogowanie się na konto programisty. 8. Prześlij pakiet aplikacji do Sklepu Windows poprzez konto programisty.
Użycie App Certification Kit Abyś mógł łatwo zweryfikować, czy aplikacja jest gotowa do przesłania do Sklepu Windows, skorzystaj z App Certification Kit. Pakiet ten pozwala na sprawdzenie, czy aplikacja spełnia następujące warunki: •
czy manifest jest prawidłowo skonfigurowany, w tym jego możliwości i deklaracje,
•
czy zasoby są dołączone i czy są prawidłowe,
•
czy aplikacja działa bez awarii i zawieszania się,
•
czy aplikacja jest skompilowana z użyciem konfiguracji Release, a nie Debug,
Sklep Windows
liti
Studio EBUG
„
DATA
SQL
TEAM
LocalMachine ...
TOOL5
...
Debug
243
Build Rebuild
T
Deploy
JJm ;
Cle:an ailPage.xaml.cs ii
App.xaml.cs: ii „
Run CodeAnalys.is:
t?:l 1mage_Click_1(ol 111
Scope to This:
fi p Vie\1 . Se!CCtedit� BIOgI�
�
e retrieve d file
NcwSolution Explore:rVicvv CalculateCodeMetric.s
null)
ProjectDependencies„.
ndO\\IS. System. Launcher. LaunchUriAsync
ProjectBuild Order.„ Add
ge _Click_1( obje et sen der,
Add ReJerence...
RoutedEven
Add ServiceReference„. Store
Ass.ociate:Appwith the:Stare ... Captur eScr eens.hots„.
I
Manage NuGet Packag�„.
CreateAppPad::age„.
�
View Cla s . s Diagram Set as:StartUpProject
lip Vie\\I , Selecteditem as Blogitem; null)
Debug
e „ string.Format("Post: am:e. PinToStart (sender,
�
{0}", item.l iti T
s rin g . Format( "Wintel
t1tle,
.:.
title,
hTertBlock_Selec1:ionChanged_1( obje et
t l
l = nu
:
ll
�
?
string.Empty;
I
Cut
Ctrl+X
Pastc
Ctrł+V
X
Remove
Del
:((! •!
Rename
OC::J
= s ender as Ric:hTextBloc:k_;
richTextControl
Control.SeloctedTe>ing: - Install the developer certificate inistrator credentials are req�i redl to continue. Please accept tne lJAC pro pt and pr ovide your ad i nistra d if asked. Press Enter to continue... : ne developer certificate was successfully installed.
IAd
m
t·o r
pass1,•or
IT
Installing developer package... 5�ccess: Your developer package Press Enter to continue... :
i.as
successfully installedl.
Rysunek 10.14. Wynik wykonania skryptu instalacyjnego PowerShell W ten sposób można zainstalować aplikację na wielu komputerach bez konieczności użycia Sklepu Windows.
Podsumowanie W tym rozdziale przedstawiłem Sklep Windows i oferowane przez niego funkcje, w tym różne modele sprzedaży aplikacji i dodawania zakupionych funkcji wewnątrz aplikacji. Przedstawiłem proces publi kowania aplikacji w Sklepie Windows oraz użycie pakietu Windows App Certification Kit do testowania aplikacji przed publikacją. Opisałem również sposób tworzenia specjalnego pakietu do ładowania bocz nego aplikacji na urządzeniach bez konieczności korzystania ze Sklepu Windows.
248
•
Rozdział 1 O. Pakiety i instalacja
Mam nadzieję, że książka Ci się podobała! Moją intencją było przedstawienie wszystkich narzędzi i informacji potrzebnych do zbudowania aplikacji i wystawienia ich do sprzedaży w Sklepie Windows. Oczywiście, najłatwiejsze jest poznanie części składających się na aplikację. Trudniejsze jest opracowanie pomysłu na aplikację. Życzę Ci samych sukcesów przy budowaniu aplikacji na platformę Windows 8. Oczekuję Twoich komentarzy i uwag. Jeżeli książka Ci się podobała, poświęć kilka chwil na odwie dzenie witryny Amazon.com i pozostawienie komentarza pod adresem http://bit.ly/win8design. Gdy inni programiści będą szukali rozwiązań w sieci, będą mogli przeczytać Twoją recenzję i zdecy dować, czy książka jest warta uwagi. Zachęcam Cię również, abyś napisał o tej książce na swoim blogu! Jeżeli chcesz przedyskutować zawartość książki ze mną lub z innymi programistami, możesz odwiedzić forum dostępne pod adresem http://windows8applications.codeplex.com!discussions. Na tej samej witrynie możesz znaleźć kod źródłowy. Znajduje się na niej także łącze pozwalające na bezpośredni kontakt ze mną. Możesz też znaleźć mnie na Twitterze - mój identyfikator to @Jeremyl i kness. Możesz również czytać moje artykuły techniczne pod adresem http:!!csharperimage.jeremylikness.com/, gdzie nadal publikuję najnowsze informacje oraz pomysły na kolejne książki. Dziękuję!
Skorowidz
.NET,19
asercje dla testu,232
.NET 1.0,22
asynchroniczny przepływ
.NET Framework,22
sterowania,151
CLI,Common Language Infrastructure,27 CLR,Common Language Runtime,22
A ABI,Application Einary Interface,35
B BCL,Base Class Libraries,36
CLR,Core Language Runtime, 14,69 COM,Common Object Model, 22
biblioteka
aktualizacja kafelków,171
BCL,36
cykl życia aplikacji, 127
aktywacja aplikacji,130
Callisto,209
czujnik,119
algorytm
Json.NET,203
orientacji,123
CMAC,164
klas,46
światła, 123
MD5,164
MFC,21
SHA,164
testów jednostkowych,47
algorytmy kompresji,162
D
TPL,149 WPF,23
dane,143
BindableBase,45
dane lokalne,137
animacje,75
Blend,32,39,44
debuger,64
API,9,19
błędy, 146
debugowanie aplikacji,96,132,
API Application Data,137
BooleanNegationConverter, 45
API Win32,22
BooleanTo VisibilityConverter, 45
API WinRT,27,33
bufory,160
szyfrowania,162
179 definicja dla stanu Snapped,99
aplikacja
manifestu,49
BlogPostTarget,207
c
ILDASM,60
siatki,85 słownika,77
ImageHelper,47
C#,35
VirtualBox,43
C++,34
grup,98
Wintellog,146,185
cel aktualny,11O
opcjonalnych przejść,98
aplikacje
cel wizualny,11O
definiowanie
stanów,98
Windows 8,26,28,30
celowanie,11O
Windows Store,26
centrowanie obrazu,48
interfejsu użytkownika, 61
ciągła praca aplikacji, 140
opcji Share Target,206
architektura aplikacji Win32,22
deklarowanie
DI,222
•
250
Skorowidz
dodawanie
programowania aplikacji,
format
kontraktu,130
JSON,147
usługi sieciowej,165
PNG,53
API,20 użytkownika, Ul, 9, 47, 214
funkcja
dotyk,12 drzewo wizualne,63
odbijania,76
dwukrotne stuknięcie,104
rotowania,76
J
dysk USB,40
JavaScript,32,34
dźwięk, 140
jądro, 133
G E
GDI,Graphics Device Interface, 27
język WSDL,165 JSON,JAVASCRIPT OBJECT NOTATION,147
efekty wizualne,108
geolokalizacja,121
ekran
gesty,52
K
blokady,140
gesty dotykowe,65
startowy,141
glify,175
kafelek Twitter,29
startowy Windows 8,31
główny element wizualny,78
kafelki,29,169
ekrany powitalne,117
gniazda,140
aktywne,170
element
grupa,98
podrzędne, 176
grupowanie,89,157
Canvas,78 CollectionViewSource,89 ContentControl,85
H
ContextMenu,111 FlipView,91 Grid,47,67,79 GridView, 88
HLSL,High Level Shading Language,34
OData,167 RSS,158 katalog NotificationExtensions, 175
HTML5,12,33
Kinect,25
ItemsControl,86
klasa
ListBox,92
I
ListView, 91 ScrollViewer,86
IDE,22
StackPanel,81
ikony,12,117
Style,76
ILDASM,57
TextBlock,67
imitacja interfejsu !Dialog,230
VariableSizedWrapGrid,83,
inklinometr,122
89
proste, 169 kanał
instalacja Windows 8
ViewBox,86
maszyna wirtualna,40
VirtualizingPanel,81
pełna instalacja,40
VirtualizingStackPanel,81,90
równoległe systemy,40
App,200 ApplicationDataContainer, 139 AsymmetricKeyAlgorithm 4Provider,163 BadgeGlyphNotification 4Content,175 BindableBase,45 BlogDataSource,153-159, 231 BlogGroup,147
VisualStateGroups,98
instalowanie certyfikatów,247
WrapGrid,82
Compressor,161
instrukcja using,53
Control,98
integracja ze Sklepem Windows,
ControlChannelTrigger, 140
F filtrowanie
234
DataBindingHost,71
interfejs
DataContractJ sonSerializer,
elementów,197
Ilnspectable,35
według pliku testów,228
INotifyPropertyChanged, 71
filtry,156,197
IU nknown,35
fokus,107
IValueConverter,72
folder Groups,147
CryptographicEngine, 162
interakcje dotykowe,103
145 DataContractSerializer,144, 148 DataPackage,201
Skorowidz
DataServiceCollection,167
kompas,121
kontrolki wspólne,92
Decompressor,161
komponent
konwerter
DependencyObject,65-69, 72,77 DialogTest,230 Encoding,161
CameraCaptureUl,56,59 DataTransferManager, 200 FileSavePicker,56 Windows Runtime,47
FileIO,152
komponenty WinRT,35,59
Filter,197
kompresja danych,160
FrameworkElement, 77
konfigurowanie
BooleanN egationConverter, 45 BooleanToVisibilityConverter, 45 konwertery wartości,72
L
HttpClient,157,158
Produktów,239
ItemDetailPage,203
siatki,87
LayoutAwarePage,45
LayoutAwarePage,45,99,215
środowiska, 39
Likeness Jeremy,17
MacAlgorithmProvider, 164
testów, 227
LINQ,Language Integrated
MagicButton,68
konto Windows Live, 185
Package,154
kontrakt,12,28,191
251
Query,89,156 lista kontrolek,92
PathIO,152
Launch,130
SettingsFlyout,118,211
Search, 195
Simpleltem,88
Settings,209
SplashPage,171
Share,208
SuspensionManager,46,139,
Share Target,205
boczne,245,247
Szukaj,29
własnego formatu danych,
143 SymmetricKeyAlgorithm '-Provider,162 SyndicatedClient,159 TileUpdateManager,172 Timeline,74 ToastNotificationManager, 181 TranslateTransform,75 Visual State Manager,98 WindowsRuntimeBuffer '-Extensions,160 klucz asymetryczny,163 symetryczny,162 kod aplikacji ImageHelper,59 MAC,164 niezarządzany,21 kodowanie ASCII,161 Base64,163 UTF-16,161 UTF-8,161 kojarzenie aplikacji ze Sklepem Windows,243 kolekcje,155 kolizje,147
Windows. ShareTarget,57 Windows.File,57
Ł ładowanie
208 zawartości,207
Windows.Launch,57 kontrakty
M
systemowe,57 Windows 8,192 kontroler Kinect,25 kontrolka AppBar,115
MAC,Message Authentication Code,164 magazyn Local,137,144
ContentControl, 85
Roaming,137
ExtendedSplashScreen,141
Temporary,137
Grid,112
manifest,48
GridView,88,89
Application Ul,48
ItemDisplay,90
Capabilities,49
ListBox,81,92,107
Declarations,49
ListView,91
Packaging,49
ProgressRing, 141
manipulacje,105
RichTextBlock,204
mapa bitowa,55
ScrollViewer,86
maszyna wirtualna,40,43
SemanticZoom,101,102
mechanizm IoC,229
Slider,66,69
MEF,Managed Extensibility
SplashPage,180 StackPanel,87 Storyboard,99 UserControl,112 WrapGrid,81,83
Framework,222 menedżer pakietów,203 zadań, 128 menu kontekstowe,111
252
•
Skorowidz
metadane, 27,59
N
metadane komponentu WinRT,
naciśnięcie wskaźnika, 104
60 metoda
odczyt czujnika światła, 123 danych,144 danych o produktach,240
narzędzie, 31
Activate, 196
Blend, 32,39
informacji o lokalizacji,121
AddToSchedule,182
ILDASM,59
inklinometru,122
Begin, 77
Visual Studio 2012,31,39
Convert,72 ConvertBack,72 CreateCompletionOption, 144 CreateContainer,139
naturalny interfejs użytkownika, NUi, 19, 24 nawigacja, 134,136,138 NGWS,N ext Generation Windows Services,22
DoFactorialExample, 151
niebieski stos, 37
ExtendedSplashScreen_
NTFS,41
Loaded,133
LoadBitmap,53
przyspieszeniomierza,120 żyroskopu,122 okno dialogowe,115 dialogowe potwierdzenia,115 Immediate Window,173
Focus, 107
o
Initialize,141
wartości z
ILDASM,58
NUi,24
GoBack, 135
orientacji, 124 położenia kompasu,121
obiekt
LoadLiveGroups,154
Binding,71
Navigate, 135
BlogGroup,147
OnLaunched,141
Frame, 135
OnSuspending,131
HttpClient,188
NuGet Package Manager,210 Solution Explorer, 246 udostępniania, 206 ustawień, 12 wysuwane,177 opcja Przypnij, 178 Remote Machine,132
RaisePropertyChanged.,71
HttpResponseMessage,158
Register, 65
PopupMenu,111
opcje kafelka, 172 operacja
Search Contract,195
Resolve,229
Task,151
ShowAsync,111
UICommand, 111
FaillfExists,144
Testinitialize,229
UserControl,112
GenerateUniqueName,144
metody asynchroniczne,149,151 pomocnicze,71 pomocnicze IO,152 MFC, Microsoft Foundation Class,21
WritableBitmap, 50 obiekty ContentControl,85
operacje asynchroniczne,150
Style, 78
osadzanie zasobów,153
obrót, 103 asynchroniczności, 12
modele biznesowe,237
błędów, 146
MS-DOS Executive, 20
języków programowania, 12
MSIL,Microsoft Intermediate
karty graficznej,34 klawiatury,107,108
MSTest, 227
myszy, 106
MVC,model-widok-kontroler,
OData, 167
214 MVVM,213
p
obsługa
model widoku,219
Language,22
OpenifExists, 144 ReplaceExisting, 144
OnLaunched,130 urządzeń wejściowych, 64
model, 217
zdarzenia PointerPressed,65
widok,218
zdarzeń użytkownika, 103 OData,Open Data Protocol,167
pakiet App Certification Kit,242 panel informacyjny,211 Launch,57 Share, 50 Sklepu Windows, 246 Start,191 Udostępnianie,29,200, 203 Urządzenia, 29 Ustawienia,29,119 wirtualizujący, 81 Wyszukiwanie,194
Skorowidz
parametry wiązania,70
OK,115
pasek
przypięcia grupy,177
aplikacji,112,114,116 paneli,178,194 przewijania,87 PCL,220,232 pełna instalacja,41 pierwsze uruchomienie,145 plik sessionState.xml,140 About.xaml,118 App.xaml,77 App.xaml.cs,50,115,119, 130 ApplicationCommands. xaml.cs,114 BlogDataSource.cs,154 Blogs.js,154 ExtendedSplashScreen. xaml.cs,133,135 GroupeditemsPage.xaml, 98-102 ImageHelper,58 ItemDisplay.xaml,88 MainPage.xaml,47 MainPage.xaml.cs,50,54, 107,162 Package.appxmanifest, 48, 117
Uprawnienia,119,179 powiadomienia
przytrzymanie,103
wartości, 71 powolne operacje,28 ms-appdata,152 ms-appx,154 procedura obsługi zdarzenia,111 proces,129 proces publikacji,245 profile mobilne,12 programowanie sterowane testami,TDD,226 Project Natal,25 projekcje,27,157 projektowanie Windows 8,31 protokół Atom,159 OData,167 SOAP,164 przechowywanie danych,137 przechwytywanie obrazu,51
przechowywania,55
TinylocTests.cs,227
przejścia, 100
ViewboxExample.xaml,88
przelot,55
Windows.Media.winmd,59
przenośna biblioteka klas,PCL,
pobieranie,140
przestrzeń nazw Windows.ApplicationModel. DataTransfer, 200 Windows.UI.StartScreen,177 Windows.UI.Xaml.Controls,
danych,54 treści,205 POCO,Plain Old CLR Object,69, 72 podpisywanie danych,162 polecenie Anuluj,115 Informacje,119
R RCW,Runtime Callable Wrapper,36 RDF,Resource Description Framework,159 rejestracja strony w panelu,119 rejestracja zdarzenia,148 rejestrowanie właściwości, 65 reklamy,240 REST,167 rezultaty testów jednostkowych, 228 RichTextColumns,46 rodzaje API WinRT,27 rodzaje dostępu pliki aplikacji,137 ustawienia aplikacji,137 rozciąganie zawartości,86 rozdzielczość ekranu,28 rozmiar kafelka,174 rozszerzenia Windows 8,193 rozszerzenie .winmd,27,59 równoległe systemy,41
s
220,232
PLM,Process Lifetime Management,128,134,141
pulpit,30
prefiks
przeglądanie elementów
wynikowe,58
publikacja aplikacji,233
powiększanie semantyczne,1O1
SplashScreen.xaml.cs, 172
WINMD,59
Zapisz obraz,64 przygotowanie aplikacji,241 przyspieszeniomierz,120
przeciąganie,103,109
pliki
cofnięcia,135
wyskakujące, 179,183
SplashPage.xaml.cs,145 StandardStyles.xaml,77,113
przycisk
wypychane,187 powiadomienie o zmianie
253
92 Wintellog,154 przesunięcie wskaźnika, 104 przesuwanie, 103,109 przetwarzanie danych WWW, 157 przyciąganie,28
schemat cyklu życia aplikacji,134 wiązania danych,69 semantyczne powiększanie,101, 236 serializer,144 serie ujęć, 74 SHA,Secure Hash Algorithm, 164 silnik Chakra,27 Trident,27
254
•
Skorowidz
Silverlight,23
symulator Sklepu Windows,239
Silverlight 5,36
symulowanie opcji
skalowanie,28 Sklep Windows,12,233,235
licencjonowania,238 szablon,28
typy danych,201 kafelków,169 kolekcji,155
Aplikacja podzielona,46
nawigacji,134
Alt+Enter,179
Aplikacja siatki,45
przechowanych danych,137
Alt+F4,52
Pusta aplikacja,45
skrót klawiszowy
Ctrl+Alt+I,173 Ctrl+Alt+O,64,131
szablony
Ctrl+F5,55
powiadomień, 181
Ctrl+R,227
projektów C#,45
Ctrl+Shift+A,130
wbudowane,32
Shift+F5,52
szczypanie,103
Windows+C,194
szyfrator strumienia,162
Windows+Q,194
szyfrowanie, 162
udostępnienie, 200 adresu URL,204 artykułu,209 fragmentu tekstu,205 zawartości, 159 UI,47,62,214 układ,78,95
słownik stylów StandardStyles,46
ś
słowniki zasobów,77 słowo kluczowe async,53,150
u
kafelków,170
środowisko
Canvas,79 GridView,90 listy,91
await,53,149
Desktop,36
VariableSizedWrapGrid,84
Binding,69
programowania, IDE,22
WrapGrid,83
new,148
Windows Store,36
Protocol,164
T
sortowanie,157 sposoby skalowania,88
tablice bajtów,160
stan,98
TDD,226
procesu,129 Snapped,99
technologia .NET Framework,14
standard ECMA-335,27
CLR,14
StandardStyles,46
XAML,14
stany puste,99
testowanie aplikacji,223-226,244
statyczny zasób,73
testy jednostkowe,226
stos komponentów aplikacji .NET Framework,23 Win32,22 Windows 8,27 strona informacyjna,117 strumienie,160 strzałka=>,152 stuknięcie, 103 styl,76 jawny,78 niejawny,77 SettingsBackButtonStyle,118 SuspensionManager,46 symbol,114 symulator,95,97
uprawnienia aplikacji,158 urządzenia DLNA,191
SOAP,Simple Object Access
TPL,Task Parallel Library,149 tryb
usługa WNS,183 usługi sieciowe,164 ustawienia,12,209 aplikacji,143 powiadomień, 180 przechowywania danych,138 symbolu,114 uwierzytelnianie dla WNS,186 użycie kanału OData,167 kontraktu Search,189
debugowania,132,173
V
manipulacji,106 tryby wprowadzania danych,104 tworzenie pliku,139 kafelka,172 łączy, 177 metod asynchronicznych,151 paneli,191 pierwszej aplikacji,44 polecenia OK,115 powiadomień, 180 statycznego zasobu,73 UI,47,61
VB,Visual Basic,21,35 YB.NET,35 View Code,48 Visual Studio 2012,32,39 Premium,43 Professional, 43 Test Professional, 43 Ultimate,43 VSM,Visual State Manager,98, 100,214
Skorowidz
w wartości ManipulationModes,
wskaźniki, 174
stanami, 99
wstrzykiwanie zależności, 222
wywołaniami,149
wstrzymanie aplikacji,131
zasoby,77
wątek,148
wymiary komórek,80
zawartość WWW,157
wątki aplikacji, 129
wyniki wyszukiwania,198
zdalny komputer,132
weryfikacja aplikacji,243
wyrażenia regularne,158
zdarzenia
WF, Workflow Foundation, 61
wyrażenie lambda, 152
wiązanie
wysyłanie aplikacji, 242
manipulacji,105
wyszukiwanie, 199
nawigacji,136
danych,69, 166 danych i konwerterów, 73
aplikacji,235
dwukierunkowe,72
programu Notatnik,194
widok, 95 Menedżera zadań,128 pomniejszony,1O1 przyciągnięty, 98 w MVVM,219
kierowane, 63
wskaźników,103 zdarzenie
w Dictionary.com, 195
Activated,182
w Internet Explorerze,194
Click,64 CollectionChanged, 156
wywołanie asynchroniczne, 150
CommandRequested, 119
PostToCloud, 188
DataRequested, 200
wznowienie aplikacji,133
Dismissed, 182
wielowątkowość, 148
wzorce projektowania Ul,214
DoubleTapped,111
Win32, 19
wzorzec MVVM, 213, 215
ZoomedlnView,102
Windows 95, 20
X
Windows RT, 37 12, 26,35 Windows Store,12,19,26
Navigating, 136 OnNavigatedTo,102
Windows 7, 26
Windows Runtime, WinRT, 9-
255
zasady projektowania,31
wybór symulatora, 96
105
•.
XAML, Extensible Application Markup Language,13,61 XAML dla układu
OnNavigatingFrom, 136 OnShareTargetActivated, 50 PointerEntered, 104 PointerExited,104 PointerPressed, 64,65
własne dane, 203
Grid, 80
PropertyChanged,71,156
własny ekran startowy,140
VariableSizedWrapGrid,84
Resuming,133
właściwości
W rapGrid, 83
SelectionChanged, 204
CLR, 66,67
XML dla kafelka, 173
klasy Timeline, 74
z
zależne,65 zasobu, 154 właściwość automatyczna,113 Content, 158 Setting, 182
ViewStateChanged, 99 złączenia, 15 7
dołączane, 67
znacznik msApplication PackageFamilyName, 234
zakładka Application Ul,117
zręby, 232
zakończenie działania aplikacji,
zwolnienie wskaźnika,104
133 zalecenia
ź
dotyczące kafelków,174
tag, 174
dotyczące paska aplikacji, 115
źródło treści, 200
zależna DataContext, 66
dotyczące wskaźników, 176
źródło udostępniania, 200
Zlndex,79
zapis
włączanie powiadomień, 181
danych, 144
WNS,Windows N otification
obrazu,53
Service,183,189
ż
zapisywanie w pamięci,137
żądania HTTP,158
WPF,36,214
zapytanie LINQ, 89,138,156,199
życie aplikacji,129
WSDL, Web Services
zarządzanie
żyroskop, 122
Description Language, 165 wskaźnik numeryczny, 175
aplikacjami, 28 PLM, 134
I BURY �DA WNICZEJ flELION
ZAR JESTRUJ SIĘ 2. PREZ NTUJ KSIĄZKI 3. ZBIERAJ PROWIZJĘ •
Zmień swoją stronę www w działający bankomat. Dowiedz s ę więcei i dołącz już dzis aj! http ://program-partnerski. hel i on. pl �l=!UPA Vi/'YL:IAWNIL:ZA.
·Helion SA