How to Change the Datepicker style for Android

Question

I'm currently making a registration form, and one of the fields is for the users Date of Birth. I want to use datepicker, however I don't want the calendar layout as shown below:

I want the layout to look something like this so that way its easier to choose the year and month without having to scroll through everything:

However I do not know how to go about this, or what to put inside the styles.xml file. Any help would be greatly appreciated.

score 14 · Answer 1 · answered Sep 10 '16 at 20:06

14

Add this to style.xml

<style name="date_picker_theme" parent="@android:style/Widget.DatePicker">

And then you should apply style for your date picker like this:

<DatePicker
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/datePicker"
        style="@style/date_picker_theme" />

answered Sep 10 '16 at 20:06

Victor V.

328
2
7

Not working set programmatically? I've tried this but nothing changes :( – iflorit Feb 26 '17 at 11:03
I think, you can use DatePickerFragment and ContextThemeWrapper – Victor V. Feb 26 '17 at 13:07
Create new instance of theme wrapper ContextThemeWrapper(Context base, int themeResId) and when you create DatePickerDialog you should transfer this context constructor - DatePickerDialog(Context context). – Victor V. Feb 26 '17 at 13:13
Finally, my only working solution has been to create an AlertDialog and include a DatePicker as a view . Thanks! – iflorit Feb 27 '17 at 10:25

yogikalwar · Answer 2 · 2017-08-31T13:21:02.587

Create style with

<style name="DatePicker" parent="@android:style/Theme.Holo.Light">
    <item name="android:datePickerStyle">@android:style/Widget.DatePicker</item>
</style>

Then in custom fragment dialog xml

<DatePicker
    android:theme="@style/DatePicker"
    android:id="@+id/fragment_date_picker_control"
    android:datePickerMode="spinner"
    android:spinnersShown="true"
    android:calendarViewShown="false"
    android:layout_marginLeft="@dimen/margin_normal"
    android:layout_marginRight="@dimen/margin_normal"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal" />

Link : http://yogeshkalwar.blogspot.in/2017/08/custom-spinner-datepicker-supporting-n70.html

score 2 · Answer 3 · answered Jul 30 '17 at 16:40

To set the DatePicker style globally, add the following to style.xml, or adjust existing content:

<resources>
  <style name="AppTheme" parent="@style/Theme.AppCompat.Light">
    <item name="android:datePickerStyle">@style/MyDatePicker</item>
  </style>
  ...
</resources>

And define your customized DatePicker style, either in style.xml or a separate file, e.g.:

<resources>
  <style name="MyDatePicker" parent="@android:style/Widget.DatePicker">
    <item name="android:calendarViewShown">false</item>
    <item name="android:datePickerMode">spinner</item>
  </style>
</resources>

score 1 · Answer 4 · answered Apr 22 '19 at 02:52

It might be too late but you can set it programmatically like these.
Apply it inside your onClick listener.

        DatePickerDialog datePicker = new DatePickerDialog(
                this,
                android.R.style.Theme_Holo_Light_Dialog_MinWidth,
                datePickerListener,
                cal.get(Calendar.YEAR),
                cal.get(Calendar.MONTH),
                cal.get(Calendar.DAY_OF_MONTH));
        datePicker.setCancelable(false);
        datePicker.setTitle("Select the date");
        datePicker.show();

The android.R.style.Theme_Holo_Light_Dialog_MinWidth create style that you want.
Hope it helps someone.

score 0 · Answer 5 · answered Sep 14 '18 at 15:22

Above properties are of XML, if you want to set it programmatically you can you the below code but I haven't checked this code whether its working or not.

datepickerDialog_object.getDatePicker().setSpinnersShown(true);
datepickerDialog_object.getDatePicker().setCalendarViewShown(false);

score 0 · Answer 6 · answered Oct 29 '18 at 21:08

DatePickerDialog has a convenience method, where you set the desired layout.

public DatePickerDialog(@NonNull Context context, @StyleRes int themeResId,
        @Nullable OnDateSetListener listener, int year, int monthOfYear, int dayOfMonth) {
    this(context, themeResId, listener, null, year, monthOfYear, dayOfMonth);
}


public static final int MODE_SPINNER = 1;
public static final int MODE_CALENDAR = 2;

Passing 1 or 2 in themesResId does the trick.

Muhammad Haroon · Answer 7 · 2019-04-23T10:42:21.553

hi try this a simplest way...

public void datePicker(final Context context, final EditText editText, final String type) {
        Calendar calendar = Calendar.getInstance();
        final SimpleDateFormat dateFormatter = new SimpleDateFormat("yyyy-MM-dd", Locale.US);
        DatePickerDialog datePickerDialog = new DatePickerDialog(context, R.style.DialogTheme, new DatePickerDialog.OnDateSetListener() {

            public void onDateSet(android.widget.DatePicker view, int year, int monthOfYear, int dayOfMonth) {
                Calendar newDate = Calendar.getInstance();
                newDate.set(year, monthOfYear, dayOfMonth);
                newDate.set(year, monthOfYear, dayOfMonth);
                editText.setText(dateFormatter.format(newDate.getTime())

            }

        }, calendar.get(Calendar.YEAR), calendar.get(Calendar.MONTH), calendar.get(Calendar.DAY_OF_MONTH));
//        datePickerDialog.getDatePicker().setMinDate(System.currentTimeMillis() - 1000);
        datePickerDialog.show();
    }

android in style.xml add below line

 <style name="DialogTheme" parent="Theme.AppCompat.Light.Dialog">
        <item name="colorAccent">@color/AppDarkBlue</item>
    </style>

How to Change the Datepicker style for Android

7 Answers7

Linked