CODEWITHSUNDEEP
javaandroidmaterial-design
spogebob92
spogebob92

Reputation: 1484

Setting header colour in the new Material DatePicker

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?

Upvotes: 10

Views: 4542

Answers (4)

romtsn
romtsn

Reputation: 11982

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:

api >= lollipop

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));
     }

Upvotes: 3

Parth Anjaria
Parth Anjaria

Reputation: 3971

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.

Upvotes: 2

Let&#39;sRefactor
Let&#39;sRefactor

Reputation: 3346

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);

Upvotes: 1

Srikanth
Srikanth

Reputation: 1575

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);

Upvotes: 4

Related Questions