Windows Phone 7.5 (Mango)

Átírás

1 Windows Phone 7.5 (Mango) Mobilalkalmazás fejlesztés lépésről lépésre Előadó: Barabás Péter Általános Informatikai Tanszék Miskolci Egyetem

2 Témák Windows Phone platorm Silverlight alapok MVVM modell MVVM Light Toolkit View Alapvető WP7 vezérlők Adatkötés Térképek Navigáció Figyelmeztetések, riasztások

3 Témák II. Telefonos funkciók Érintőképernyő használata Gyorsulásérzékelő Giroszkóp Iránytű Adatkezelés Lapkák Push Notifications

4 Windows Phone platform Előírások: Fizikai gombok: Back, Home, Search Kijelző: min. 800x480 Kapacitív Min. 4 pontos érintés Hálózati jellemzők: Mobil adathálózatok kezelése WiFi támogatás Memória: Min. 256MB operatív memória Adattárolásra: min 8GB flash egység Navigáció: assisted-gps Mozgásérzékelés: gyorsulásmérő

5 Windows Phone platform II. Opcionális hardverek: Iránytű Giroszkóp Hátsó kamera Előlapi kamera Részek: Futtatókörnyezet (Silverlight, XNA) Integráció felhővel Marketplace portál szolgáltatások Fejlesztőeszközök

6 Futtatókörnyezet felépítése

7 Integráció a felhővel Értesítések: push notifications Térképszolgáltatások Közösségi hálózatok Xbox Live szogáltatások

8 Marketplace portálszolgáltatások Regisztráció fejlesztőknek Alkalmazások közzététele

9 Fejlesztőeszközök Visual Studio 2010 Express for Windows Phone Windows Phone Emulator Expression Blend for Windows Phone Segédprogramok: Resharper 6 MVVM Light Toolkit

10 Silverlight, WPF, XAML Windows Forms korlátok WPF Silverlight: böngészők, WP7 XAML: deklaratív UI leírás <Button Content="Hello World"/> <Button> <Button.Content> <StackPanel> <Ellipse Fill="Red" Width="10" Height="10"/> <TextBlock Text="Hello World"/> </StackPanel> </Button.Content> </Button>

11 WP7 Projekt szerkezete Properties: Az alkalmazás tulajdonságait és beállításait tartalmazó állományok References: Hivatkozott egyéb könyvtárak App.xaml (App.xaml.cs): Az alkalmazást reprezentáló objektum és a mögöttes kódja ApplicationIcon.png: A lapkához tartozó kép Background.png: Az alkalmazás háttérképe MainPage.xaml (MainPage.xaml.cs): Az alkalmazás főoldala és a kapcsolódó mögöttes kód SplashScreenImage.png: Induláskor megjelenő, töltési idő alatt látható kép

12 WMAppManifest.xml Alapbeállítások Capabilities Mihez férjen hozzá az alkalmazás Induló oldal Leíró információk

13 MVVM modell

14 Panorama vezérlő

15 Pivot vezérlő Windos Phone saját Tab vezérlője Önálló, elkülönített nézetek egymás mellett navigációval Menüelem fejléc érintéssel Horizontális mozgatással Nem egy nagy téren helyezkednek el

16 Alapvető WP7 vezérlők Elrendezés-vezérlők: Grid, Convas, StackPanel Parancsvezérlők: Button, HyperlinkButton Checkbox, RadioButton, Szövegmegjelenítési vezérlők: TextBlock, RichTextBox Szövegbeviteli vezérlők: TextBox InputScope (virtuális billentyűzet) PasswordBox Listavezérlők ListBox

17 Adatkötés (Binding) Megvalósítások INotifyPropertyChanged interfész DependencyObject ősosztály DataContext megadás View ViewModel kötése Converterek UI Elemek közötti adatkötés StaticResource-ök

18 Adatmegjelenítés testreszabása Listbox esetén: Egyszerűbb esetben: DisplayMemberPath Összetett objektum megjelenítés esetén: ItemsSource kötése listához (ObservableCollection) ListBox.ItemTemplate megadása DataTemplate benne tetszőleges vezérlők

19 Témák használata Stílusok, alapbeállítások definiálása App.xaml-be tehetjük, vagy inkludálhatjuk Silverlight erőforrásként definiálja az alapbeállításokat Adatkötésben is szerepelhetnek Új project létrehozásánál template alapján a xaml-ben láthatóak ilyen erőforrások

20 Térképek kezelése Bing Maps Feliratkozás a szolgáltatásokra: Live ID kell hozzá Szabályok: Nem írhatunk valós idejű navigációt megvalósító alkalmazást. A programunk nem működhet együtt más térképszolgáltatásokkal. A közlekedési adatok nem használhatók televízió, rádió, újság, azaz média esetében. Nem tárolhatunk közlekedési adatokat. Nem használhatunk pornográf pushpineket.

21 Térképek kezelése II. Map CredentialProvider: API key Center ZoomLevel, ZoomBarVisibility Mode: Road, Aerial PushPinek: POI, helyek Location Background, tetszőleges tartalom Rétegek: MapLayer ObservableCollection alkalmazása

