I want to use digital date picker dialog and time picker dialog

Question

I want to use the digital date picker dialog and time picker dialog, I have written the code and my picker dialogs are working, but I want them in another format.

Currently, my time picker and date picker dialog are in this format:

I want them like this:

Here is my code:

public void onClick(View v) {
    int id = v.getId();
    switch (id) {
        case R.id.linearDate: {
            DatePickerDialog dp = new DatePickerDialog(this, new DatePickerDialog.OnDateSetListener() {
                @Override
                public void onDateSet(DatePicker view, int year, int monthOfYear, int dayOfMonth) {
                    mDatetext.setText(dayOfMonth + "-" + monthOfYear + "-" + year);
                }
            }, year, month, day);
            dp.show();
            break;
        }
        case R.id.linearTime: {
            TimePickerDialog Tp = new TimePickerDialog(this, new TimePickerDialog.OnTimeSetListener() {
                @Override
                public void onTimeSet(TimePicker view, int hourOfDay, int minute) {
                    mTimetext.setText(hourOfDay + ":" + minute);
                }
            }, hour, min, false);
            Tp.show();
            break;
        }
        case R.id.linearPlace: {
            startActivityForResult(new Intent(this, Location.class), CITY);
            break;
        }
    }
}

score 11 · Accepted Answer · edited Mar 31 '23 at 14:48

It's very simple and I got my code working. I need to add theme and it's done.

case R.id.linearDate: {
    DatePickerDialog dp = new DatePickerDialog(this,
            android.R.style.Theme_Holo_Light_Dialog,
            new DatePickerDialog.OnDateSetListener() {
                @Override
                public void onDateSet(DatePicker view, int year, int monthOfYear, int dayOfMonth) {
                    mDatetext.setText(dayOfMonth + "-" + monthOfYear + "-" + year);
                }
            },
            year, month, day);
    dp.getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
    dp.show();
    break;
}

case R.id.linearTime: {
    TimePickerDialog Tp = new TimePickerDialog(this,
            android.R.style.Theme_Holo_Light_Dialog,
            new TimePickerDialog.OnTimeSetListener() {
                @Override
                public void onTimeSet(TimePicker view, int hourOfDay, int minute) {
                    mTimetext.setText(hourOfDay + ":" + minute);
                }
            },
            hour, min, false);
    Tp.getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
    Tp.show();
    break;
}

score 6 · Answer 2 · answered Jun 03 '18 at 19:55

6

I figured out how to use the digital TimePicker without using a Dialog. They implemented a feature that allows you to simply set the timePickerMode attribute for the TimePicker in the layout resource file to either spinner or clock.

Source: https://gitlab.com/SaberMod/pa-android-frameworks-base/commit/3053b2fdcf7486f2e2f572f9b05ce65dacdd2b4c

answered Jun 03 '18 at 19:55

brenthompson2

391
3
9

1

I wish I could give this answer more than one upvote, as it's the easiest way to switch the design and you can actually see the picker before running the app! Just a heads-up: The buttons are displayed as black rectangles in the "design" view but they turn into actual buttons as soon as you run the app. It's weird they haven't added this `TimePicker` or the `DatePicker` to the palette yet, it currently only lists the `calendarView` (Android Studio 3.6). Btw, the `spinner` option is also available for the `DatePicker` and you can set `calendarViewShown` to "false" to only show the spinner. – Neph Mar 06 '20 at 10:54

score 1 · Answer 3 · answered Feb 15 '18 at 05:29

Although this is a late answer but there is a bug for TimePickerDialog theme in Nougat device. I was not able to find the solution until i find this fix and this may help someone searching for same.

Create a custom TimePickerDialogFixedNougatSpinner class that extends TimePickerDialog

and customize it as below:-

 public TimePickerDialogFixedNougatSpinner(Context context, int themeResId, OnTimeSetListener listener, int hourOfDay, int minute, boolean is24HourView) {

    super(context, themeResId, listener, hourOfDay, minute, is24HourView);
    fixSpinner(context, hourOfDay, minute, is24HourView);
}

