Introduksjon til applikasjonsutvikling for Windows · PDF fileDeling av innhold og mikrobetalinger med NFC ... Vi kan tenke på en SDK (Software Development Kit) ... utgaver unntatt

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

http://itfag.hist.no/

http://www.windowsphone.com/

http://www.microsoft.com/

http://www.android.com/

http://www.apple.com/iphone/ios/

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

http://www.nokia.com/

http://www.samsung.com/

http://www.htc.com/

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

http://dev.windowsphone.com/

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">  <Grid x:Name="LayoutRoot" Background="Transparent"> <Grid.RowDefinitions> <RowDefinition Height="Auto"/> <RowDefinition Height="*"/> </Grid.RowDefinitions>   <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>  <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> </Grid>   </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.

 <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.

 <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:

 <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:

 <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.

http://go.microsoft.com/fwlink/?LinkId=195284

http://support.xbox.com/en-US/zune/software/download

13

Trinn 1

Figur 8. Windows Phone Developer Registration -

Registrer telefon

Trinn 2


Logg inn med Microsoft-konto

Trinn 3


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.