Different color for disabled dates CalendarView

Viewed 570

I created a custom CalendarView that looks as follows:

enter image description here

I want all of the past days to be in a different color.

My XML is:

<CalendarView
    android:id="@+id/cv_Calendar"
    android:layout_width="match_parent"
    android:layout_height="300dp"
    android:layout_marginStart="16dp"
    android:layout_marginEnd="16dp"
    android:background="@drawable/cv_background"
    android:dateTextAppearance="@style/CalenderViewDateCustomText"
    android:theme="@style/CalenderViewCustom"
    android:weekDayTextAppearance="@style/CalenderViewWeekCustomText"
    app:layout_constraintTop_toBottomOf="@+id/tv_With" />

And my styles are:

<style name="CalenderViewCustom" parent="Theme.AppCompat">
    <item name="colorAccent">@color/colorLightGray</item>
    <item name="colorPrimary">@color/colorLightPurple</item>
    <item name="android:textColorPrimary">@color/colorGrayText</item>
</style>

<style name="CalenderViewDateCustomText" parent="android:TextAppearance.Holo.Small">
    <item name="android:textColor">@color/colorLightPurple</item>
    <item name="android:weekNumberColor">@color/colorLightPurple</item>
</style>

<style name="CalenderViewWeekCustomText" parent="android:TextAppearance.DeviceDefault.Small">
    <item name="android:textColor">@color/colorLightPurple</item>
</style>

I set the minimum date programmatically:

calendarView = findViewById( R.id.cv_Calendar );
calendarView.setMinDate( System.currentTimeMillis() );
calendarView.setOnDateChangeListener( (arg0, year, month, date) -> {
    GregorianCalendar cal = new GregorianCalendar( year, month, date );
    dateInMillis = cal.getTimeInMillis();
} );

Any idea how to change the color?

Thank you

1 Answers

I'm not sure if you still need an answer for this, but in case anyone else comes across this question, here's how you do it:

Basically you need to change the textColor attribute you're using to reference a selector that should look like this:

selectorDateTextColor.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
        
    <!-- The color used by the disabled dates (i.e. everything outside the range you set with minDate and maxDate) -->
    <item android:color="@color/gray" android:state_enabled="false" />
    
    <!-- The color used by everything else -->
    <item android:color="@color/colorLightPurple" />
</selector>

And your style would be:

<style name="CalenderViewDateCustomText" parent="android:TextAppearance.Holo.Small">
    <item name="android:textColor">@color/selectorDateTextColor</item>
    <item name="android:weekNumberColor">@color/colorLightPurple</item>
</style>

You can also add more states such as android:state_activated="true" to change the text color of the date selected by the user.

And if you want to change the color of the circle around the selected date you should add <item name="colorControlActivated">@color/blue</item> to the theme used by your CalendarView.

Related