private void fixSpinner(Context context, int hourOfDay, int minute, boolean is24HourView) {
    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) { // android:timePickerMode spinner and clock began in Lollipop
        try {
            // Get the theme's android:timePickerMode
            final int MODE_SPINNER = 2;
            Class<?> styleableClass = Class.forName("com.android.internal.R$styleable");
            Field timePickerStyleableField = styleableClass.getField("TimePicker");
            int[] timePickerStyleable = (int[]) timePickerStyleableField.get(null);
            final TypedArray a = context.obtainStyledAttributes(null, timePickerStyleable, android.R.attr.timePickerStyle, 0);
            Field timePickerModeStyleableField = styleableClass.getField("TimePicker_timePickerMode");
            int timePickerModeStyleable = timePickerModeStyleableField.getInt(null);
            final int mode = a.getInt(timePickerModeStyleable, MODE_SPINNER);
            a.recycle();
            if (mode == MODE_SPINNER) {
                TimePicker timePicker = (TimePicker) findField(TimePickerDialog.class, TimePicker.class, "mTimePicker").get(this);
                Class<?> delegateClass = Class.forName("android.widget.TimePicker$TimePickerDelegate");
                Field delegateField = findField(TimePicker.class, delegateClass, "mDelegate");
                Object delegate = delegateField.get(timePicker);
                Class<?> spinnerDelegateClass;
                if (Build.VERSION.SDK_INT != Build.VERSION_CODES.LOLLIPOP) {
                    spinnerDelegateClass = Class.forName("android.widget.TimePickerSpinnerDelegate");
                } else {
                    // TimePickerSpinnerDelegate was initially misnamed TimePickerClockDelegate in API 21!
                    spinnerDelegateClass = Class.forName("android.widget.TimePickerClockDelegate");
                }
                // In 7.0 Nougat for some reason the timePickerMode is ignored and the delegate is TimePickerClockDelegate
                if (delegate.getClass() != spinnerDelegateClass) {
                    delegateField.set(timePicker, null); // throw out the TimePickerClockDelegate!
                    timePicker.removeAllViews(); // remove the TimePickerClockDelegate views
                    Constructor spinnerDelegateConstructor = spinnerDelegateClass.getConstructor(TimePicker.class, Context.class, AttributeSet.class, int.class, int.class);
                    spinnerDelegateConstructor.setAccessible(true);
                    // Instantiate a TimePickerSpinnerDelegate
                    delegate = spinnerDelegateConstructor.newInstance(timePicker, context, null, android.R.attr.timePickerStyle, 0);
                    delegateField.set(timePicker, delegate); // set the TimePicker.mDelegate to the spinner delegate
                    // Set up the TimePicker again, with the TimePickerSpinnerDelegate
                    timePicker.setIs24HourView(is24HourView);
                    timePicker.setCurrentHour(hourOfDay);
                    timePicker.setCurrentMinute(minute);
                    timePicker.setOnTimeChangedListener(this);
                }
            }
        } catch (Exception e) {
            throw new RuntimeException(e);
        }
    }
}

For more reference follow this link :- https://gist.github.com/jeffdgr8/6bc5f990bf0c13a7334ce385d482af9f

Make sure to pass MODE_SPINNER = 2 in fixSpinner function

score 0 · Answer 4 · answered Mar 06 '16 at 17:16

You achieve this by having a dialog which extends android.support.v4.app.DialogFragment.

public class DatePickerFragment extends DialogFragment
      implements DatePickerDialog.OnDateSetListener {

    @Override public Dialog onCreateDialog(Bundle savedInstanceState) {
      // Use the current date as the default date in the picker
      final Calendar c = Calendar.getInstance();
      int year = c.get(Calendar.YEAR);
      int month = c.get(Calendar.MONTH);
      int day = c.get(Calendar.DAY_OF_MONTH);

      // Create a new instance of DatePickerDialog and return it
      return new DatePickerDialog(getActivity(), this, year, month, day);
    }

    public void onDateSet(DatePicker view, int year, int month, int day) {
     //action on date selection
    }
  }

Same goes for TimePicker

score 0 · Answer 5 · answered May 28 '18 at 06:26

Might be Helpfull

int mHour,mMinute;
TimePickerDialog Tp = new TimePickerDialog(getContext(),R.style.abirStyle, new TimePickerDialog.OnTimeSetListener() {
                    @Override
                    public void onTimeSet(TimePicker view, int hourOfDay, int minute) {
                        //mTimetext.setText(hourOfDay+ ":" +minute);

                    }
                },mHour,mMinute,false);
                Tp.getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
                Tp.show();

in Style

<style name="abirStyle" parent="@android:style/Theme.Holo.Light.Dialog.NoActionBar">
    <item name="android:textColor">@color/colorPrimary</item>
    <item name="android:background">@null</item>
    <item name="android:textColorPrimary">@color/colorPrimary</item>
</style>

score 0 · Answer 6 · answered Dec 14 '21 at 19:41

0

simply add this line to your TimePicker on layout file:

android:timePickerMode="spinner"

that's it.

answered Dec 14 '21 at 19:41

Mohsen Mashkour

66
7

I want to use digital date picker dialog and time picker dialog

6 Answers6