Interfejs telefonu. Wykład 3 sprzęt, technologie: Silverlight, XAML, XNA. Analogiczny do przeglądarki internetowej 3 przyciski

Transkrypt

1 Kwalifikacje kadry dydaktycznej kluczem do rozwoju Uczelni PROJEKT WSPÓŁFINANSOWANY ZE ŚRODKÓW UNII EUROPEJSKIEJ I EUROPEJSKIEGO FUNDUSZU SPOŁECZNEGO Uniwersytet Kazimierza Wielkiego w Bydgoszczy Wydział Matematyki, Fizyki i Techniki specjalność: Sieci i systemy rozproszone Technologie mobilne i rozproszone na platformie.net Wykład 3 sprzęt, technologie: Silverlight, XAML, XNA Interfejs telefonu Analogiczny do przeglądarki internetowej 3 przyciski Wstecz, Start, Wyszukiwanie Ekran pojemnościowy WVGA 800x480 WP8: oraz sprzętowa akceleracja wideo i grafiki (DirectX 9) 1

2 Unifikacja sprzętu Rozdzielczość 480x800 QVGA 320x480 HVGA Ekr. pojemnościowy 4 lub więcej punktów Sensory A-GPS, Akcelerometr, Kompas, Światło, Czujnik zbliżeniowy Aparat 5 mega pixeli lub więcej Przyciski Start, Szukaj, Wstecz 800 lub 480 Multimedia Dokładna specyfikacja Akceleracja kodeków Pamięć 256MB RAM lub więcej 8GB flash lub więcej GPU Akceleracja DirectX 9 Radio FM 480 lub 320 Do wykorzystania Sensory: GPS, akcelerometr, kompas, światło i czujnik zbliżeniowy, Kamera cyfrowa, mikrofon, Powiadomienia (push notifications), 256 MB (lub więcej) RAM oraz 8 GB (lub więcej) pamięci flash XNA Framework Audio: nagrywanie i odtwarzanie, Media Library Access, dostęp do usługi Xbox LIVE. Windows Phone Emulator! Technologie WP7 2

3 Jak dla PC Czyli:.NET, XAML, Silverlight, ExpressionBlend. Do budowy aplikacji webowych i lokalnych! ale Brak zgodności z Windows Mobile Mało (nic?) wspólnego z Windows 7 Skąd narzędzia? Programowanie Jedno z dwu wybranych API: Microsoft Silverlight aplikacje użytkowe z interfejsem opisywanym w XAML XNA (do programowania konsol XBOX API) pozwala wykorzystać możliwości graficzne do tworzenia gier aplikacje multimedialne Visual Studio 2010 Express for Windows Phone bezpłatne! Windows Phone Developer Tools 3

4 Zestaw zawiera Windows Phone Developer Tools Microsoft Visual Studio 2010 Express for Windows Phone Windows Phone Emulator Windows Phone SDK 7.1 Assemblies Silverlight 4 SDK and DRT Windows Phone SDK 7.1 Extensions for XNA Game Studio 4.0 Microsoft Expression Blend SDK for Windows Phone 7 Microsoft Expression Blend SDK for Windows Phone OS 7.1 WCF Data Services Client for Window Phone Microsoft Advertising SDK for Windows Phone Optional Visual Basic / VB tools download ale raczej nie Wymagania System operacyjny Vista x86/x64 +SP2 (oprócz Starter Edition) Windows 7 x86/x64 (oprócz Starter Edition) nie działa na: Windows Server, Windows 8, XP, virtual Sprzęt 4 GB free HDD 3 GB RAM Windows Phone Emulator DirectX 10 or later graphics card: min.wddm 1.1 and DDI 10 lub póżniejszy. Narzędzia dodatkowe Microsoft Expression Blend - dla grafika ułatwia tworzenie zaawansowanych interfejsów graficznych bez linijki kodu w środowisku Visual Studio z ręki przez pisanie kodu w języku XAML. DeepZoom Composer efekty zbliżania - oddalania zdjęcia Expression Encoder dekodowanie formatu video (zgodny z DirectShow) do formatu *.wmf(obsługiwany przez Silverlight). pozwala dodawać znaki wodne do pliku filmowego. 12 4

5 Narzędzia dodatkowe Silverlight Toolkit otwarty projekt -dodatkowe kontrolki, komponenty i narzędzia pełne kody źródłowe związane ze wszystkimi elementami Silverlight Toolkit. Component One Studio for Silverlight : przykłady (z kodem źródłowym i dokumentacją) wykorzystania kontrolek, XapOptimizer -optymalizuje projekt Silverlight, redukuje wielkości aplikacji, umożliwia obfuskację kodu. 13 Pierwszy program WITAJ, ŚWIECIE 14 Środowisko pracy VS Visual C# -Silverligt for Windows Phone - Windows Phone App 5

