Windows Phone App in Visual Studio 2010
Microsoft windows phone is the rising operation system for smart phones. Day by day it is becoming popular. We can developed any type of apps for windows phone by using visual studio. This article describes Step by step instruction to create simple windows phone apps or how to create a basic WP app using Visual Studio 2010.Summary of the article:
- Development Tools for Windows Phone App
- Types of Windows Phone App
- Project Creation
- UI Design
- Write the Codes
- Run Windows Phone App in the Emulator
We will build a sample Silverlight application for windows phone OS 7.1 in visual studio 2010, which will takes a string as input and will displayed it as output. Before start we can learn some basic knowledge about windows phone.
Development Tools for Windows Phone App
In order to developed or create windows phone application we need to install the following tools in our computer.
In order to developed or create windows phone application we need to install the following tools in our computer.
- Microsoft Visual Studio 2010
- Windows Phone SDK -We can download it from the windows phone site. After installation Windows Phone emulator is available to test the apps
Types of Windows Phone App
The Windows Phone application platform provides two frameworks to developed applications:
The Windows Phone application platform provides two frameworks to developed applications:
- Silverlight-it supports event-driven, XAML-based application development
- XNA-it supports loop-based games
We can also develop a single application by using both Silverlight and XNA.
Project Creation
Create a Silverlight Project for windows phone. The steps to Create a windows phone Project:
Step-1
If Microsoft Visual Studio installed, Start it and select New Project form the file menu. In the New Project dialog box:
Create a Silverlight Project for windows phone. The steps to Create a windows phone Project:
Step-1
If Microsoft Visual Studio installed, Start it and select New Project form the file menu. In the New Project dialog box:
- Open the Visual C# templates and then select Silverlight for Windows Phone templates
- Select the template Windows Phone Application
- Set the project name to MyApps
- Set the disk location to something like C:\TestProject
- Click OK
Step 2
In the New Windows Phone Application dialog box, select Windows Phone OS 7.1 for the Target Windows Phone OS Version.
In the New Windows Phone Application dialog box, select Windows Phone OS 7.1 for the Target Windows Phone OS Version.
- For Windows Phone OS 7.0 the apps can only run on Windows Phone 7.0 devices.
- For Windows Phone OS 7.1, the apps can run on both Windows Phone OS 7.0 and Windows Phone 7.1 devices.
Step 3
The new project is now created and opens in Visual Studio. The designer displays “MainPage.xaml”, which contains the user interface of the app. The main window contains the following items:
The new project is now created and opens in Visual Studio. The designer displays “MainPage.xaml”, which contains the user interface of the app. The main window contains the following items:
- The middle pane is the XAML markup that defines the user interface for the page
- The left pane is the skin that shows the output of the XAML markup
- The right pane is the Solution Explorer, which lists the files in the project
UI Design
Next step is to create the UI for the apps. We will design the UI as like the bellow image. At first include a TextBlock, TextBox control from the Toolbox. Clare their Text and set the alignment center from the Properties window. Then include a Button and set its Content “Show”. Change the name of the page as “Home”. For this select the page name “TextBlock” control and Change the Text property to “Home” to rename the app’s main page.
Next step is to create the UI for the apps. We will design the UI as like the bellow image. At first include a TextBlock, TextBox control from the Toolbox. Clare their Text and set the alignment center from the Properties window. Then include a Button and set its Content “Show”. Change the name of the page as “Home”. For this select the page name “TextBlock” control and Change the Text property to “Home” to rename the app’s main page.
Write the Codes
Double click on Button1 and write the following code in “MainPage.xaml.cs” page.
Double click on Button1 and write the following code in “MainPage.xaml.cs” page.
textBlock1.Text = textBox1.Text;
Save all the pages. Our first windows phone apps is now finished.
Run Windows Phone App in the Emulator
The steps to run a windows phone app is:
Build the solution by selecting the menu BUILD -> Build Solution.
If any errors occur, they’re listed in the Error List window. If it’s not already open, we can open the Error List window by selecting the menu VIEW -> Error List. If there are errors, need to review the above steps, fix up them, and then build the solution again.
The steps to run a windows phone app is:
Build the solution by selecting the menu BUILD -> Build Solution.
If any errors occur, they’re listed in the Error List window. If it’s not already open, we can open the Error List window by selecting the menu VIEW -> Error List. If there are errors, need to review the above steps, fix up them, and then build the solution again.
We need to ensure that, On the Standard toolbar the deployment target for the app is set to Windows Phone Emulator.
Run the app by pressing F5 or by selecting the menu DEBUG -> Start Debugging. This opens the emulator and launches the app. First time it might take few seconds to start and launch the app.
Write some text and click on Show button. Text will be displayed in the “TextBlock” control.
By pressing one of the rotation controls on the emulator toolbar we can change the view mode of the apps (landscape, portrait).
We can stop debugging by selecting the menu DEBUG -> Stop Debugging. It’s better to leave the emulator running when we end a debugging session. Because the next time the app will start more quickly.
In this way we can developed our first Windows Phone app.
No comments