1
Introduksjon til applikasjonsutvikling for
Windows Phone
Skrevet av Atle Nes
Avdeling for informatikk og e-læring Høgskolen i Sør-Trøndelag
Nettbasert
undervisning fra http://itfag.hist.no/
Om Windows Phone Windows Phone (http://www.windowsphone.com/) er et
operativsystem for mobiltelefoner utviklet av Microsoft
(http://www.microsoft.com/). Tidligere hadde Microsoft et
operativsystem som het Windows Mobile som var laget for
mobiltelefoner og som brukte pekeredskap. Dette må ikke
forveksles og er inkompatibelt med Windows Phone.
Sammenlignet med de andre store plattformene for mobile operativsystemer; Android
(http://www.android.com/) og iOS (http://www.apple.com/iphone/ios/), er Windows Phone nyest
og ble lansert så sent som i 2010. Andre generasjon av Windows Phone kom i 2012 og heter
Windows Phone 8. Vi kommer til å forholde oss til denne versjonen heretter.
Windows Phone 8 tilbyr blant annet:
Første mobile operativsystem med Windows NT operativsystemkjerne
(samme som vi finner i Windows 8)
Støtte for flere skjermstørrelser enn tidligere:
WVGA 800x480 15:9 (standard), WXGA 1280x768 15:9, 720p 1280x720 16:9
Støtte for flerkjerneprosessorer med inntil 64 kjerner!
Deling av innhold og mikrobetalinger med NFC (Near Field Communication)
Lagring av kredittinformasjon og lojalitetskort med Wallet
Bakoverkompatibilitet med Windows Phone 7.x
Støtte for ekstern lagring på SD-kort (Secure Digital)
Integrasjon av VOIP (Voice Over Internet Protocol) i operativsystemkjernen
Nokia Maps erstatter Bing Maps som standard kartapplikasjon
Nokia Drive med stemmestyrt navigasjon og mulighet til å lagre kart lokalt
128-bit kryptering med BitLocker og Secure Boot
Internet Explorer 10 nettleser
Bedre multitasking
Kids Corner kan brukes til å begrense tilgangen på applikasjoner
Innebygget støtte for å ta skjermbilder
Redesignet startskjerm
2
Om Metro-grensesnittet Med lanseringen av Windows Phone ble det også utviklet et nytt
design med kodenavnet Modern Style UI (også kalt Metro) som vi
skal bli kjent med etter hvert. Metro-designet består blant annet
av en startskjerm med såkalte levende fliser (Live Tiles). Hver flis
representerer en applikasjon, en webside, en kontakt, et
medieelement eller lignende. I denne leksjonen skal vi se på hva
som må til for å lage vår første applikasjon eller en app om du vil
(som er det samme som et program).
Flisene på startskjermen er ordnet i et rutemønster og er levende i
den forstand at de kan ha animasjoner med innhold styrt av
applikasjonene. Animasjonen på en flis kan f.eks. inneholde
sanntidsinformasjon om været der du er akkurat nå. I tillegg til å
ha mulighet til å velge plassering på en flisene er det mulig å endre
både farger og størrelsene på flisene. Man kan velge mellom liten
og stor (og kjempestor avhengig av om applikasjonen støtter det).
På denne måten står hver enkelt bruker temmelig fritt til å sette
opp og utforme sin egen personlige startskjerm.
Et lignende Metro-grensesnitt med levende fliser finner vi også igjen på Windows 8, som er Microsoft
sitt nyeste operativsystem for litt større personlige datamaskiner.
Om mobiltelefoner (håndsett) Foreløpig lager ikke Microsoft noen mobiltelefoner selv, men det finnes derimot en rekke
maskinvareprodusenter som produserer slike. De viktigste selskapene er Nokia (www.nokia.com/),
Samsung (http://www.samsung.com/) og HTC (http://www.htc.com/).
Figur 2. HTC 8X (venstre), Nokia Lumia 920 (midten), Samsung ATIV S (høyre)
Figur 1. Startskjermen til Windows Phone 8
3
Det er fullt mulig å utvikle applikasjoner uten håndsett. Vi benytter oss da av en emulator som kan
simulere en virkelig telefon og gjør at vi får opp grensesnittet på en kunstig mobiltelefon på
datamaskinen i stedet. Dette gir selvfølgelig ikke helt samme mulighet til å teste ut alle funksjonene
som på en reell mobiltelefon, men er ofte godt nok i utviklingssammenheng. Vi skal komme tilbake til
hvordan dette fungerer i praksis litt senere.
Hva trenger vi for å komme i gang? Utgangspunktet for å programmere applikasjoner for Windows Phone er Windows Phone Dev Center
(http://dev.windowsphone.com/). Dette er en nettside for utviklere hvor vi blant annet kan finne
lenke til Windows Phone SDK. Vi kan tenke på en SDK (Software Development Kit) som en slags
verktøykasse som inneholder det man trenger for å drive programvareutvikling mot et bestemt
system. Rundt omkring på nettet finnes det mange ulike SDK-er for ulike systemer, og hvis vi ønsker å
lage programmer for en av disse må vi laste ned og installere SDK-en til systemet på datamaskinen
vår. En SDK vil inneholde de nødvendige programvarebibliotekene og utviklingsverktøyene som
trengs. Windows Phone SDK inneholder også emulatoren som vi snakket om i forrige avsnitt.
På nettsiden til Windows Phone Dev Center vil du finne to versjoner av SDK-et:
Windows Phone SDK 8.0 lar deg utvikle applikasjoner for mobiltelefoner med Windows
Phone 8 og enheter med Windows Phone 7.5.
Windows Phone SDK 7.1 lar deg utvikle applikasjoner for mobiltelefoner med Windows
Phone 7.5 og enheter med Windows Phone 7.0.
Vi kommer til å bruke siste versjon SDK 8.0 som støtter utvikling av applikasjoner for de nyeste
mobiltelefonene med Windows Phone 8.
Dersom du mot formodning har behov for å utvikle for mobiltelefoner med Windows Phone 7.0 eller
har maskinvare som kreves for SDK 8.0 må du velge SDK 7.1. Utviklingsprosessen vil være omtrent
tilsvarende, men du vil da ikke kunne utvikle applikasjoner for Windows Phone 8.
I første omgang skal vi ikke laste ned noe, bare gå inn og se hva som trengs av maskinvare og
programvare for å ta i bruk de ulike SDK-ene:
Windows Phone SDK 8.0 Windows Phone SDK 7.1
Operativsystem Windows 8 (64-bit, alle utgaver unntatt RT)
Windows Vista med SP2 og Windows 7 (32- og 64-bit, alle utgaver unntatt Starter Edition)
CPU 64-bit
Ledig diskplass 6.5 GB 4 GB
Minne 4 GB 3 GB
Krav til utviklingsmiljø Visual Studio 2012 Visual Studio 2010 SP1
Krav for å kjøre emulator Windows 8 Pro eller Enterprise Edition, samt en prosessor som støtter SLAT (Intel Core i3/i5/i7)
Grafikkort som takler DirectX10
Vi ser at et av kravene også sier noe om hvilket utviklingsmiljø som er støttet. For SDK 8.0 følger
Visual Studio 2012 Express med i pakken, men det går også an å bruke Visual Studio 2012
4
Professional, Premium eller Ultimate. Disse følger ikke med SDK-et, men krever egen installasjon i
som gjøres i forkant og at man har lisens.
Legg merke til at HiST (Høgskolen i Sør-Trøndelag) tilbyr studentlisenser både for Windows 8 og
Visual Studio 2012 Ultimate dersom du trenger dette i faget.
Om utviklingsmiljøet Visual Studio Du kjenner kanskje til Visual Studio fra før? Dette er Microsoft sitt IDE
(Integrated Development Environment) for å utvikle programvare
for .NET-plattformen. Utviklere kan bruke Visual Studio til å lage
programmer for Windows, såkalte Windows Forms, websider og
mobil programvare. Det er i så måte et utviklingsverktøy som strekker
seg langt utenfor det vi har behov for her. Hvis du brukt Visual Studio
til å lage programmer for Windows tidligere er dette god erfaring du
kan ta med videre når du skal lage Windows Phone applikasjoner!
De viktigste komponentene i Visual Studio er:
En teksteditor – som vi kan skrive koden vår i
En grafisk editor – som vi kan bruke til å tegne opp utseendet
En kompilator – som oversetter koden vår til maskinlesbar form
En debugger – som vi kan bruke til feilsøking av koden
Utviklingsmiljøet er det programmet som vi faktisk bruker for å lage alle applikasjonene våre. Dette
må installeres på den datamaskinen som du skal bruke til selve programmeringen. Vi har valgt å
bruke Visual Studio 2012 Ultimate i våre eksempler. Ultimate inneholder ingen av de begrensningene
som finnes i Express, men krever hele 10 GB med ledig diskplass (i tillegg til SDK-en). Du må selv
vurdere om du har behov for å installere hele denne pakken eller om du klarer deg med Express (som
følger med SDK).
Hvis du har nok diskplass anbefaler vi at du først installerer Visual Studio 2012 Ultimate og
deretter installerer SDK 8.0.
5
Installasjonen kan ta lang tid, men hvis alt har gått bra vil du til slutt kunne starte programmet og få
opp startsiden til Visual Studio 2012 som ser omtrent slik ut:
Figur 3. Startsiden til Visual Studio 2012 Ultimate
Som en kuriositet kan vi legge merke til at Metro-grensesnittet har gjort sitt inntog også her!
Om ulike språk og .NET-rammeverket Applikasjonsutvikling for Windows Phone er basert på .NET-rammeverket, og vi
kan velge mellom flere ulike programmeringsspråk. På Windows Phone 7.x er
det mulig å programmere enten i Visual Basic eller C#. For Windows Phone 8 er
det i tillegg mulig å programmere i C++. Alle disse tre programmeringsspråkene
bygger på .NET-rammeverket.
Det betyr at språket …
Tilbyr bruk av funksjonalitet fra det samme .NET-klassebiblioteket
Er CLS-kompatibelt (Common Language Specification) som betyr at det kompileres til et
felles språk som heter MSIL (Microsoft Intermediate Language). MSIL er maskinuavhengig
og uansett valgt språk vil det felles språket dermed bli likt ved kompilering.
Bruker CLR (Common Language Runtime) som blant annet eksekverer MSIL-koden ved
kjøring. Dette utføres ved hjelp av en JIT-kompiler (Just In Time).
6
Figur 4. Oversikt over .NET-rammeverket
Hvilket språk du velger kan være avhengig av hvilket programmeringsspråk du har programmert før.
En overveldende majoritet av applikasjonene vi finner i Windows Phone Marketplace og
kodeeksempler på nettet er skrevet i C#. Vi har derfor valgt å programmere C# i våre eksempler.
Dersom du trives bedre med Visual Basic må du gjerne bruke det i stedet.
Om programmering i C# C# er et objektorientert programmeringsspråk lansert av Microsoft i 2000. Hvis man har
programmert Java eller C++ før vil man kunne kjenne seg igjen i syntaksen til C#.
Vi antar at grunnleggende syntaks om C# er kjent:
Variabler, konstanter, datatyper
Implisitt og eksplisitt konvertering (casting)
Betingelser (conditions); If-setninger, Switch-Case
Løkker (loops); While-løkker, Do-While, For-løkker, Foreach-løkker
Hopp (jumps); Labels og Goto, Break, Continue
Unntakshåndtering (exceptions); Try-Catch-Finally
En- og flerdimensjonale matriser (arrays)
Hendelser (events)
Objektorientert programmering; Klasser, Egenskaper, Metoder, Konstruktører
Det vil bli gjort tilgjengelig bonusleksjoner i C#-programmering, som du kan lese på dersom du
trenger dette i faget.
Hello World Vi er nå klar for å lage vår aller første applikasjon for Windows Phone 8. Det er en god tradisjon når vi
begynner med et nytt programmeringsspråk eller et nytt SDK å starte med å lage et lite program som
skriver ut teksten «Hello World» til skjermen. Dette er vanligvis noe av det enkleste vi kan få til.
I Visual Studio 2012 velger vi File > New > Project (eller Ctrl-Shift-N) for å lage et nytt tomt prosjekt.
7
Figur 5. Dialogboksen New Project
Når du får opp dialogboksen for New Project oppretter du et nytt prosjekt ved å …
1. Velge Visual C# > Windows Phone i venstre meny
2. Velge Windows Phone App i oversikten
3. Skrive inn et navn på prosjektet, f.eks. HelloWorld, ved å fylle ut tekstfeltet «Name».
4. Klikke på knappen OK
Det vil da opprettes et nytt prosjekt med navnet HelloWorld. Hvis du vil endre plassering av
prosjektfilene dine kan du gjøre dette ved å endre «Location» før du klikker på knappen OK. Hvis ikke
vil disse havne på standard plassering:
C:\Users\BRUKERNAVN\Documents\Visual Studio 2012\Projects
Du vil da få opp en ny dialogboks New Windows Phone Application. Her må du ta stilling til om du
skal utvikle applikasjoner for Windows Phone 7.x eller Windows Phone 8. Velg Windows Phone OS
8.0 og klikk på knappen OK.
Figur 6. Dialogboksen New Windows Phone Application
8
Figur 7. Applikasjonen HelloWorld for Windows Phone 8 i Visual Studio 2012
Du har nå fått opprettet alle prosjektfilene i standardmappe eller egendefinert mappe. Det anbefales
at du ikke går inn i mappestrukturen og begynner å endre på noe der. Bruk Visual Studio 2012 til å
gjøre alle endringer.
Vi ser at vinduet til Visual Studio 2012 er inndelt i forskjellige deler.
De viktigste delene er …
Menylinjen (øverst)
MainPage.xaml - Grafisk layout (venstre side) og XAML-kode (høyre side) for applikasjonen
Solution Explorer – gir en oversikt over prosjektfilene
Properties – brukes til å endre egenskapene til komponentene
Error List – viser kompileringsfeil
XAML (eXtensible Application Markup Language) er et XML-basert språk laget av Microsoft. Det er
veldig mye brukt sammen med .NET-rammeverket for å definere grafiske elementer, datakoblinger,
hendelser og andre egenskaper. I forhold til CLR (som vi snakket om tidligere) er XAML-elementene
direkte koblet til CLR-objekter og XAML-attributter direkte koblet til CLR-egenskaper og hendelser
knyttet til disse objektene.
9
La oss starte med å analysere XAML-koden i filen MainPage.xaml. Denne opprettes automatisk når
man lager et nytt prosjekt.
<phone:PhoneApplicationPage x:Class="HelloWorld.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone" xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" FontFamily="{StaticResource PhoneFontFamilyNormal}" FontSize="{StaticResource PhoneFontSizeNormal}" Foreground="{StaticResource PhoneForegroundBrush}" SupportedOrientations="Portrait" Orientation="Portrait" shell:SystemTray.IsVisible="True"> <!--LayoutRoot is the root grid where all page content is placed--> <Grid x:Name="LayoutRoot" Background="Transparent"> <Grid.RowDefinitions> <RowDefinition Height="Auto"/> <RowDefinition Height="*"/> </Grid.RowDefinitions> <!-- LOCALIZATION NOTE: To localize the displayed strings copy their values to appropriately named keys in the app's neutral language resource file (AppResources.resx) then replace the hard-coded text value between the attributes' quotation marks with the binding clause whose path points to that string name. For example: Text="{Binding Path=LocalizedResources.ApplicationTitle, Source={StaticResource LocalizedStrings}}" This binding points to the template's string resource named "ApplicationTitle". Adding supported languages in the Project Properties tab will create a new resx file per language that can carry the translated values of your UI strings. The binding in these examples will cause the value of the attributes to be drawn from the .resx file that matches the CurrentUICulture of the app at run time. --> <!--TitlePanel contains the name of the application and page title--> <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28"> <TextBlock Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0"/> <TextBlock Text="page name" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/> </StackPanel> <!--ContentPanel - place additional content here--> <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> </Grid> <!--Uncomment to see an alignment grid to help ensure your controls are aligned on common boundaries. The image has a top margin of -32px to account for the System Tray. Set this to 0 (or remove the margin altogether) if the System Tray is hidden. Before shipping remove this XAML and the image itself.--> <!--<Image Source="/Assets/AlignmentGrid.png" VerticalAlignment="Top" Height="800" Width="480" Margin="0,-32,0,0" Grid.Row="0" Grid.RowSpan="2" IsHitTestVisible="False" />--> </Grid> </phone:PhoneApplicationPage>
Det er ikke meningen at du skal forstå all denne koden på første forsøk. Du ser kanskje at det tidlig i
koden defineres en struktur (Grid) med 2 rader. Den første raden brukes til tittelen på siden og den
andre brukes for innholdet på siden.
10
Litt lenger ned finner du en StackPanel som har to TextBlock inni seg. Den første inneholder tittelen
på selve applikasjonen, og den neste inneholder navnet på siden.
<!--TitlePanel contains the name of the application and page title--> <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28"> <TextBlock Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0"/> <TextBlock Text="page name" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/> </StackPanel>
Hvis du går litt videre finner du en annen Grid plassert litt lenger ned. Dette er ingenting annet enn
selve innholdet på siden. Du kan plassere hvilket som helst innhold her.
<!--ContentPanel - place additional content here--> <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> </Grid>
La oss starte å leke litt med denne koden. La oss endre navn på applikasjonen og tittel på siden. Gå til
TitlePanel og endre XAML-koden slik:
<!--TitlePanel contains the name of the application and page title--> <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28"> <TextBlock Text="Hello World App" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0"/> <TextBlock Text="Hovedside" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/> </StackPanel>
La oss kjøre kompilere, kjøre programmet og se hva som skjer.
I Visual Studio 2012 velger vi Debug > Start Debugging (eller F5) for å kompilere og kjøre koden.
Hvis du får feilmeldingen – “Deployment failed because no Windows Phone 8 phone was detected.
Make sure a phone is connected and powered on” – kan dette være fordi datamaskinen ikke har
maskinvarekravene som trengs for å kjøre den innebygde emulatoren. Hvis du husker tilbake til SDK-
kravene hadde emulatoren et tilleggskrav om CPU-støtte for SLAT (dvs. en Intel i3/i5/i7 prosessor).
Les i så fall neste avsnitt som beskriver hvordan du kan teste ut applikasjonen på din egen telefon i
stedet for emulatoren.
Hvis alt går greit vil du se at Windows Phone Emulator åpnes og at applikasjonen vår vises på
emulatoren. Tittel på applikasjonen og tittel på siden er oppdatert med «Hello World App» og
«Hovedside».
11
La oss legge til noe innhold også, f.eks. en TextBlock. Gå til ContentPanel og endre XAML-koden slik:
<!--ContentPanel - place additional content here--> <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> <TextBlock Text="Velkommen til min Hello World App"/> </Grid>
Hvis du kjører koden nå vil du se at også innholdet på siden er oppdatert med teksten «Velkommen
til min Hello World App».
12
Hvordan kan jeg teste på telefonen i stedet for emulator? I utgangspunktet kjører Windows Phone bare applikasjoner som har blitt godkjent og er gjort
tilgjengelig på Windows Phone Marketplace.
Det kan imidlertid være helt nødvendig å teste applikasjonen på en fysisk enhet og ikke en emulator.
For å kunne rulle ut dine applikasjoner til egen mobiltelefon må du derfor registrere at din telefon
brukes til utvikling.
Hvis du bare kobler til telefonen og forsøker kjøre applikasjonen til telefonen får du antageligvis en
av følgende feilmeldinger:
“Failed to connect to device as it is pin locked”
“Failed to connect to device as it is developer locked. For details on developer unlock, visit
http://go.microsoft.com/fwlink/?LinkId=195284”
Før du kan rulle ut en applikasjon til din egen enhet må du registrere telefonen. Dette krever en
utviklerkonto på Windows Phone Dev Center. Hver enkelt utviklerkonto tillater registering av inntil
tre enheter for applikasjonsutvikling. Etter at du har opprettet en utviklerkonto og registrert
telefonen kan du installere, kjøre og feilsøke (debug) usignerte applikasjoner på telefonen.
For å registrere din Windows Phone kan du bruke Windows Phone Developer Registration Tool som
følger med Windows Phone SDK.
For å bruke verktøyet trenger du:
En Microsoft-konto (tidligere kalt Windows Live ID)
En Windows Phone Dev Center konto
Zune-programvaren installert på datamaskinen. Du kan laste ned og installere Zune-
programvaren fra http://support.xbox.com/en-US/zune/software/download
For å registrere telefonen:
1. Skru på telefonen, lås opp skjermen, sjekk at tid og dato er korrekt
2. Koble telefonen til datamaskinen med USB-kabel. Pass på at Zune-programvaren starter opp.
3. Søk etter og start Windows Phone Developer Registration.
4. Følg trinn 1-3 og logg på med din Microsoft-konto.
13
Trinn 1
Figur 8. Windows Phone Developer Registration -
Registrer telefon
Trinn 2
Figur 9. Windows Phone Developer Registration -
Logg inn med Microsoft-konto
Trinn 3
Figur 10. Windows Phone Developer Registration -
Telefonen er registrert
Oppsummering I denne leksjonen har vi beskrevet operativsystemet Windows Phone for mobiltelefoner.
Forhåpentligvis har du nå klart å installere den nødvendige programvaren og laget din første
applikasjon for Windows Phone.