Change DatePicker background color

Question

I am trying to display a DatePicker dialog on top of another activity and what is happening is it is somehow inheriting its color.

I'd like it to have a green header and white background,

Here is excerpt from styles

<style name="DatePickerDialog" parent="@android:style/Theme.Holo.Light">
    <item name="android:windowFrame">@null</item>
    <item name="android:windowIsFloating">true</item>
    <item name="android:windowIsTranslucent">true</item>
    <item name="colorAccent">@color/primary</item>
</style>

And this code is used to pop up the DatePicker

    DatePickerDialog datepicker = new DatePickerDialog(this, R.style.DatePickerDialog, new DatePickerDialog.OnDateSetListener() {

        public void onDateSet(DatePicker view, int year, int monthOfYear, int dayOfMonth) {
            TextView newdate = (TextView) findViewById(R.id.newdate);
            Date date = getDate(year, monthOfYear, dayOfMonth);
            DateFormat dateformat = new SimpleDateFormat(getResources().getString(R.string.date_format_full));
            newdate.setText(dateformat.format(date));
        }
    }, newCalendar.get(Calendar.YEAR), newCalendar.get(Calendar.MONTH), newCalendar.get(Calendar.DAY_OF_MONTH));

    datepicker.show();

If I specify the white background in the styles,

    <item name="android:background">@color/app_background</item>

One last thing I've tried is to use AlertDialog.THEME_DEVICE_DEFAULT_DARK as the DatePicker theme

DatePickerDialog datepicker = new DatePickerDialog(this, 
AlertDialog.THEME_DEVICE_DEFAULT_DARK, new 
DatePickerDialog.OnDateSetListener() 

Here is the style of the activity I am opening the dialog from

<style name="UserDialog" parent="android:style/Theme.Dialog">
    <item name="android:windowFrame">@null</item>
    <item name="android:windowIsFloating">true</item>
    <item name="android:windowIsTranslucent">true</item>
    <item name="android:background">@color/primary</item>
    <item name="android:textColor">@color/dialog_text</item>
    <item name="colorPrimary">@color/app_background</item>
    <item name="android:windowTitleStyle">@style/NewDialogTitle</item>
</style>

<style name="NewDialogTitle" parent="@android:style/TextAppearance.DialogWindowTitle">
    <item name="android:gravity">center_horizontal</item>
</style>

And the colors I am using

<color name="primary">#4CAF50</color>
<color name="app_background">#FFFFFF</color>

Does anyone know how to get it done? I'd appreciate any guidance. I've tried to follow this answer, but had no luck

Answer 1

The following custom DatePickerDoalog class not only makes dim color customizable but also it makes dim appearing animated

/**
 * @author Taras Yurkiv @Devlight
 */
public class DatePickerDialogCustomDim extends DatePickerDialog {

    private final long animDuration = 100;
    private float dimAmount = 0.7f;

    private Drawable dimDrawable;
    private ViewGroup root;

    private OnDismissListener outsideDismissListener;

    private final OnDismissListener dismissListener = new OnDismissListener() {

        @Override
        public void onDismiss(DialogInterface dialog) {
            final ObjectAnimator animator = ObjectAnimator.ofPropertyValuesHolder(dimDrawable,
                    PropertyValuesHolder.ofInt("alpha", (int) (255 * dimAmount), 0));
            animator.setTarget(dimDrawable);
            animator.setDuration(animDuration);
            animator.addListener(new AnimatorListenerAdapter() {
                @Override
                public void onAnimationEnd(Animator animation) {
                    ViewGroupOverlay overlay = root.getOverlay();
                    overlay.remove(dimDrawable);
                }
            });
            animator.start();
            if (outsideDismissListener != null)
                outsideDismissListener.onDismiss(dialog);
        }
    };


    @TargetApi(Build.VERSION_CODES.N)
    public DatePickerDialogCustomDim(@NonNull Context context) {
        this(context, 0);
    }

    @TargetApi(Build.VERSION_CODES.N)
    public DatePickerDialogCustomDim(@NonNull Context context, @StyleRes int themeResId) {
        this(context, themeResId, null, -1, -1, -1);
        init(context);
    }

    public DatePickerDialogCustomDim(@NonNull Context context,
                                     @Nullable OnDateSetListener listener,
                                     int year,
                                     int month,
                                     int dayOfMonth) {
        this(context, 0, listener, year, month, dayOfMonth);
    }

    public DatePickerDialogCustomDim(@NonNull Context context,
                                     @StyleRes int themeResId,
                                     @Nullable OnDateSetListener listener,
                                     int year,
                                     int monthOfYear,
                                     int dayOfMonth) {
        super(context, themeResId, listener, year, monthOfYear, dayOfMonth);
        init(context);
    }

    private void init(Context context) {
        root = ((Activity) context).getWindow().getDecorView().findViewById(android.R.id.content);
        super.setOnDismissListener(dismissListener);
    }

    public void setDimAmount(@FloatRange(from = 0, to = 1f) float dim) {
        dimAmount = dim;
    }

    @Override
    public void show() {
        super.show();
        dimDrawable = new ColorDrawable(Color.WHITE); // a dim color
        dimDrawable.setBounds(0, 0, root.getWidth(), root.getHeight());

        ViewGroupOverlay overlay = root.getOverlay();
        overlay.add(dimDrawable);

        ObjectAnimator animator = ObjectAnimator.ofPropertyValuesHolder(dimDrawable,
                PropertyValuesHolder.ofInt("alpha", 0, (int) (255 * dimAmount)));
        animator.setTarget(dimDrawable);
        animator.setDuration(animDuration);
        animator.start();
    }

    @Override
    public void setOnDismissListener(@Nullable OnDismissListener listener) {
        outsideDismissListener = listener;
    }
}

it works in conjunction of a style (mainly disables the dim)

<style name="DatePickerDialogTheme" parent="Theme.AppCompat.Light.Dialog">
    <item name="colorAccent">@color/accent</item>
    <item name="android:textColorLink">@color/primary</item>
    <item name="android:windowIsFloating">true</item>
    <item name="android:windowIsTranslucent">true</item>
    <item name="android:windowNoTitle">true</item>
    <item name="android:backgroundDimEnabled">false</item>
</style>

Answer 2

This code worked for me try this ...

styles.xml

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

Popup Code

        Calendar mcurrentDate = Calendar.getInstance();
        int mYear = mcurrentDate.get(Calendar.YEAR);
        int mMonth = mcurrentDate.get(Calendar.MONTH);
        int mDay = mcurrentDate.get(Calendar.DAY_OF_MONTH);

        DatePickerDialog mDatePicker;
        mDatePicker = new DatePickerDialog(context, R.style.DialogTheme, new DatePickerDialog.OnDateSetListener() {
            public void onDateSet(DatePicker datepicker, int selectedyear, int selectedmonth, int selectedday) {

                Toast.makeText(context,"Selected Date " + + selectedday + "-" + ++selectedmonth  + "-" + selectedyear ,Toast.LENGTH_SHORT).show();
            }
        }, mYear, mMonth, mDay);
        mDatePicker.show();

Answer 3

To change DatePicker colors (calendar mode) at application level define below properties.

<style name="MyAppTheme" parent="Theme.AppCompat.Light">
    <item name="colorAccent">#ff6d00</item>
    <item name="colorControlActivated">#33691e</item>
    <item name="android:selectableItemBackgroundBorderless">@color/colorPrimaryDark</item>
    <item name="colorControlHighlight">#d50000</item>
</style>

Reference : How to change the style of a DatePicker in android?