How to create a Stopwatch App using Android Studio

In this article, an Android app is created to display a basic Stopwatch. The layout for Stopwatch includes:

• A TextView: showing how much time has passed
• Three Buttons:
  1. Start: To start the stopwatch
  2. Stop: To stop the stopwatch
  3. Reset: To reset the stopwatch to 00:00:00

Step-by-Step Implementation of Stopwatch Application in Android Studio

Step 1: Create a new project for the Stopwatch App

• Create a new Android project for an application named "Stopwatch" with a company domain of "geeksforgeeks.org", making the package name org.geeksforgeeks.stopwatch.
• The minimum SDK should be API 14 so it can run on almost all devices.
• An empty activity called "StopwatchActivity" and a layout called "activity_stopwatch" will be created.

Step 2: Android Manifest

<activity android:name=".StopwatchActivity"></activity>

Step 3: Using Resource Files

Add String resources We are going to use three String values in our stopwatch layout, one for the text value of each button. These values are String resources, so they need to be added to strings.xml.

Add the String values below to your version of strings.xml:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:padding="16dp"> <TextView android:id="@+id/tvMainTitle" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Welcome to MainActivity" android:textSize="18sp" android:layout_gravity="center_horizontal" android:paddingBottom="20dp"/> <Button android:id="@+id/btnGoToStopwatch" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Go to Stopwatch" android:layout_gravity="center_horizontal"/></LinearLayout>

activity_stopwatch.xml

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:background="#0F9D58" android:padding="16dp" tools:context=".MainActivity"> <TextView android:id="@+id/time_view" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:textAppearance="@android:style/TextAppearance.Large" android:textSize="56sp" /> <Button android:id="@+id/start_button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:layout_marginTop="20dp" android:onClick="onClickStart" android:text="@string/start" /> <Button android:id="@+id/stop_button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:layout_marginTop="8dp" android:onClick="onClickStop" android:text="@string/stop" /> <Button android:id="@+id/reset_button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:layout_marginTop="8dp" android:onClick="onClickReset" android:text="@string/reset" /></LinearLayout>

Step 4: How the activity code will work

The layout defines three buttons that we will use to control the stopwatch. Each button uses its onClick attribute to specify which method in the activity should run when the button is clicked. When the Start button is clicked, the onClickStart() method gets called, when the Stop button is clicked the onClickStop() method gets called, and when the Reset button is clicked the onClickReset() method gets called. We will use these methods to start, stop and reset the stopwatch.

We will update the stopwatch using a method we will create called runTimer(). The runTimer() method will run code every second to check whether the stopwatch is running, and, if it is, increment the number of seconds and display the number of seconds in the text view.

To help us with this, we will use two private variables to record the state of the stopwatch. We will use an int called seconds to track how many seconds have passed since the stopwatch started running, and a boolean called running to record whether the stopwatch is currently running.

We will start by writing the code for the buttons, and then we will look at the runTimer() method.

• Add code for the buttons When the user clicks on the Start button, we will set the running variable to true so that the stopwatch will start. When the user clicks on the Stop button, we will set running to false so that the stopwatch stops running. If the user clicks on the Reset button, we will set running to false and seconds to 0 so that the stopwatch is reset and stops running.
• The runTimer() method The next thing we need to do is to create the runTimer() method. This method will get a reference to the text view in the layout; format the contents of the seconds variable into hours, minutes, and seconds; and then display the results in the text view. If the running variable is set to true, it will increment the seconds variable.
• Handlers allow you to schedule code A Handler is an Android class you can use to schedule code that should be run at some point in the future. You can also use it to post code that needs to run on a different thread than the main Android thread. In our case, we are going to use a Handler to schedule the stopwatch code to run every second. To use the Handler, you wrap the code you wish to schedule in a Runnable object, and then use the Handle post() and postDelayed() methods to specify when you want the code to run.
• The post() method The post() method posts code that needs to be run as soon as possible(which is usually immediately). This method takes one parameter, an object of type Runnable. A Runnable object in Androidville is just like a Runnable in plain old Java: a job you want to run. You put the code you want to run in the Runnable's run() method, and the Handler will make sure the code is run as soon as possible.
• The postDelayed() method The postDelayed() method works in a similar way to the post() method except that you use it to post code that should be run in the future. The postDelayed() method takes two parameters: a Runnable and a long. The Runnable contains the code you want to run in its run() method, and the long specifies the number of milliseconds you wish to delay the code by. The code will run as soon as possible after the delay.

Below is the following code to StopwatchActivity.java:

Output: