Android Chronometer Widget Example Tutorial

How to use Chronometer inside android application to create simple start,stop, reset functionality stop watch.

Android Chronometer widget is used to create Chronometer with minutes and hours format. Chronometer can be easily accessible through start(), stop() and setBase(SystemClock.elapsedRealtime()). So here is the complete step by step tutorial for Android Chronometer Widget Example Tutorial.

android-project-download-code-button

Android Chronometer Widget Example Tutorial.

Code for MainActivity.java file.

 package com.chronometer_android_examples.com;

import android.app.Activity;
import android.os.Bundle;
import android.os.SystemClock;
import android.view.View;
import android.widget.Button;
import android.widget.Chronometer;

public class MainActivity extends Activity {

 Chronometer chronometer;
 Button start,stop,reset;
 @Override
 protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_main);
 
 chronometer = (Chronometer)findViewById(R.id.chronometer1);
 start = (Button)findViewById(R.id.button1);
 stop = (Button)findViewById(R.id.button2);
 reset = (Button)findViewById(R.id.button3);
 
 start.setOnClickListener(new View.OnClickListener() {
 
 @Override
 public void onClick(View v) {
 // TODO Auto-generated method stub
 
 chronometer.start();
 
 }
 });
 
 stop.setOnClickListener(new View.OnClickListener() {
 
 @Override
 public void onClick(View v) {
 // TODO Auto-generated method stub
 
 chronometer.stop();
 }
 });
 
 reset.setOnClickListener(new View.OnClickListener() {
 
 @Override
 public void onClick(View v) {
 // TODO Auto-generated method stub
 
 chronometer.setBase(SystemClock.elapsedRealtime());
 
 }
 });
 
 }
}

Code for activity_main.xml layout file.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:paddingBottom="@dimen/activity_vertical_margin"
 android:paddingLeft="@dimen/activity_horizontal_margin"
 android:paddingRight="@dimen/activity_horizontal_margin"
 android:paddingTop="@dimen/activity_vertical_margin"
 tools:context="com.chronometer_android_examples.com.MainActivity" >

 <Chronometer
 android:id="@+id/chronometer1"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_alignParentTop="true"
 android:layout_centerHorizontal="true"
 android:layout_marginTop="30dp"
 android:text="Chronometer"
 android:textSize="25dp" />

 <Button
 android:id="@+id/button1"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_below="@+id/chronometer1"
 android:layout_centerHorizontal="true"
 android:layout_marginTop="20dp"
 android:text="Start Chronometer" />

 <Button
 android:id="@+id/button2"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_below="@+id/button1"
 android:layout_centerHorizontal="true"
 android:layout_marginTop="20dp"
 android:text="Stop Chronometer" />

 <Button
 android:id="@+id/button3"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_below="@+id/button2"
 android:layout_centerHorizontal="true"
 android:layout_marginTop="20dp"
 android:text="Reset Chronometer" />

</RelativeLayout>

Screenshot:

Android Chronometer Widget Example Tutorial

Click here to download Android Chronometer Widget Example Tutorial project with source code.