22 Egyéb szolgáltatások Geocode service codeservice/geocodeservice.svc Route service eservice/routeservice.svc Search service chservice/searchservice.svc

23 Útvonaltervezés RouteOptions RoutePathType, Optimization, TrafficUsage, Mode Waypoint lista létrehozása RouteRequest Credentials + RouteOptions + Waypoints MapPolyline FELADAT: térkép készítése útvonallal

24 Navigáció HyperlinkButton NavigationService GoBack() Navigate(Uri) Navigating Navigated CurrentSource Source CanGoBack NavigationContext QueryString: kulcs-érték párok BackStack (history) RemoveBackEntry FELADAT: előző példa kiegészítése főmenü oldallal, paraméter átadás

25 Alkalmazás élteciklusa

26 Alkalmazás állapotok Mentés, helyreállítás Dormant Activated: nincs teendő IsApplicationInstancePreserved Nem dormant állapot esetén PhoneApplicationService: Dictionary<T> Deactived esetén automatikusan menti Végleges mentés: IsolatedStorage-ben DataContract, XML, SQLServer CE

27 IsolatedStorage IsolatedStorageFile Itt hozhatunk létre saját mappákat, fájlokat IsolatedStorageFileStream File.CreateFile, File.OpenFile DataContractSerializer

28 Figyelmeztetések, riasztások Alarm Content BeginTime ExpirationTime RecurrenceType Sound ScheduledActionService.Add ScheduledActionService.Find ScheduledActionService.Remove

29 Adatok letöltése a háttérben BackgroundTransferService BackgroundTransferRequest DownloadLocation TransferPreferences Allow cellular and battery Korlátok: Feltöltés: max 5MB Letöltés mobil csatornán: 20MB Letöltés WiFi-n: 100MB

30 Alapvető telefonos funkciók Launcher-ek ComposeTask : üzenet írása és küldése MediaPlayerLauncher: vmegadott média (video / audio) lejátszása PhoneCallTask: Telefonhívás indítása SmsComposeTask: SMS írása WebBrowserTask: Böngésző indítása SearchTask: Webes keresés MarketplaceDetailTask: Alkalmazás részleteinek mutatása a Marketplace kliensben MarketplaceHubTask: Marketplace kliens indítása MarketplaceReviewTask: Vélemény írása alkalmazásunkról a Marketplace-re MarketplaceSearchTask: Keresés indítása a Marketplace kliensben

31 Alapvető telefonos funkciók II. Chooserek: SavePhoneNumberTask: Telefonszám mentése a kapcsolatok tárába SaveContactTask: Új partner felvétele a kapcsolatlistára Save AddressTask: cím mentése a kapcsolatok tárába AddressChooserTask: cím kiválasztása kapcsolatlistánkról AddressChooserTask: Cím kiválasztása kapcsolatlistánkról CameraCaptureTask: Kép készítése alkalmazásunk számára PhoneNumberChooserTask: Telefonszám kiválasztása kapcsolatlistánkról PhotoChooserTask: Fénykép kiválasztása a fényképtárból SaveRingtoneTask: Csengőhang mentése GameInviteTask: Több résztvevős játékokban a partnerek meghívását teszi lehetővé

32 Alapvető telefonos funkciók III.

33 Adatok megosztása alkalmazások között PhoneDataSharingContext Contacts Accounts, Addresses, Birthdays, Children, Companies, CompleteName, DisplayName, Addresses, IsPinnedToStart, Notes, PhoneNumbers, SignificantOthers, Websites, GetPicture() Appointments Account, Attendies, Details, StartTime, EndTime, IsAllDayEvent, IsPrivate, Location, Organizer, Status, Subject

34 Érintőképernyő kezelése Tap DoubleTap Hold Multitouch manipulációk ManipulationStarted ManipulationDelta ManipulationCompleted Nyers adatok kezelése Touch.FrameReported TouchFrameEventArgs: SuspendMousePromotionUntilTouchUp GetPrimaryTouchPoints GetTouchPoints

35 Helymeghatározás GeoCoordinateWatcher PositionChanged: ha változik a koordináta Beállítások: MovementThreshold DesiredAccuracy: Default, High GeoCoordinate: Latitude, Longitude, Altitude Timestamp Horizontal-, VerticalAccuracy Course Speed Start, Stop

36 Helyzetmeghatározás Accelerometer IsSupported CurrentValueChanged SensorReadingEventArgs<AccelerometerReading> SensorReading TimeStamp Acceleration: X,Y,Z AccelerateGame feladat

37 Giroszkóp használata Gyroscope IsSupported TimeBetweenUpdates CurrentValueChanged SensorReadingEventArgs: GyroscopeReading Start, Stop

38 Iránytű használata Compass IsSupported CurrentValueChanged SensorReadingEventArgs: CompassReading MagneticHeading: mágneses északi sarkhoz képest TrueHeading: geográfiai északi sarkkal MagnetometerReading: Vector3 (X,Y, Z) tengelyeken mérhető microtesla HeadingAccuracy: mérés pontatlanság fokban Calibrate esemény Start, Stop

39 Adatkezelés IsolatedStorage ApplicationSettings File IO Lokális adatbázisok (SQL Server CE)

40 ApplicationSettings IsolatedStorageSettings.ApplicatioSettings Dictionary<Tkey, Tvalue> szótár Új érték létrehozása: Add Létező kulcs esetén: System.ArgumentException Indexer Létező kulcs esetén felülírás Érték lekérdezés: Indexer KeyNotFound nem létező kulcs esetén TryGetValue<T> Nincs hiba. Contains Save(), Remove(kulcsérték), Clear()

41 IsolatedStorageFileStream IsolatedStorageFile GetUserStoreForApplication StreamWriter StreamReader Tulajdonságok: AvailableFreeSpace, IsEnabled, Quota, UsedSize Metódusok: CopyFile, CreateDirectory, CreateFile, DeleteDirectory, DeleteFile, DirectoryExist, FileExist, GetCreationTime, GetDirectoryNames, GetFileNames, GetLastAccessTime, GetUserStoreForApplication, MoveDirectory, MoveFile, OpenFile, Remove Jegyzetkészítő feladat.

42 Lokális adatbázisok LINQ to SQL DataContext Table attribútum [Table(Name="Countries")] public class Country { }

43 Lokális adatbázisok II. Adatbázis létrehozása: using (CustomerDataContext db = new CustomerDataContext("isostore:/Customer.sdf")) { if (!db.databaseexists()) { db.createdatabase(); } } SQL Server Management Studio 2008 Express SQLMETAL Model generálása sdf-ből Csak olvasható: IsoStore-ba kell másolni, ha írni is akarjuk

44 INSERT Adatok felvitele Customer mycust = new Customer() { CustomerID = 1, CompanyName = ME", ContactName = Barabás Péter", City = "Budapest" }; db.customers.insertonsubmit(mycust); db.submitchanges();

45 SELECT Adatok lekérdezése var result = from c in db.customers select c; var result = db.customers.select(s => s); var result = from c in db.customers where c.city == "Budapest" select c; var result = db.customers.where(s => s.city == "Budapest"); var result = from c in db.customers orderby c.city select c; var result = db.customers.orderby(s => s.city);

46 UPDATE Adatok módosítása var result = from c in db.customers select c; foreach (var item in result) { item.city = "Seattle"; } db.submitchanges();

47 DELETE Adatok törlése var selecteditem = (from c in db.customers where c.customerid == 1 select c).first(); db.customers.deleteonsubmit(selecteditem); db.submitchanges();

48 Adatok biztonsága CustomerDataContext db = new CustomerDataContext("Data Source='isostore:/Customer.sdf'; Password='Pa$$word1'"); if (!db.databaseexists()) { } db.createdatabase();

49 Lapkák Statikus, dinamikus Kiszögezés Csak a felhasználó (elsődleges) Marketplace deploy során ellenőrzés Felépítés: Első felület: Háttérkép, Cím, Számláló Hátsó felület: Háttérkép, Cím, Tartalom Méret: 173x173 pixel

50 Lapkák II. Elsődleges lapkák Másodlagos lapkák Alkalmazásból kitűzhető Deep Linking (Uri query string) Uri-knak külünböznie kell ShellTile API ActiveTiles StandardTileData Update() Create()

51 Lapkák frissítése ShellTileSchedule Background Agent WP Scheduled Task Agent PeriodicTask 25s/30perc ResourceIntensiveTask 10perc folyamatos bizonyos feltételek mellett periodictask = new PeriodicTask(periodicTaskName); periodictask.description = "This is the Tile Updater sample."; try { ScheduledActionService.Add(periodicTask); } catch (Exception ex) { } MessageBox.Show(ex.Message);

52 Felugró értesítések Csak alkalmazáson kívül OnInvoke(): ShellToast toast = new ShellToast(); toast.title = "Értesítés"; toast.content = "Az üzenet tartalma"; toast.show();

53 Push Notifications 1. Alkalmazásunk jelzi a telefon felé, hogy szeretne push üzeneteket fogadni. 2. A telefon operációs rendszerének részét alkotó Push kliens az interneten át közli ezt a szándékot az MPNS-szel. Az MPNS egy publikus URL-t állít elő, és vállalja, hogy az ide érkező üzeneteket továbbítja a telefonnak. Ezt az URL-t pedig visszaküldi a Push kliensnek, aki visszaadja az alkalmazásuknak. 3. Alkalmazásunknak ezt az URL-t közölnie kell a szerverünkkel. Erre tetszőleges kommunikációs forma használható. Érdemes webszolgáltatásokkal megoldani, amikről a 9. fejezetben bővebben esik szó. 4. Ha szerverünk ezután bármikor üzenni szeretne a telefonnak, akkor erre az URL-re küldi el üzenetét. Ezt az MPNS kapja meg, és továbbítja a készülék felé.

54 Push Notifications II. Kérni kell a felületen Max. 30 csatorna/telefon Max. 1 csatorna/alkalmazás Max. 500 üzenet/nap/telefon (HTTP) Üzenettípusok: Lapkafrissítés Felugró értesítések Raw üzenet

55 Köszönöm a figyelmet!