How to change the default color of DatePicker and TimePicker dialog in Android?

Question

Is there any way to change the default color of DatePicker and TimePicker dialog?

This is the code I tried

<DatePicker
                    style="@style/date_picker"
                    android:background="#6495ED"
                    android:id="@+id/DatePicker"
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="5dp"
                    android:layout_marginBottom="5dp"
                    android:layout_marginLeft="5dip"
                    android:layout_marginRight="5dip" />

<TimePicker
                    android:id="@+id/TimePicker"
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="5dp"
                    android:layout_marginBottom="5dp"
                    android:layout_marginLeft="5dip"
                    android:layout_marginRight="5dip" />

---

Below two line only changing the background color, I want to change the default silver color of both date and time picker.
Any help please.

style="@style/date_picker"
android:background="#6495ED"

Solution 1

The best way to change the picker dialog is by adding custom style to it.

<style name="TimePickerTheme" parent="Theme.AppCompat.Light.Dialog">
    <item name="colorAccent">@color/color_primary</item>
    <item name="android:layout_width">wrap_content</item>
    <item name="android:layout_height">wrap_content</item>
</style>

TimePickerDialog timePicker = new TimePickerDialog(mContext, R.style.TimePickerTheme, fromListener, hour, min, false);

Worked perfectly for me.

Solution 2

You have to create a custom theme and save it in some directories to finally set this theme as the default one for the app

First, in values add a themes.xml like this:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="MyAppTheme" parent="@android:style/Theme.Light.NoTitleBar">
        <!-- Any customizations for your app running on pre-3.0 devices here -->
    </style>
</resources> 

Then, create a directory with the name "values-v11" (Android 3.0+ ) in the res directory and put a themes.xml like this

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="MyAppTheme" parent="@android:style/Theme.Holo.Light">
        <!-- Any customizations for your app running on 3.0+ devices here -->
    </style>
</resources>

Finally, create a directory with the name "values-v14" (Android 4.0+) in the res directory and create a themes.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="MyAppTheme" parent="@android:style/Theme.DeviceDefault.Light.NoActionBar">
        <!-- Any customizations for your app running on 4.0+ devices here -->
    </style>
</resources>

Finally in your manifest.xml

<application
        ...
        android:theme="@style/MyAppTheme">

Solution 3

I think there is no way to change the grey color of the old native picker widgets easily in XML.

I propose you use the library HoloEverywhere so that DatePicker and TimePicker look really nice on all Android platforms 2.1+.

Solution 4

you can change theme of your date-picker by changing theme like this.

change items according to you.

<style name="date_picker" parent="@android:style/Widget.DeviceDefault.DatePicker">
<item name="android:divider">@drawable/dialog_divider</item>

change items according to you. and set this theme to your data-picker style

style="@style/date_picker"

Solution 5

For Date Picker add this codes to color.xml

  <color name="mdtp_accent_color">#070B82</color>
  <color name="mdtp_accent_color_dark">#0D105E</color>

For both you can define style in style.xml

 <style name="TimePickerTheme" parent="Theme.AppCompat.Light.Dialog">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/blue</item>
</style>

and set style in xml:

 android:theme="@style/MyAppTheme"

or programically:

TimePickerDialog timePicker = new TimePickerDialog(mContext, R.style.TimePickerTheme, fromListener, hour, min, false);

View more solutions