6 Wybór szablonu Silverligt for Windows Phone szybkie tworzenie aplikacji z przyjaznym i efektownie wyglądającym interfejsem użytkownika XNA wspomaga pisanie gier, łatwe do przeniesienia na inne platformy (Xbox) Integracja Silverlight + XNA Silverligt for Windows Phone Windows Phone Silverligt and XNA Application aplikacje o rozbudowanej grafice (XNA) + wygoda tworzenia interfejsu użytkownika 16 Silverligt for Windows Phone Windows Phone Application 17 Witaj, świecie Założenia Przycisk wyświetlający komunikat Toolbox, kontrolka Button Dodać procedurę zdarzeniową button1_click kod: MessageBox.Show("Witaj, Świecie!"); Uruchomić (F5) 18 6

7 Windows Phone Emulator Uruchomienie aplikacji bez urządzenia Symuluje działanie: procesora, pamięci RAM, procesora graficznego (GPU) ekranu dotykowego dla komputera z touchpad-em Łączy aplikacje z siecią, Pozwala na debuggowanie. 19 Menu emulatora Kursor myszki do górnej, prawej krawędzi 1. zamknij emulator 2. zminimalizuj emulator 3. obróć emulator o 90 stopni w lewo 4. obróć emulator o 90 stopni w prawo 5. dopasuj wielkość emulatora do wielkości ekranu 6. szczegółowe opcje powiększenia 7. symulacja akcelerometru i GPS 20 Emulator - inne Przyciski Back: powrót do poprzednio wyświetlanego widoku, Start: główny widok systemu (tzw. hub), dodatkowa funkcja przytrzymanie ruchomi usługę komend głosowych (potrzebny mikrofon!) Search: wyszukiwarka Bing. Kontrola głośności volume up: F9 volume down: F10 oprogramowanie aparatu: F7 Wsparcie dla ekranów multitouch wymagany touchpad 21 7

8 Technologie aplikacji WP7 W zależnosci od potrzeb Silverlight + XAML XNA lub obie razem Aplikacja bazodanowa ilu użytkowników? tys. 1mln? Chmura Microsoft Azure+ SQL Azure Serwis Bing Maps, pozycjonowanie 22 Po co ten xaml?? Prawdziwy programista: interfejs użytkownika to jedna z części systemu bynajmniej nie jest to dość ważna rzecz to nie jest jeden z PROBLEMÓW do rozwiązania Użytkownik Program (aplikacja) to jest interfejs użytkownika czy GUI to programowanie obiektowe?? Dla kogo piszemy programy? Interfejs użytkownika to podstawowa i bardzo ważna część większości aplikacji! 23 Rozwiązanie Interdyscyplinarność Design = nauka + sztuka + człowiek Design jako nauka to połączenie wiedzy technicznej i humanistycznej! Design jako sztuka to powiązanie barwy, grafiki, estetyki, wzornictwa. Design to poznawanie człowieka i praca dla człowieka. Programowanie to nie budowa GUI! 24 8

9 Jak Współpraca Programiści i projektanci techniczni Designerzy i projektanci GUI Konsultanci i eksperci branżowi Jak to zrealizować? - warstwy aplikacji! logika programu kod, np. C# GUI opis w xaml ewentualnie Expression Blend (grafika 2D i 3D, definiowanie materiałów, animacje projektowane na linii czasu, video High Definition 25 Silverlight: xaml + C# Flash: reklamy, multimedia gry w przeglądarce (Quake, Counter Strike itp.) Silverlight(wcześniej WPF/E ) Flash od Microsoftu? też jako plugin (ok. 5 MB)do przeglądarek, wspiera zewnętrzne kodeki, wykorzystuje GPU (filmy HD), do bogatych aplikacji internetowych (RIA), kontrolki (wykresy, grafy) - odbiorca biznesowy? developer: VisualStudio, całe środowisko.net 26 Różnice w działaniu Obie technologie: po stronie użytkownika Różnice: sposób komunikacji aplikacji z serwerem Flash: niezależny od przeglądarki własne odpowiedniki cookies, dostęp do dysku, komunikacja z serwerem +: efektywność działania -: aplikacja może być groźna! Silverlight: aplikacje w ramach piaskownicy (sandbox), ogranicza zasięg uprawnień kodu bezpieczeństwo zależy w dużej mierze od przeglądarki. aplikacje SL mogą pracować offline(lokalnie bez przeglądarki) 27 9

10 Nie tylko Windows, nie tylko desktop Działanie na wielu platformach (Silverlight 5, 2012) narzędzia Expression Studio (tylko Windows), środowisko wykonawcze dostępne jest na platformie: Mac OS X (Safari 4+), Linux (Firefox 3+), Windows (XP/Vista/7 z przeglądarką IE9+ lub Firefox3+ lub Chrome 12+ Windows bez przeglądarki! Silverlight podstawowe środowisko do rozwoju aplikacji dla Windows Phone 7, podstawowa platforma aplikacyjna dla nowej edycji Windows Embedded odbiorniki TV, kioski informacyjne, automaty sprzedażowe itp.) Windows Embedded Compact 7 28 Więcej informacji: Windows Phone 7: Windows Embedded Compact 7: msdn.microsoft.com/ee502198(v=winembedded. 60) Symbian: msdn.microsoft.com/library/ff770305(v=vs.95) 29 Dlaczego Silverlight? Podstawowa technologia WP7 Ale też aplikacje web-owe dane w sposób graficzny (np. medyczne, finansowe) streamingmediów gry bogate aplikacje internetowe I aplikacje lokalne (off-line)

11 Silverlight i media Kamera i mikrofon dostęp za zgodą użytkownika API do wyboru urządzeń przechwytywany sygnał RAW lokalne nagrywanie i przetwarzanie Multicasting(dowolna liczba odbiorców) odtwarzanie z Windows Media Services (WMS) 31 Zabezpieczenia treści OfflineDRM AES lub Windows Media DRM własność, wypożyczenie czasowe, subskrypcja, itp. MP4 DRM zabezpieczanie plików H264 i AAC-LC Zabezpieczenia wyjścia (np. TV) tzw. polisy bezpieczeństwa VOD.Onet.pl, IPLA, TVP (Olimpiada),. 32 Inne Obsługa schowka, Drukowanie, RichTextView, kierunki tekstu Wielopoziomowe UNDO Różne egzotyczne języki (Arabski, Hebrajski, Tajski), Formularze, lokalne bazy danych itd 33 11

12 Do budowy GUI Visual Studio lub Expression Blend Elementy grafiki wektorowej Opis GUI (xaml) Proste animacje Wiązanie danych (binding) z kontrolkami. Z innych narzędzi: Adobe Ilustrator Microsoft Expression Design Szczegóły kolejny wykład 34 Microsoft XNA Zbiór narzędzi umożliwiających tworzenie aplikacji multimedialnych, upraszczają korzystanie ze środowiska DirectX. Przeznaczenie: do tworzenia tzw. casualgames mała gra, którą można włączyć od czasu do czasu dla szybkiej, niewyczerpującej rozrywki, budowa bez posiadania zaplecza obsługi programistów, grafików i in., nawet jedna osoba może stworzyć kompletną grę (socialgames społeczne tworzenie gier), miesięcznie w gry tego typu gra w internecie kilkaset milionów osób (ok. 200 mln, 2007 rok!) 35 Microsoft XNA Na platformy Windows,XBOX360, Zune. Windows Phone Efekt budowa aplikacji na różne platformy różnice dotyczą głównie sposobu sterowania ograniczenie kosztów, zwiększenie liczby potencjalnych klientów

13 XNA Zasoby gry w folderze Content tekstury, modele, muzyka itp., ładowane wraz z uruchomieniem gry, do zarządzania: Content Pipeline Uruchomienie Program.cs- zawiera metodę Main() tylko w Windows lub na Xbox kod w #if WINDOWS XBOX Game1.cs zawiera właściwy kod gry public class Game1 :Microsoft.Xna.Framework.Game w WP7 system szuka klasy dziedziczącej z Microsoft.Xna.Framework.Game Szczegóły będzie wykład 37 Scenariusz budowy aplikacji Projekt w klasyczny sposób, ale koniecznie Visual Studio Szkielet interfejsu użytkownika Silverlight programista: C#, logika aplikacji GUI grafik: (XAML, Expression Blend) 38 Warsztat pracy Microsoft Visual Studio 2010 dla programisty ExpressionStudio dla projektanta Expression Blend, Web, Design, Media, Encoder Narzędzia graficzne firm trzecich np. PhotoShop 39 13

14 Struktura rozwiązania SplashScreenImage.jpg: ekran powitania ApplicationIcon.png, Background.png ikona aplikacji na liście aplikacji i jako kafelek. MainPage.xaml: strona główna MainPage.xaml.cs: kod strony głównej Bin, obj: rezultat kompilacji, pliki tymczasowe References wszelkie zewnętrzne powiązania z wytwarzaną aplikacją (w programie konieczne using) Properties Właściwości 40 Struktura dla XNA Properties informacje na temat aplikacji, zapisane w Manifeście typ (XNA lub Silverlight) ścieżki do zasobów zewnętrznych, Inne, np. potrzebne podczas procesu weryfikacji w Marketplace Content zasoby gry (tekstury, modele, muzyka itp.), Pliki z kodem C# Program.cs - zawiera metodę Main() tylko pod Windows lub na konsoli Xbox Game1.cs właściwy kod gry 41 Instalacja dla WP7 Plik instalacyjny : *.xap faktycznie archiwum zip 42 14