StopWatch Android App Project - Part 1

In this tutorial, we will make a simple Stopwatch Android App step by step and learn some basic stuff about android app development in the tutorial. The tutorial consist of 3 part as shown below:

Part 1: Stopwatch Android App project setup

Part 2: Stopwatch Android App UI

Part 3: Stopwatch Android App - Coding the features

The final app will look like this:

Introduction to Stopwatch App Project:

A stopwatch is a simple app that is used to record or measure time. It has mainly 4 main functions as shown below:

1. Start: To start the stopwatch time from the beginning or from the pause state.

2. Stop: To stop the stopwatch time and reset the time to zero.

3. Pause: To pause the stopwatch time

4. Lap: To record the laps of the stopwatch time (for example during the race we can use the lap feature to record the duration of different participants in the race)

Creating the project

1. Open Your Android Studio Click on "Start a new Android Studio project"(Learn how to set up Android Studio and create your first Android project)

2. Choose "Empty Activity" from the project template window and click Next

3. Enter the App Name, Package name, save location, language(Java/Kotlin language, we use Java for this tutorial ), and minimum SDK(we are using API 19: Android 4.4 (KitKat) )

4. Next click on Finish button after filling the above details

5. Now wait for the project to finish building.

Adding Required files

1. To make the UI of our app more attractive we will add CardView in our app to do so we have to implement the cardview library in our app, to do so follow the below steps.

   Go to Gradle Scripts -> build.gradle (Module: app) section and import below dependencies and click the "sync Now" shown at the top:

   dependencies {
       //Adding the card view library
       implementation 'androidx.cardview:cardview:1.0.0'
   }

   We are adding the cardview to make the UI of our app more attractive and give it a professional look and also we will learn more about card view and its properties in this whole tutorial.

2. Now we will add the basic colors which are required in our stopwatch app, to do so we follow the below step Go to app --> res -> values --> colors.xml, then add the below color in the colors.xml file:

   <?xml version = "1.0" encoding = "utf-8"?>
   <resources>
       <color name = "colorPrimary">#1989C8</color>
       <color name = "colorPrimaryDark">#1989C8</color>
       <color name = "colorAccent">#FF0D3D</color>
       <color name = "textColor">#0B1A37</color>
       <color name = "white">#ffffff</color>
   </resources>

3. Next, we will add some icons and images which are required in our application, simply download the below images and paste them into the app --> res --> drawable folder

With this, we are all set to start writing the actual code of our Stopwatch android App. In the next part we will create the complete UI for our Stopwatch android app and then will start working on the funcationality.