Android TimePicker upon clicking on edittext in Android Studio?

Please Share On:

Today, you are going to learn how to display 24 hours TimePicker upon clicking on edit text in Android Studio.

Let me talk little more about TimePicker before I jump into the coding section.

In Android, TimePicker is a widget for selecting the time of the day, in either AM/PM or 24-hour mode.

Here, I am going to show you 24-hour mode TimePicker.

Let’s begin in the coding section.

Step 1: XML File

Create your xml file with edittext. See an example below.

<EditText
    android:id="@+id/editTimePicker"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:autofillHints="@string/hint_pick_up_time"
    android:focusable="false"
    android:background="#FFFFFF"
    android:hint="@string/hint_pick_up_time"
    android:inputType="time"
    android:textColor="@color/black"
    android:textSize="15sp" />

Don’t forget to add the following code in your xml edittext. I have already added.

android:focusable="false"

Step 2: strings.xml

<resources>
<string name="hint_pick_up_time">hh/mm</string>
</resources>

Step 3: Jave Code

Edittext etTime = findViewById(R.id.editTimePicker);

Create your edittext onClickListerner. Add the below code to function edittext click listerner.

//Time Picker Dialog
        etTime.setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View v) {
                Calendar myCalendar = Calendar.getInstance();
                int hour = myCalendar.get(Calendar.HOUR_OF_DAY);
                int minute = myCalendar.get(Calendar.MINUTE);

                // time picker dialog
                TimePickerDialog mTimePicker;
                mTimePicker = new TimePickerDialog(Home.this, new TimePickerDialog.OnTimeSetListener() {
                    @Override
                    public void onTimeSet(TimePicker timePicker, int selectedHour, int selectedMinute) {
                        etTime.setText( selectedHour + ":" + selectedMinute);
                    }
                }, hour, minute, true); //Yes 24-hour time mode
                mTimePicker.setTitle("Select Time");
                mTimePicker.show();
            }
        });

Output:



AM/PM mode in clock

To display your clock mode into AM/PM 12-hour time, then change the below highlighted code from “true” to “false“.

//Time Picker Dialog
        etTime.setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View v) {
                // TODO Auto-generated method stub
                Calendar myCalendar = Calendar.getInstance();
                int hour = myCalendar.get(Calendar.HOUR_OF_DAY);
                int minute = myCalendar.get(Calendar.MINUTE);

                // time picker dialog
                TimePickerDialog mTimePicker;
                mTimePicker = new TimePickerDialog(Home.this, new TimePickerDialog.OnTimeSetListener() {
                    @Override
                    public void onTimeSet(TimePicker timePicker, int selectedHour, int selectedMinute) {
                        String time = selectedHour + ":" + selectedMinute;

                        SimpleDateFormat fmt = new SimpleDateFormat("HH:mm");
                        Date date = null;
                        try {
                            date = fmt.parse(time );
                        } catch (ParseException e) {

                            e.printStackTrace();
                        }

                        SimpleDateFormat fmtOut = new SimpleDateFormat("hh:mm aa");

                        assert date != null;
                        String formattedTime=fmtOut.format(date);

                        etTime.setText(formattedTime);
                    }
                }, hour, minute, false);//No 24 hour time
                mTimePicker.setTitle("Select Time");
                mTimePicker.show();

Output:




You may interest on the following topics:

Leave a Reply

Your email address will not be published. Required fields are marked *

Copyright @2023. All Right Reserved.


Social media & sharing icons powered by UltimatelySocial