Material Date Range Picker selection color formatting

Viewed 1867

When you select two date in the range picker the in-between dates get highlighted. How do i change the color of the in-between dates?

datepicker

1 Answers

You can define a style as:

  <style name="MaterialCalendarTheme_RangeFill" parent="ThemeOverlay.MaterialComponents.MaterialCalendar">
    <item name="materialCalendarStyle">@style/MyMaterialCalendar</item>
  </style>
  <style name="MyMaterialCalendar"  parent="Widget.MaterialComponents.MaterialCalendar">
    <item name="rangeFillColor">@color/my_calendar_range</item>
  </style>

with this selector:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:alpha="..." android:color="@color/...."/>
</selector>

Then in your code:

MaterialDatePicker.Builder<Pair<Long, Long>> builderRange =
        MaterialDatePicker.Builder.dateRangePicker();
builderRange.setTheme(R.style.MaterialCalendarTheme_RangeFill);

enter image description here

If you want to change totally the color only in the MaterialDatePicker you can also use something like:

  <style name="MaterialCalendarTheme_RangeFill" parent="ThemeOverlay.MaterialComponents.MaterialCalendar">
    <item name="colorPrimary">@color/....</item>
  </style>

enter image description here

Related