Windows Phone Hello World!

Introduction

Welcome to Windows Phone App Development. Those who are thinking to start Windows Phone App developing, but can't understand where to start, by thinking about them I'm starting Windows Phone Kick Start. I hope this is udeful to you. Programming language or software development whatever you say, everything starts with a "Hello world" application. Which means, you are declaring your existence to the world.

Creating your first project

At first, you need to open Visual Studio, then you can see the picture below in Figure 1.


                                                                  Figure 1

Select "New Project", choose "Blank App" and give it a name such as "HelloWorld" and hit "OK".


                                                                       Figure 2

Changing template

Now delete the "MainPage.xaml" as in Figure 3.


                                                                                 Figure 3

Add a "New Item" as in the following:


                                                                        Figure 4

And now what you will see is as in the image below. Select a "Basic Page" template and give it the name "MainPage.xaml".


                                                                           Figure 5

If you see a popup window, hit "Yes".


                                                                   Figure 6

Modifying title section

Now we will modify the "TitlePanel contains the name of the application and page title" section in "MainPage.xaml", like the code below in Listing 1.

<!-- Title Panel -->
<StackPanel Grid.Row="0" Margin="19,0,0,0">
          <TextBlock Text="MY FIRST APPLICATION" Style="{ThemeResource TitleTextBlockStyle}" Margin="0,12,0,0"/>
          <TextBlock Text="Hello world!" Margin="0,-6.5,0,26.5" Style="{ThemeResource HeaderTextBlockStyle}" CharacterSpacing="
          {ThemeResource PivotHeaderItemCharacterSpacing}"/>
</StackPanel>

                                                                                   Listing 1

In Listing 1 line numbers 3 and 5, we gave our application name "MY FIRST APPLICATION" and gave the title "Hello world!”.

Modifying the main grid

We will now modify our main grid. We will change the "ContentPanel – place additional content here" section as in the following in Listing 2.

<!--TODO: Content should be placed within the following grid-->
<Grid Grid.Row="1" x:Name="ContentRoot" Margin="19,9.5,19,0">
    <Button Content="Click Me"
            HorizontalAlignment="Left"
            VerticalAlignment="Top"
            Click="Button_Click_Me"
            Margin="10,0,0,0">
    </Button>

    <TextBox x:Name="TextBox_HelloWorld"
            HorizontalAlignment="Left"
            Height="40"
            Margin="10,75,0,0"
            TextWrapping="Wrap"
            VerticalAlignment="Top"
            Width="342">
    </TextBox>
</Grid>

                                                                                   Listing 2

Here in Listing 2, we take a button control, whose content is "Click Me", that will show in the surface of the button and give an event controller, that will handle the background work if someone clicks the button. Also we have taken a TextBox control, that will show the text for us and its name is "TextBox_HelloWorld". Our design will look like this in Figure 7.

                                                      
                                                                              Figure 7

Creating the button event handler

We have come to the end of our application. Until now, we have designed our app. Now we will do the code behind with C#. We will double-click the "MaingPage.xaml.cs" in the Solution Explorer and modify the code inside like this in Listing 3:

private void Button_Click_Me(object sender, RoutedEventArgs e)
{
      TextBox_HelloWorld.Text = "Rock the world!";
}

                                                                                    Listing 3

Here in Listing 3, line number 3, "TextBox_HelloWorld" is our TextBox's name. We will call it by name and it will show us the text "Rock the world!". So our TextBox's showing text will be "Rock the world!".

Run your application

Now we will run the application, for that reason you need to click the play button or press F5 as in the following,


                                                                           Figure 8

And the application will look like this in Figure 9.

                                             
                                                                        Figure 9

Now, if we click the "Click Me" button, it will show the text "Rock the world!" in the TextBox below.

Summary

We've successfully created our very own Windows Phone 8.1 application. I hope that, everyone can do this. So that's it for today, I will come back with some new topics. Until then, good bye. Have a nice day. Happy coding.

Read the original blog at: Windows Phone – Hello world!