Use Date Picker & Time Picker in Android

In Android, we can use “android.widget.DatePicker” class to render a date picker component which allows us to select day, month and year in a pre-defined user interface. In the same fashion, we can use “android.widget.TimePicker” class to render a time picker component which allows us to select hours and minutes in 24 hours format in a pre-defined user interface. The date and time may be selected using either a scrolling wheel or simply by typing text in the concerned field.

1. Activity_main.xml

Open the activity_main.xml file and add date picker, time picker as well as a button.
File : res/layout/main.xml

<ScrollView  xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools"

            android:id="@+id/scrollView1"

            android:layout_width="match_parent"

            android:layout_height="wrap_content" >



<LinearLayout android:layout_width="fill_parent"

    android:layout_height="fill_parent"

    android:orientation="vertical" >

   
<LinearLayout android:id="@+id/banner"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:gravity="center"

        android:orientation="vertical" >

   
</LinearLayout>

   
<LinearLayout android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:weightSum="1.0"

        android:orientation="vertical" >




<TextView android:id="@+id/textView2"

         android:layout_width="wrap_content"

          android:layout_height="0sp"

          android:layout_weight="0.1"

          android:text="Select Date"

          android:textColor="#ffffff"

          android:textSize="15sp" />

</LinearLayout>


<LinearLayout android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:gravity="center"

        android:orientation="vertical"

        android:weightSum="1" >

       
<DatePicker android:id="@+id/datePicker1"

            android:layout_width="wrap_content"

            android:layout_weight="0.5"

            android:layout_height="0sp" />

   
</LinearLayout>


   
<LinearLayout android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:weightSum="1.0"

        android:orientation="vertical" >

       
<TextView android:id="@+id/textView3"

         android:layout_width="wrap_content"

         android:layout_height="0sp"

         android:layout_weight="0.1"

          android:text="Select Time"

          android:textColor="#ffffff"

          android:textSize="15sp" />




</LinearLayout>




<LinearLayout android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:gravity="center"

        android:orientation="vertical"

        android:weightSum="1" >




<TimePicker android:id="@+id/timePicker1"

            android:layout_width="wrap_content"

            android:layout_weight="0.5"

            android:layout_height="0sp" />

   
</LinearLayout>

   
<LinearLayout android:layout_width="match_parent"

        android:layout_height="wrap_content" 

        android:weightSum="1">

       
<TextView android:id="@+id/notificationTextView"

         android:layout_width="0sp"

          android:layout_weight="1"

          android:layout_height="wrap_content"

          android:textAppearance="?android:attr/textAppearanceLarge" />

   
</LinearLayout>

   
<LinearLayout android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:gravity="center"

        android:orientation="horizontal"

        android:weightSum="1" >

       
<Button android:id="@+id/btnStartService"

        android:layout_width="0sp"

        android:layout_weight="0.5"

        android:layout_height="wrap_content"

        android:onClick="startService"

        android:text="Set" />

 
</LinearLayout>




<LinearLayout android:layout_width="match_parent"

              android:layout_height="wrap_content"

              android:weightSum="1" >




<TextView android:id="@+id/previousValueTextView"

          android:layout_width="0sp"

          android:layout_height="wrap_content"

          android:layout_weight="1"

          android:textAppearance="?android:attr/textAppearanceLarge"/>


</LinearLayout>

   
</LinearLayout>

</ScrollView>

2. Java Code

Open the MainActivity.java file and write the following code. It shall display a toast message showing the selected date and time.
File : MainActivity.java

package com.endeavour.datetimepicker;



import java.util.Calendar;

import android.app.Activity;

import android.os.Bundle;

import android.view.View;

import android.widget.DatePicker;

import android.widget.EditText;

import android.widget.TextView;
import android.widget.TimePicker;


import android.widget.Toast;


 


public class MainActivity extends Activity {



       EditText hoursEditText, minsEditText;

       String hoursSring, minsString;

       String selectedYearString, selectedMonthString, selectedDateString;

       String currectYearString, currentMonthString, currentDateString;

       int selectedYear, selectedMonth, selectedDate;

       int selectedHour, selectedMin;

       DatePicker datePicker;

       TimePicker timePicker;

       TextView previousValueTextview;

       TextView textView;



       @Override

       protected void onCreate(Bundle savedInstanceState)

{

              super.onCreate(savedInstanceState);

              setContentView(R.layout.activity_main);

              datePicker = (DatePicker) findViewById(R.id.datePicker1);

              timePicker = (TimePicker) findViewById(R.id.timePicker1);

              timePicker.setIs24HourView(true);

              Calendar calendar = Calendar.getInstance();

              int h = calendar.get(Calendar.HOUR_OF_DAY);

              timePicker.setCurrentHour(h);

              textView = (TextView) findViewById(R.id.notificationTextView);

              previousValueTextview = (TextView) findViewById(R.id.previousValueTextView);

              }



       public void startService(View view){

              selectedYear = datePicker.getYear();

              selectedMonth = datePicker.getMonth() + 1;

              selectedDate = datePicker.getDayOfMonth();

              selectedHour = timePicker.getCurrentHour();

              selectedMin = timePicker.getCurrentMinute();

              selectedYearString = Integer.toString(selectedYear);

              selectedMonthString = Integer.toString(selectedMonth);

              selectedDateString = Integer.toString(selectedDate);

              hoursSring = Integer.toString(selectedHour);

              minsString = Integer.toString(selectedMin);

              String finalMessage = "You have selected the date & time as "+selectedDateString+"/"+selectedMonth+"/"+selectedYear+" "+selectedHour+":"+selectedMin;

              Toast.makeText(this, finalMessage, Toast.LENGTH_LONG).show();

       }

}

3. Output

The following output shall be displayed.

i. Date and Time Picker being displayed

ii. When the Set button is pressed