Phone_81_Development_for_Absolute_Beginners

To accommodate these desired features, I’ll first clear out the bill amount TextBox when it gets focus like so:

private void amountTextBox_GotFocus(object sender, RoutedEventArgs e)

{

billAmountTextBox.Text = "";

}

Now, when I tap in the TextBox, the previous value is cleared out. Perfect!

Windows Phone 8.1 Development for Absolute Beginners – Page 100

To accommodate the desire for the value to be properly formatted when the user exits the bill amount TextBox, I’ll retrieve the BillAmount property counting on the fact that this property is properly formatted from calls to the Tip class’ CalculateTip() method:

private void amountTextBox_LostFocus(object sender, RoutedEventArgs e)

{

billAmountTextBox.Text = tip.BillAmount;

}

Now, when I leave the bill amount TextBox, the value I typed will be nicely formatted as dollars and cents:

Windows Phone 8.1 Development for Absolute Beginners – Page 101

Admittedly, if this were a complete app, I would want to add custom tiles, a splash screen, etc.

We’ll do that when we build our next app several lessons from now.

In the next lesson, we'll rebuild this app as a Universal app that can be submitted to both the Phone and Windows 8 stores.

Windows Phone 8.1 Development for Absolute Beginners – Page 102

Lesson 10: Exercise: Tip Calculator as a Universal App

In this lesson we're going to take the work that we did in the previous lesson and translate it into a Universal App, which will allow us to distribute our Tip Calculator to both the phone and to the Windows 8.1 App Store for inclusion there.

To begin, (1) In the New Project template, select Templates > Visual C# > Store Apps > Universal Apps. (2) Select the Blank App (Universal Apps) project template.

Name the project “TipCalculatorUniversal” and click the OK button to close the New Project dialog and create the new app.

Once the new app is created, the Solution Explorer reveals three projects all prefixed with the solution name, then a dot, then:

(1)Windows

(2)WindowsPhone

(3)Shared

Windows Phone 8.1 Development for Absolute Beginners – Page 103

Basically, the Windows and the Windows phone projects should only be different in so much that they have similar but different XAML to lay out based on screen size, for their specific differences. Then, anything that we can share should be added to this Shared project. So for our Tip Calculator app, this architecture is very straight forward. We'll put our Tip.cs class in the shared project and then reference it from both our WindowsPhone project and the Windows project.

To begin, let's start with our shared project. I'm going to right-click the shared project and select Add > New Item …:

In the Add New Item dialog:

Windows Phone 8.1 Development for Absolute Beginners – Page 104

(1)Choose Class

(2)Name it: Tip.cs

(3)Click Add

I’ll copy and paste the work that I did in the previous lesson so we have exact duplicate. No changes required here.

Windows Phone 8.1 Development for Absolute Beginners – Page 105

Now that Tip class will be available to both my Windows and Windows phone projects.

Next, we’ll work on the Windows Phone project since we've already created that once. This should be just a matter of going to my MainPage.xaml and copying and pasting all the XAML that I created previously. After copying and pasting, I have the following result:

Windows Phone 8.1 Development for Absolute Beginners – Page 106

Next, I’ll re-create the event handler method stubs by selecting each one in XAML and press the F12 keyboard command. When finished, the MainPage.xaml.cs should look similar to this:

In my MainPage.xaml.cs, I’ll add the PerformCalculation() helper method (and that should be the same as what I created in the previous lesson).

Windows Phone 8.1 Development for Absolute Beginners – Page 107

Near the top, we’ll need to create a private field that will hold a reference to the Tip class:

In the RadioButton_Click event handler, I want to call the performCalculation() helper method.

Next:

(1)In amountTextBox_LostFocus, I want to make sure to set the billAmountTextBox.Text to the tip.BillAmount to make sure it is formatted correctly.

(2)In billAmountTextBox_TextChanged, I want to performCalculation() to make sure we’re updating the new values.

(3)In billAmountTextBox_GotFocus, I want to clear the contents when the TextBox control receives focus so that I can enter fresh values.

Windows Phone 8.1 Development for Absolute Beginners – Page 108

It’s time to test the app in the Emulator.

Important: Currently the Windows project is selected as the Start Up Project. You can see that because it is in bold in the Solution Explorer. To change the Start Project that will execute when we start debugging to the Windows Phone project, right-click the TipCalculatorUniversal.WindowsPhone project in the solution explorer and select "Set as Start Up Project". As you can see, the project name is in a bold font as it appears inside of the Solution Explorer.

Select the start debugging button to run the app in the Emulator. It should work exactly as it did in the previous lesson.

Now, let's go ahead and create the Windows version of the app.

First, I’ll reset the TipCalculatorUniversal.Windows project as the Start Up Project using the technique I just demonstrated.

Next, I’ll open the MainPage.xaml of the Windows project. You can see we get more of the

Microsoft Surface preview in the XAML Editor.

Windows Phone 8.1 Development for Absolute Beginners – Page 109