Mobiletuts + bestrijkt alle grote mobiele platforms - iPhone, Windows, Android en Blackberry. Vandaag gaan we kijken naar de ontwikkeling van Windows Phone 7. Windows Phone 7 is het nieuwste mobiele besturingssysteem van Microsoft. Het is een schone onderbreking van eerdere Windows Mobile-besturingssystemen, zoals WinMo 6.5, en biedt .NET-ontwikkelaars een kans om mee te doen aan de explosie van mobiele toepassingen die de afgelopen jaren is opgetreden. In deze zelfstudie leer je het Windows Phone 7-platform kennen, leer je de SDK installeren en demonstreer je de fundamentele code die nodig is om een eenvoudige applicatie te bouwen.
De ontwikkeling van Windows Mobile 7 gebeurt met behulp van het .NET-framework. Het .NET-framework is een softwareframework dat door Microsoft is gemaakt voor gebruik bij het maken van Windows-applicaties. Programmeurs schrijven toepassingen met behulp van een van de verschillende talen die worden ondersteund door het .NET-framework, zoals C #, en de toepassingen worden vervolgens uitgevoerd in een runtime-omgeving die de Common Language Runtime wordt genoemd. Voor Windows Phone 7 zijn er twee verschillende ontwikkelbenaderingen die u kunt nemen bij het maken van uw toepassing.
De eerste aanpak is om Silverlight voor Windows Phone te gebruiken. Silverlight was oorspronkelijk bedoeld als een manier voor ontwikkelaars om rijke internettoepassingen te maken. Het heeft de laatste jaren een sterke toename van de marktacceptatie gekend, voornamelijk dankzij het feit dat Netflix Silverlight gebruikt om video's te streamen en NBC Silverlight gebruikte voor de online uitzending van de Olympische spelen. Een Silverlight-toepassing combineert declaratieve markup (genaamd XAML) om de gebruikersinterface en code te construeren die zijn geschreven in een .NET-frameworktaal om het gedrag van een toepassing te beheren. Als u een gegevensgestuurde toepassing voor Windows Phone 7 ontwikkelt, moet u waarschijnlijk Silverlight gebruiken.
Als alternatief kunt u het XNA-framework gebruiken om uw Windows Phone 7-app te ontwikkelen. XNA is het raamwerk voor ontwikkeling van Microsoft en is de afgelopen jaren gebruikt voor het maken van zowel Windows- als Xbox 360-toepassingen. Als u een game voor Windows Phone 7 maakt, gebruikt u waarschijnlijk het XNA-framework. Het XNA-raamwerk is vrij krachtig, maar die kracht wordt geleverd met een aanzienlijke leercurve en langere ontwikkelingscycli.
Laten we beginnen door ervoor te zorgen dat uw ontwikkelomgeving correct is ingesteld. U moet Windows Vista of Windows 7 gebruiken en u moet een grafische kaart met DirectX 10 op uw computer geïnstalleerd hebben. Nadat u hebt gecontroleerd of u aan deze vereisten voldoet, gaat u naar http://bit.ly/9FXxQC om de ontwikkeltools te downloaden.
Scroll naar de onderkant van de pagina en download het bestand met de naam VM_BOOT \ vm_web.exe. Nadat het bestand is gedownload, dubbelklikt u erop om het volledige Windows Phone Developer Tools-pakket te installeren. Het pakket bevat:
Uw computer zal waarschijnlijk minstens één keer opnieuw opstarten terwijl de hulpprogramma's worden geïnstalleerd. Nadat u de ontwikkelaarstools op uw systeem hebt geïnstalleerd, bent u klaar om aan de slag te gaan.
De toepassing die u in deze zelfstudie maakt, is eenvoudig. Het toont een eenvoudige knop waarop u kunt tikken. Wanneer u erop tikt, roteert de knop rond de interface van de telefoon. We zullen deze applicatie ontwikkelen met Silverlight voor Windows Phone. Het duurt minder dan 10 minuten om te maken.
Open om te beginnen Microsoft Visual Studio 2010 Express voor Windows Phone. De eenvoudigste manier om het te vinden is om het Start-menu te openen en te beginnen met het typen van "Visual Studio." De toepassing zou moeten verschijnen in uw lijst met zoekresultaten, vergelijkbaar met het volgende:
Klik op het item Visual Studio 2010 om de ontwikkelomgeving te openen. Als dit de eerste keer is dat u de toepassing opent, kan het een paar minuten duren voordat Visual Studio een aantal instellingen voor u initialiseert.
Wanneer u Visual Studio opent, wordt u begroet met de startpagina van de toepassing. Er is veel inhoud op deze pagina, inclusief ontwikkeltips, recent nieuws en projectgerelateerde acties. Het is soms handig om hier door de inhoud te bladeren voor meer informatie over het platform, maar voor nu klikt u gewoon op de link "Nieuw project ..." in de linkerzijbalk.
Er verschijnt een dialoogvenster dat u begeleidt bij het maken van uw nieuwe project. Zorg ervoor dat het item "Windows Phone Application" is geselecteerd als uw projectsjabloon. Geef vervolgens uw project een naam. Voor deze zelfstudie beveel ik aan om uw project "Rotating_Button" te noemen. Bevestig tot slot dat het selectievakje "Directory voor oplossing maken" is geselecteerd. Dit helpt om uw ontwikkelingsinspanningen te organiseren. Je instellingen moeten overeenkomen met die van mij:
Klik op "OK" om uw nieuwe project aan te maken.
De sjabloon die u hebt geselecteerd, biedt u een volledig werkende toepassing. Om het in actie te zien, drukt u eenvoudig op CTRL + F5 om de applicatie te compileren en start u deze in de Windows Phone Emulator. De emulator wordt gestart met een enkele pagina met een titel van een toepassing en een paginatitel.
Die standaard gebruikersinterface doet gewoon niet voor onze applicatie, dus laten we een paar wijzigingen aanbrengen. Visual Studio had het bestand MainPage.xaml moeten openen om te bewerken toen u het project aanmaakte. Als dat niet het geval is, dubbelklikt u op de naam van het bestand in de Solution Explorer om deze te openen.
Je zou een gesplitst scherm moeten zien. Aan de ene kant van de ontwikkelomgeving kunt u zien hoe het huidige bestand eruit zal zien wanneer uw toepassing wordt uitgevoerd. Dit is ontwerpmodus. Aan de andere kant heb je de XAML-markering die verklaart hoe je interface eruit moet zien. Alle wijzigingen die u aanbrengt aan de ene kant, worden weergegeven aan de andere. Dit lijkt op een WYSIWYG HTML-editor zoals Dreamweaver.
Het eerste dat we willen doen, is alles binnen het lay-outraster verwijderen, zodat we onze eigen markeringen kunnen bieden. U zou een rastertag met de naam LayoutRoot moeten zien. Verwijder alles binnen deze tag. Je krijgt de volgende code:
De ontwerpmodusweergave zou op dit moment een leeg scherm moeten tonen.
U moet nu de gebruikersinterface voor uw toepassing toevoegen. Onze applicatie bestaat uit een enkele knop die rond een raster draait. Het raster is 2 × 2, dus laten we doorgaan en verklaren dat het lay-outraster twee rijen en twee kolommen moet hebben. Verander uw lay-outraster-opmaak naar het volgende:
Nadat u uw lay-outraster hebt gedefinieerd, wordt het tijd om de knop te maken die door uw gebruikers wordt afgeluisterd. U wilt dat de knop begint in het vak linksboven in het raster, dus u declareert dat deze wordt ingevoerd in rij 0 en kolom 0.
In XAML vertel je een element om zichzelf binnen een raster te plaatsen door het element te declareren en het vervolgens de juiste rij- en kolomindices toe te wijzen. Voeg binnen uw lay-outraster een knop toe met behulp van de volgende markering:
Deze opmaak zegt dat de knop zichzelf in kolom en rij 0 moet positioneren, zowel horizontaal als verticaal moet rekken in de rastercel die deze inneemt, en dat deze de tekst "Tap Me!" Moet hebben.
De gebruikersinterface van uw toepassing moet nu op het volgende lijken:
Op dit punt kunt u uw toepassing activeren en zien dat uw gebruikersinterface op zijn plaats is. Druk net als eerder op CTRL + F5 om uw toepassing in de Windows Phone-emulator te compileren en te starten. Als je alles goed hebt gedaan, zie je een knop in je emulator stevig genest in de linkerbovenhoek.
Je kunt op de knop tikken door erop te klikken met je muis, maar er gebeurt niets. We zullen dit vervolgens verhelpen door een gebeurtenishandelingscode toe te voegen.
Ga terug naar Visual Studio en controleer of MainPage.xaml is geopend in de ontwerp- / codemodus. U moet een kenmerk voor het afhandelen van gebeurtenissen toevoegen aan de knop die u hebt gemaakt. Wijzig de knopverklaring door een kenmerk ManipulationStarted toe te voegen. Zorg ervoor dat u Visual Studio toestaat om een gebeurtenisafhandelingsfunctie voor u te maken. Uw knopmarkering zou er nu als volgt uit moeten zien:
Open nu de code achter het bestand voor MainPage.xaml. Het heeft de naam MainPage.xaml.cs en je kunt het vinden in de Solution Explorer door op de pijl naast MainPage.xaml te klikken..
In MainPage.xaml.cs ziet u de gebeurtenishandler die Visual Studio heeft gemaakt. Visual Studio heeft het waarschijnlijk Button_ManipulationStarted genoemd en voor de toepassing van deze toepassing zou dat prima moeten zijn. Wijzig uw functieverklaring als volgt:
private void Button_ManipulationStarted (object afzender, ManipulationStartedEventArgs e) Knop b = afzender als knop; int col = Grid.GetColumn (b); int row = Grid.GetRow (b); if (col == row) Grid.SetColumn (b, ++ col% 2); else Grid.SetRow (b, ++ rij% 2);
Het eerste dat deze methode doet, is een nieuwe variabele van het type Button maken en deze een verwijzing toewijzen aan de afzendervariabele. Dit is belangrijk omdat Button is afgeleid van UIElement en de volgende paar bewerkingen vereisen een UIElement-object als parameter. Vervolgens krijgt de methode de huidige kolom en rij-index met behulp van een statische methode van de klasse Grid. Ten slotte maakt de methode gebruik van een eenvoudig algoritme om te bepalen waar de knop moet worden verplaatst en moet de rij- of kolomindex naargelang het geval worden gewijzigd. U weet dat als de rij- en kolomindexen hetzelfde zijn, de kolom moet worden gewijzigd. Als de rij- en kolomindices verschillend zijn, moet de rij worden gewijzigd. In beide gevallen gebruikt u een andere statische methode van de klasse Grid om de rij of kolom van de knop in te stellen. De juiste index wordt bepaald met behulp van enkele eenvoudige wiskunde.
Op dit moment zijn we klaar met de voorbeeldtoepassing. Druk op CTRL + F5 om uw toepassing te compileren en te starten en probeer vervolgens op uw knop te klikken. Je ziet het elke keer dat je klikt rond het raster bewegen. Probeer de knoppen van de emulator te gebruiken om de oriëntatie van de telefoon te veranderen en je zult zien dat de applicatie zich zonder problemen aanpast.
We hebben het zojuist gehad over het onderwerp ontwikkeling van Windows Phone 7 in deze tutorial. Hoewel u nu bekend bent met de basisprincipes van het maken van een toepassing met Silverlight, wilt u waarschijnlijk meer informatie over de ontwikkeling van XAML, Silverlight, XNA en Windows Phone 7 in het algemeen. Gelukkig zijn er al verschillende bronnen waar je terecht kunt: