Create A Chronometer In Android App Using Android Studio

Introduction

In this article, you will learn how to develop a Chronometer Android application, using Android Studio.
 
Requirements
  • Android Studio version 2.1.3 
If you want create a Chronometer Android app, follow the steps given below.
 
Step 1

Now, open Android Studio and choose the File and New. Afterwards, choose NewProject.



Step 2

Here, you can create your Application name and choose where your project should be stored on the location and click NEXT button.



Now, we can select the version of Android which is like Target Android Devices.



Step 3

Here, we can Add the activity and click Next button.



Now, we can write the activity name and click Finish button.

 
 
Step 4

Now, open your project and you will go to activity_main.xml. Afterwards, you will build the design, which should be the toolbox, and if you want, some option like (Chronometer, button) with the help of the drag and drop method.



Now, we can see the Graphical User Interface design.

 
Step 5

Here, you build upon the design and write the .XML code.

Activity_mai.xml code 
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     xmlns:tools="http://schemas.android.com/tools"  
  4.     android:layout_width="match_parent"  
  5.     android:layout_height="match_parent"  
  6.     android:paddingBottom="@dimen/activity_vertical_margin"  
  7.     android:paddingLeft="@dimen/activity_horizontal_margin"  
  8.     android:paddingRight="@dimen/activity_horizontal_margin"  
  9.     android:paddingTop="@dimen/activity_vertical_margin"  
  10.     tools:context="xyz.rvconstructions.www.chronometerapp.MainActivity">  
  11.   
  12.   
  13.     <Chronometer  
  14.         android:layout_width="wrap_content"  
  15.         android:layout_height="wrap_content"  
  16.         android:id="@+id/chronometer"  
  17.         android:layout_alignParentTop="true"  
  18.         android:layout_centerHorizontal="true"  
  19.         android:background="#000000"  
  20.         android:gravity="center"  
  21.         android:padding="10dp"  
  22.         android:textColor="#1aff00"  
  23.         android:textStyle="bold"  
  24.         android:layout_marginTop="102dp" />  
  25.   
  26.     <Button  
  27.         android:layout_width="200dp"  
  28.         android:layout_height="wrap_content"  
  29.         android:text="START"  
  30.         android:id="@+id/strbutton"  
  31.         android:layout_below="@+id/chronometer"  
  32.         android:layout_marginTop="10dp"  
  33.         android:layout_centerHorizontal="true" />  
  34.   
  35.     <Button  
  36.         android:layout_width="200dp"  
  37.         android:layout_height="wrap_content"  
  38.         android:text="STOP"  
  39.         android:id="@+id/stpbutton"  
  40.         android:layout_below="@+id/strbutton"  
  41.         android:layout_marginTop="10dp"  
  42.         android:layout_centerHorizontal="true" />  
  43.   
  44.     <Button  
  45.         android:layout_width="200dp"  
  46.         android:layout_height="wrap_content"  
  47.         android:text="RESTART"  
  48.         android:id="@+id/rsbutton"  
  49.         android:layout_below="@+id/stpbutton"  
  50.         android:layout_marginTop="10dp"  
  51.         android:layout_centerHorizontal="true" />  
  52.   
  53.     <Button  
  54.         android:layout_width="200dp"  
  55.         android:layout_height="wrap_content"  
  56.         android:text="SETFORMAT"  
  57.         android:id="@+id/sfbutton"  
  58.         android:layout_below="@+id/rsbutton"  
  59.         android:layout_marginTop="10dp"  
  60.         android:layout_centerHorizontal="true" />  
  61.   
  62.     <Button  
  63.         android:layout_width="200dp"  
  64.         android:layout_height="wrap_content"  
  65.         android:text="CLEARFORMAT"  
  66.         android:id="@+id/clrbutton"  
  67.         android:layout_below="@+id/sfbutton"  
  68.         android:layout_marginTop="10dp"  
  69.         android:layout_centerHorizontal="true" />  
  70.   
  71.   
  72. </RelativeLayout>  
Step 6

Now, you will go to MainActivity.java page and build Java code.

First, you need to declare a file, which is an extension file.



Now, we can see MainActivity.java code.
 
  1. package xyz.rvconstructions.www.chronometerapp;  
  2.   
  3. import android.support.v7.app.AppCompatActivity;  
  4. import android.os.Bundle;  
  5. import android.os.SystemClock;  
  6. import android.view.Menu;  
  7. import android.view.MenuItem;  
  8. import android.view.View;  
  9. import android.widget.Button;  
  10. import android.widget.Chronometer;  
  11.   
  12. public class MainActivity extends AppCompatActivity {  
  13.   
  14.     Chronometer FirstChronometer;  
  15.     Button start, stop, restart, setFormat, clearFormat;  
  16.     @Override  
  17.     protected void onCreate(Bundle savedInstanceState) {  
  18.         super.onCreate(savedInstanceState);  
  19.         setContentView(R.layout.activity_main);  
  20.         FirstChronometer = (Chronometer) findViewById(R.id.chronometer);  
  21.         start = (Button) findViewById(R.id.strbutton);  
  22.         stop = (Button) findViewById(R.id.stpbutton);  
  23.         restart = (Button) findViewById(R.id.rsbutton);  
  24.         setFormat = (Button) findViewById(R.id.sfbutton);  
  25.         clearFormat = (Button) findViewById(R.id.clrbutton);  
  26.   
  27.         start.setOnClickListener(new View.OnClickListener() {  
  28.   
  29.             @Override  
  30.             public void onClick(View v) {  
  31.                  
  32.   
  33.                 FirstChronometer.start();  
  34.             }  
  35.         });  
  36.   
  37.          
  38.         stop.setOnClickListener(new View.OnClickListener() {  
  39.   
  40.             @Override  
  41.             public void onClick(View v) {  
  42.              
  43.                 FirstChronometer.stop();  
  44.             }  
  45.         });  
  46.   
  47.          
  48.         restart.setOnClickListener(new View.OnClickListener() {  
  49.   
  50.             @Override  
  51.             public void onClick(View v) {  
  52.                 
  53.   
  54.                 FirstChronometer.setBase(SystemClock.elapsedRealtime());  
  55.             }  
  56.         });  
  57.   
  58.         
  59.         setFormat.setOnClickListener(new View.OnClickListener() {  
  60.   
  61.             @Override  
  62.             public void onClick(View v) {  
  63.              
  64.   
  65.                 FirstChronometer.setFormat("Time (%s)");  
  66.             }  
  67.         });  
  68.   
  69.       
  70.         clearFormat.setOnClickListener(new View.OnClickListener() {  
  71.   
  72.             @Override  
  73.             public void onClick(View v) {  
  74.                
  75.                 FirstChronometer.setFormat(null);  
  76.             }  
  77.         });  
  78.   
  79.     }  
  80.   
  81. }  
Step 7

Here, you will go to run and select run app option.

 
 
Here, you will choose the Emulator or the devices, which is like Nokia Nokia _X.

 
Step 8

Here, you can see the output, as shown below.



Now, you will click the Start button.



Now, you will click Stop button.

 

Now, you will click Restart button.



Now, you will click Setformat button.



Now, you will click ClearFormat button.

Up Next
    Ebook Download
    View all
    Learn
    View all