Create Stopwatch Android App

Stopwatch App

To create a stopwatch app for android, we can use android Chronometer. Here we will create a simple Stopwatch with an START/STOP button and a PAUSE/RESUME button.

Step 1: Create a new project with name StopWatch and package name com.myexample.stopwatch. Select File/New/New Project. Fill the forms and click “Finish” button.

Step 2: Open res/layout/xml (or) main.xml and add following code. Here we will create a Chronometer and two Buttons in a LinearLayout.

 <?xml version="1.0" encoding="utf-8"?>
<LinearLayout
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:layout_width="match_parent"
	android:layout_height="match_parent"
	android:gravity="center"
	android:padding="10dp"
	android:orientation="vertical">

	<Chronometer
		android:layout_width="wrap_content"
		android:layout_height="wrap_content"
		android:textSize="50sp"
		android:textColor="#FB1F11"
		android:id="@+id/mainChronometer1"/>

	<Button
		android:layout_height="wrap_content"
		android:layout_width="wrap_content"
		android:text="START"
		android:id="@+id/mainButton1"/>

	<Button
		android:layout_height="wrap_content"
		android:layout_width="wrap_content"
		android:text="PAUSE"
		android:id="@+id/mainButton2"/>

</LinearLayout>

Step 3: Open app/src/main/java/package and open MainActivity.java. Add following code in it. Here when button1 is clicked, we will start the Chronometer, and when clicked again we will stop the Chronometer. And when button2 is clicked we will pause the Chronometer if it is running and resume it if it is paused.

package com.myexample.stopwatch;

import android.app.*;
import android.os.*;
import android.widget.*;
import android.view.*;

public class MainActivity extends Activity 
{
	// Declare Chronometer, and two buttons
	private Chronometer stopclock;
	private Button button1;
	private Button button2;
	
	// Define an int for different modes
	private int BASE = 0;
	private int RUNNING = 1;
	private int STOPPED = 2;
	private int PAUSED = 3;
	private int mode = BASE;
	// timeWhenStopped will be added to current base time when we resume the paused chronometer
	long timeWhenStopped = 0;
	
    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
		
		// Define the buttons and chronometer from the views in xml file
		stopclock = findViewById(R.id.mainChronometer1);
		button1 = findViewById(R.id.mainButton1);
		button2 = findViewById(R.id.mainButton2);
		
		// Make PAUSE button INVISIBLE
		button2.setVisibility(View.INVISIBLE);
		
		button1.setOnClickListener(new View.OnClickListener(){
			@Override
			public void onClick(View v){
				// If mode is BASE, start the chronometer and set mode to RUNNING
				if (mode == BASE){
					stopclock.setBase(SystemClock.elapsedRealtime());
					stopclock.start();
					mode = RUNNING;
					button1.setText("STOP");
					button2.setVisibility(View.VISIBLE);
					button2.setText("PAUSE");
				} else if (mode == RUNNING||mode == PAUSED){
					// If mode is RUNNING or PAUSED, stop the chronometer and set mode to STOPPED
					stopclock.stop();
					mode = STOPPED;
					button1.setText("RESET");
					button2.setVisibility(View.INVISIBLE);
				} else if (mode == STOPPED){
					// If mode is STOPPED, reset chronometer and set mode to BASE
					mode = BASE;
					stopclock.setBase(SystemClock.elapsedRealtime());
					timeWhenStopped = 0;
					button1.setText("START");
				}
			}
		});
		button2.setOnClickListener(new View.OnClickListener(){
			@Override
			public void onClick(View v){
				// If mode is RUNNING, stop the chronometer, set current chronometer reading as timeWhenStopped,
				// Set mode to PAUSED
				if (mode == RUNNING){
					timeWhenStopped = stopclock.getBase() - SystemClock.elapsedRealtime();
					stopclock.stop();
					mode = PAUSED;
					button2.setText("RESUME");
				} else if (mode == PAUSED){
					// If mode is PAUSED, add timeWhenStopped to current time and set it as base of chronometer
					// Start the chronometer and set mode to RUNNING
					stopclock.setBase(SystemClock.elapsedRealtime() + timeWhenStopped);
					stopclock.start();
					mode = RUNNING;
					button2.setText("PAUSE");
				}
			}
		});
		
    }
}

Output:
Now run the app. The Stopwatch App is ready. Initially it displays only START/STOP button. When started, it displays the PAUSE/RESUME button.

Leave a Reply