Configuring android date picker dialog for dark mode

Viewed 1418

I have a date picker dialog that I use in spinner mode. This is the theme used by the date picker dialog.

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

    <style name="MyDatePickerStyle" parent="@android:style/Widget.Material.DatePicker">
        <item name="android:datePickerMode">spinner</item>

This works fine when I use it when "Dark Mode = off". But it does not reverse the colors when "Dark Mode = on". Irrespective of the Dark Mode this is how the dialog looks like

enter image description here

I tried changing the parent theme to Theme.AppCompat.DayNight.Dialog. Now the dialog looks like this when "Dark Mode = on"

enter image description here

How do I make the DatePickeDialog (in spinner mode) compatible with Dark Mode?

2 Answers

Please try without specifying the parent theme, this works for me. but your dialog will be full screen for this in your theme add android: windowIsFloating = true. this to center the dialog on the screen and it becomes like a normal Dialog

this is my theme :

<style name="CustomDatePickerDialogTheme">
    <item name="android:datePickerStyle">@style/MyDatePickerStyle</item>
    <item name="android:windowIsFloating">true</item>
</style>

<style name="MyDatePickerStyle" parent="@android:style/Widget.Material.DatePicker" tools:targetApi="lollipop">
    <item name="android:datePickerMode">spinner</item>
</style>

just need to change the theme color setting as per your requirement do the below changes and do comment if not work. do your code in your parent theme this is general style

<style name="MyMaterialTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar">

    <item name="colorAccent">#FC6C2D</item>   ---> I used orange color here to display the picker dialog in orange color.

    <item name="android:textColorPrimary">#000000</item>
    <item name="android:textColorSecondary">#000000</item>

</style>
Related