In this Article we going to Create Windows Phone 8.1 Mobile App
Just Follow these steps to create the mobile app
Run the Visual Studio Community Edition (StartMenu --> Visual Studio Community Edition). It will open Visual Studio Start Page as like below window, now Click on the New Project (highlighted area in the image)
It will show the popup window like the following Image.
Here we can select the template for our Project. I am choosing Blank Mobile app for my Project. To select Blank Mobile App. First select the Project type as show in by Orange arrow(Templates --> Visual C# --> Store Apps --> Windows Apps). Now select the Blank App as Shown by Blue Arrow in the Image.Give Name To Your Project.
Now it will load the Project Template and Some Files I will Explain Those in Single line
App.xaml.cs --> This is used to define application level Designs and common Methods applicable for Project are used here.
MainPage.xaml --> it is the default page created with project template.
Properties --> This is All Project Assembly details and Project level settings will be stored here.
References --> This is the place where we add external DLL's/other namespaces to our project.
Assets --> Here we will add Images and other resources.
Package.appxmanifest --> it is an XML file it contain the Details about the Package dependencies, Required capabilities, visual elements and other things about our application.
You can see these in Solution Explorer by pressing [CTRL + W, S]
Now Double click on the MainPage.xaml it will show the Following Window
Here
Orange Color Arrow --> XAML Code Editor view. Over page Designs and controls code is located here only.
Purple Color Ellipse -->It is a Drop Down contain all Controls we are defined in XAML page. By Default It will show the Control where our cursor is pointed and we can Navigate to any of the control in our page by clicking this Drop Down.
Green Color Ellipse --> It is also a Drop Down similar to above but it will the Attributes of the control where we selected in Purple Color Ellipse.
Orange Color Ellipse --> We can adjust the Zoom the Code by using this.
Blue Color Arrow --> It is Preview Pane view what ever changes we are made in XAML those will be shown here.
Blue Color Ellipse --> we Can Adjust the size of over preview pane by using this (Zoom IN/Zoom Out).
Just press [CTRL+W,X] or Navigate click View > Toolbox it will show the Toolbox
Now Drag and Drop the Button and TextBlock Control on to the Preview pane as show in following window. After drag and drop have you observe the Code pane, Code for Both TextBlock and Button control is Generated. Just see Both Blue and Orange Arrows.
Now Select the Button Control and Click on the properties window on the right side [CTRL+W, P] or Through View Menu.
Just define the Name For Your Controls Then only you can access Your Controls in Code Behind. You can give name in tow ways by directly typing along with Name attribute or In Properties window filling the value to Name Attribute.Just see the Ellipse's. You can change the Button Content also just see the small Orange ellipse.
Now just see the Following Image in By default in your Properties window wrench mark is selected
just select the thunder symbol it will show all events applicable for our button method, Now in click event i'm writing a method name called "myButton_Click" then it will generate the Code stub in Code behind.
Code stub generated by visual studio in Code behind as follows.
I already gave name to my TextBlock as "MyTextBlock" now i am going to modify the TextBlock content in Button Click Event. simply i wrote the text as shown in following image
Now i'm saving my application and i'm connected my windows mobile device to my PC
Now i'm starting the Debug as shown in the following image. if you have emulator you can change by clicking the small arrow next to the Device. Before Running app make sure your Phone is Unlocked otherwise it will throw error.
Now this app is successfully deployed into your mobile and it runs like as show in the below image
Now just click on the Button then your event will be fired by app and it will Display the text as you entered in C# code behind. Now can check this how event is firing by using the Breakpoints in C# Code behind.
No comments:
Post a Comment