Windows 8. Tworzenie aplikacji z użyciem C# i XAML 9788324670628, 0321822161

Windows 8 na dobre zadomowił się już na komputerach użytkowników. Jego nowy interfejs budzi wiele kontrowersji - jedni g

714 18 18MB

Polish Pages [256] Year 2013

Report DMCA / Copyright

DOWNLOAD FILE

Polecaj historie

Windows 8. Tworzenie aplikacji z użyciem C# i XAML
 9788324670628, 0321822161

Table of contents :
Spis treści
Słowo wstępne (9)

Wprowadzenie (11)

Podziękowania (15)

O autorze (17)

1. Nowe środowisko uruchomieniowe Windows (19)

Spojrzenie wstecz - Win32 oraz .NET (19)
Spojrzenie w przód - rozwój NUI (24)
Wprowadzenie do aplikacji Windows Store (26)
Projekt Windows 8 (28)
Szybkość i płynność (28)
Przyciąganie i skalowanie (28)
Użycie właściwego kontraktu (28)
Duże kafelki (29)
Żywy i podłączony (30)
Zgodność z zasadami projektowania Windows 8 (31)
Niezbędne narzędzia dla Windows 8 (31)
Blend dla Visual Studio (32)
HTML5 wraz z JavaScript (32)
C++ wraz z XAML (34)
VB/C# oraz XAML (35)
Wewnątrz WinRT (35)
WPF, Silverlight oraz niebieski stos (36)
Podsumowanie (37)
Cytowane prace (37)
2. Zaczynamy (39)

Konfigurowanie środowiska (39)
Windows 8 (39)
Visual Studio 2012 (43)
Blend (44)
Witaj, Windows 8 (44)
Tworzenie pierwszej aplikacji Windows 8 (44)
Szablony (44)
Aplikacja ImageHelper (47)
Pod maską (56)
Podsumowanie (60)
3. Język XAML (Extensible Application Markup Language) (61)

Deklarowanie interfejsu użytkownika (61)
Drzewo wizualne (63)
Właściwości zależne (65)
Właściwości dołączane (67)
Wiązanie danych (69)
Konwertery wartości (72)
Serie ujęć (74)
Style i zasoby (76)
Układ (78)
Element Canvas (78)
Element Grid (79)
Element StackPanel (81)
Elementy VirtualizingPanel oraz VirtualizingStackPanel (81)
Element WrapGrid (82)
Element VariableSizedWrapGrid (83)
Element ContentControl (85)
Element ItemsControl (86)
Element ScrollViewer (86)
Element ViewBox (86)
Element GridView (88)
Element ListView (91)
Element FlipView (91)
Element ListBox (92)
Wspólne kontrolki (92)
Podsumowanie (92)
4. Aplikacje Windows 8 (95)

Układy i widoki (95)
Symulator (95)
Visual State Manager (98)
Semantyczne powiększanie (101)
Obsługa zdarzeń użytkownika (103)
Zdarzenia wskaźników (103)
Zdarzenia manipulacji (105)
Obsługa myszy (106)
Obsługa klawiatury (107)
Efekty wizualne (108)
Celowanie (110)
Menu kontekstowe (111)
Pasek aplikacji (112)
Ikony i ekrany powitalne (117)
Strona informacyjna (117)
Czujniki (119)
Przyspieszeniomierz (120)
Kompas (121)
Geolokalizacja (121)
Żyroskop (122)
Inklinometr (122)
Czujnik światła (123)
Czujnik orientacji (123)
Podsumowanie (124)
5. Cykl życia aplikacji (127)

Zarządzanie czasem życia procesu (129)
Aktywacja (130)
Wstrzymanie (131)
Zakończenie działania (133)
Wznowienie (133)
Nawigacja (134)
API Application Data (137)
Żywy i podłączony (140)
Własny ekran startowy (140)
Podsumowanie (141)
6. Dane (143)

Ustawienia aplikacji (143)
Odczyt i zapis danych (144)
Potrzeba szybkości i wielowątkowości (148)
Użycie async i await (150)
Wyrażenia lambda (152)
Metody pomocnicze IO (152)
Osadzone zasoby (153)
Kolekcje (155)
Zapytania zintegrowane z językiem (LINQ) (156)
Zawartość WWW (157)
Udostępniana zawartość (159)
Strumienie, bufory i tablice bajtów (160)
Kompresja danych (160)
Szyfrowanie i podpisywanie danych (162)
Usługi sieciowe (164)
Obsługa OData (167)
Podsumowanie (168)
7. Kafelki i powiadomienia (169)

Proste kafelki (169)
Kafelki aktywne (170)
Wskaźniki (174)
Kafelki podrzędne (176)
Powiadomienia wyskakujące (179)
Usługa Windows Notification Service (183)
Podsumowanie (189)
8. Tworzenie paneli w aplikacji (191)

Wyszukiwanie (192)
Udostępnianie (200)
Źródło treści do udostępniania (200)
Pobieranie treści przy pracy jako cel udostępniania (205)
Ustawienia (209)
Podsumowanie (212)
9. MVVM i testowanie (213)

Wzorce projektowania interfejsu użytkownika (214)
Model (217)
Widok (218)
Model widoku (219)
Przenośna biblioteka klas (220)
Dlaczego testujemy? (223)
Testowanie eliminuje założenia (223)
Testowanie usuwa błędy u źródła (224)
Testowanie pomaga dokumentować kod (224)
Testowanie ułatwia rozszerzanie i utrzymywanie aplikacji (225)
Testowanie poprawia architekturę i projekt (225)
Testowanie pozwala rozwijać się programistom (226)
Konkluzja - pisz testy jednostkowe! (226)
Testy jednostkowe (226)
Platforma testów jednostkowych Windows Store (227)
Imitacje i zręby (230)
Podsumowanie (232)
10. Pakiety i instalacja (233)

Sklep Windows (233)
Wyszukiwanie (233)
Zasięg (235)
Modele biznesowe (237)
Reklamy (240)
Przygotowanie aplikacji do sklepu (241)
Proces (242)
Użycie App Certification Kit (242)
Czego możesz się spodziewać? (245)
Ładowanie boczne (245)
Podsumowanie (247)
Skorowidz (249)

Citation preview

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



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



� 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

� ' :



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



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