Simple Timer App In Universal Window App

Prerequisites-

  • Visual Studio 2015

Now, let's get started with the steps, given below-

Step 1 - Create Windows Universal Project

Open Visual Studio 2015 and Click File -> New -> Project Option for New Universal app. 

New

Step 2 - Giving the Project Name

New Project Window will open. You can select an Installed -> Template -> Visual C# -> Windows -> Universal and select a Blank app (Universal Windows).

Type Project Name TimerApp and click OK button.

Blank App

Step 3 - Setting the platform Versions

Here, we choose the Target Version and Minimum Version for our Universal Windows Application and click OK button.

Versions

Step 4 - Choose Designer Window

Now, we go to the Solution Explorer and open MainPage.xaml for design.

 Solution Explorer

Step 5 - Designing the App

In MainPage.xaml designing page, drag the button control from the tool box. Go to Property Window and change the name as Startbutton and content to start Timer.

button

Next, drag the next button control from the tool box and go to the Property Window. Change the name as Stopbutton and content to stop Timer.

button

Last, drag the Textblock control from the tool box and go to the Property Window, change the name as Displaytext and content is kept as empty.

Textblock

Step 6 - Add the Coding

To add coding, double click on the Start Timer button and add the mentioned source code-

code

  1. private void Startbutton_Click(object sender, RoutedEventArgs e) {  
  2.     Timmer.Start();  
  3. }  
Double click on the Stop Timer button and add the mentioned source code-

code
  1. private void Stopbutton_Click(object sender, RoutedEventArgs e) {  
  2.     Displaytext.Text = Timmer.Elapsed.ToString();  
  3.     string milliseconds = Timmer.ElapsedMilliseconds.ToString();  
  4.     Timmer.Stop();  
  5. }  
Add the coding, given below-

code
  1. Stopwatch Timmer = new Stopwatch();   
Add the header file, given below-

header file
  1. using System.Diagnostics;   
Finally, the coding Window looks like -

coding window

Step 7 - Run the Application

Now, we are ready to run our project. Thus, click the Local Machine to run the Application.

Application

Output

Output

Output

Conclusion

I hope, you understood Simple Timer app in Universal Window and how to run it.