Geeks With Blogs
Michael Crump Microsoft MVP, INETA Community Champion and XAML Advocate.

Thanks to Scott Gu for Tweeting a link to this page. I also wanted to thank Chris Alcock for mentioning this on the Morning Brew #688.

Feel free to subscribe to my feed for more articles like this one. You may also want to follow me on Twitter.

Today, the final version of the Visual Studio Tools for Windows Phone 7 was released. To get started, download the final bits here. You may also want to go ahead and download the Silverlight Tools for Windows Phone 7 and the Windows Phone 7 Training Kit for Developers. I’m going to walk you through setting up your environment for development and create an application using the new Silverlight Tools for Windows Phone 7. Note this is everything you will need to develop applications for Windows Phone 7. The best part is that everything is free to develop the application, but you will have to pay a fee to get it published to the Windows Marketplace.

It appears that most people want an ISO image of the tools. If so, then click here. The MSDN Documentation is located here.

Double click the file you just downloaded called vm_web.exe.You will see the following screen:

SNAGHTMLcfa180

Go ahead and hit Install Now and go make a cup of coffee…

SNAGHTMLd15aa1

SNAGHTMLf77f32

 

Hit the Run the Product Now. If you are not a .NET Developer then you probably don’t have Visual Studio 2010 installed. The good news is that they include the Express Edition of Visual Studio. If you have a “full version” of Visual Studio then it will work with that version. I have the Ultimate Edition on my machine for example, and it launched that version.

Lets go ahead and setup the Silverlight for Windows Phone Toolkit. Go to that site and download the recommended file.

image

Go ahead and double click on the file and you will see the screen below:

SNAGHTMLff73cd

Agree to the License agreement and hit Install.

image

SNAGHTML100ba10

Now that you have the tools and toolkit installed lets try it out.

Double click on whatever version of Visual Studio you have installed. Once it loads Visual Studio, select New Project…

image 

I’m assuming you want to create a basic Windows Phone application. So look for Silverlight for Windows Phone and click OK.

 

SNAGHTMLfb3c68

Now you should be inside the IDE. Go ahead and look for the Solution Explorer and right click references. Select Add References.

 

 

 

 

SNAGHTML10620ed

Click on Extensions and locate the file named Microsoft.Phone.Controls.Toolkit. Double click it and hit Close. Note: The toolkit installs to C:\Program Files (x86)\Microsoft SDKs\Windows Phone\v7.0\Toolkit\Sep10\Bin\

SNAGHTML1082de8

Lets go ahead and mock up a UI in Expression Blend. Right click the Project and select Open in Expression Blend. If you can’t find it then just close Visual Studio and Launch Expression Blend and Open the project you just created.

image

Select Assets and type in the word “Date”. Now you should see the new DatePicker under results. Drag that DatePicker to anywhere on the form and you should have the screen below.

image

We are going to add a button and give out controls a name. We are also going to give it a proper title and page name.

Click the button detailed below and drag it to your MainPage.xaml

image

 

Now look to your Objects and Timeline and keep expanding it until you get the following screen. Double click on the DatePicker and name it dtPicker, do the same thing for Button and name it btnClick.Your final screen will look like the example below:

image

Now click on “My application” and select Properties. Change the Text property to whatever you want.

image

Now we will do the same thing for page name.

image

Almost done, now we are just going to change the button text.

image

Let’s add a little bit of code behind. Click on the Date Selected button. Then properties, then look for the little lighting bolt. This is our events, click on the Click event and type btnClick_Click and then double click it.

image

Now type in the following code:

image

It’s time to launch our application now. Hit F5 and wait for the emulator to load. After the emulator has loaded then you will have no need to close it out when you are ready to build again.

SNAGHTML144347e

Click on the Date and you will see the following:

SNAGHTML14515e6

Select a date and hit the first X (We didn’t add our images). After you return to the screen hit the “Date Selected” button. You will see a MessageBox appear with the date the user selected.

image

Final Thoughts: The best thing about Windows Phone 7 is that if you know XAML or C#, then you can pick up and go. I walked you through the install from scratch and we built a sample application that should definitely get you started with developing for the phone. I hope that you will download the bits and get started developing Windows Phone 7 applications.

Posted on Thursday, September 16, 2010 3:12 PM WP7 | Back to top

Copyright © mbcrump | Powered by: GeeksWithBlogs.net