Setting header colour in the new Material DatePicker

Question

So am trying to change the colour of the header of my DatePicker. It doesn't appear to as easy as first though. You can do it in the XML like so:

android:headerBackground="@color/myColor" />

However there doesn't seem to be a way to be able to do this in code. The usual setters don't seem to be apparent (i.e datePicker.setHeaderBackground).

Any ideas?

Answer 1

Create custom datepicker dialog. See this link once.

You can use setAccentColor() for change color of header in this sample. use it like dpd.setAccentColor(Color.BLUE);. If you don't want this color to buttons, just remove below lines from 'DatePickerDialog' class.

okButton.setTextColor(mAccentColor);
cancelButton.setTextColor(mAccentColor);

Answer 2

Here is the method to change header background of DatePickerDialog:

private void setDatePickerHeaderBackgroundColor(DatePickerDialog dpd, int color) {
    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
        try {
            Field mDatePickerField;
            mDatePickerField = DatePickerDialog.class.getDeclaredField("mDatePicker");
            mDatePickerField.setAccessible(true);
            final DatePicker mDatePicker = (DatePicker) mDatePickerField.get(dpd);

            int headerId = Resources.getSystem().getIdentifier("day_picker_selector_layout", "id", "android");
            final View header = mDatePicker.findViewById(headerId);
            header.setBackgroundColor(color);
        } catch (NoSuchFieldException e) {
            e.printStackTrace();
        } catch (IllegalAccessException e) {
            e.printStackTrace();
        }
    }
}

As you can see I'm using java reflection for Lollipop and above to get header view.

Usage:

    DatePickerDialog dpd = new DatePickerDialog(this, this, 2016, 0, 11);
    setDatePickerHeaderBackgroundColor(dpd, getResources().getColor(android.R.color.black));
    dpd.show();

As a result we have:

EDIT:

In case you just want to set header background of DatePicker, that you've created in xml, forgot about java reflection, just use these lines to get it working:

     DatePicker mDatePicker = (DatePicker) findViewById(R.id.date_picker);
     if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
         int headerId = Resources.getSystem().getIdentifier("day_picker_selector_layout", "id", "android");
         final View header = mDatePicker.findViewById(headerId);
         header.setBackgroundColor(getResources().getColor(android.R.color.black));
     }

Answer 3

create this style :

<style name="MyDatePickerStyle" parent="@android:style/Widget.Material.Light.DatePicker">
    <item name="android:headerBackground">@color/chosen_header_bg_color</item>
</style

and add this style to your dialog theme :

<style name="MyDatePickerDialogTheme" parent="android:Theme.Material.Light.Dialog">
    <item name="android:datePickerStyle">@style/MyDatePickerStyle</item>
</style>

and add this dialog to your app theme :

<style name="MyDatePickerStyle" parent="@android:style/Widget.Material.Light.DatePicker">
    <item name="android:headerBackground">@color/chosen_header_bg_color</item>
</style>

it is very wll explained here : Change Datepicker dialog color for Android 5.0

and this did work for me.

Answer 4

You need to override your DatePickerStyle, follow the steps,

1) Override DatePickerDialogTheme inside your app's base theme:

<style name="AppBaseTheme" parent="android:Theme.Material.Light">
    ....
    <item name="android:datePickerDialogTheme">@style/CustomDatePickerDialogTheme</item>
</style>

2) Define CustomDatePickerDialogTheme

<style name="CustomDatePickerDialogTheme" parent="android:Theme.Material.Light.Dialog">
    <item name="android:datePickerStyle">@style/CustomDatePickerStyle</item>
</style>

3) Overridden DatePickerStyle with the style CustomDatePickerStyle

<style name="CustomDatePickerStyle" parent="@android:style/Widget.Material.Light.DatePicker">
    <item name="android:headerBackground">@color/header_bg_color</item>
</style>

Hope it helps.

Edit: Sorry for missing out the code part, Use this style to create DatePickerDialog like this:

new DatePickerDialog(getActivity(),R.style.CustomDatePickerStyle, this, year, month, day);