How to show span across date range?

manideepla commented 4 years ago

Like how Google's Material Date Picker shows?

manideepla commented 4 years ago

Can somebody help with this please?

dri94 commented 4 years ago

In xml use

    <com.prolificinteractive.materialcalendarview.MaterialCalendarView
        android:id="@+id/calendar_view_range"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:mcv_selectionMode="range"
        />

manideepla commented 4 years ago

In xml use

    <com.prolificinteractive.materialcalendarview.MaterialCalendarView
        android:id="@+id/calendar_view_range"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:mcv_selectionMode="range"
        />

That just allows me to select a range of dates. What I wanted is something like this: calendar

adityabhaskar commented 4 years ago

If you just want basic highlighting (without the handles and rounded corners), it is easy.

Create a drawable for background

drawable/bg_selected_date:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >
    <solid android:color="@color/primaryLightColor"/>
</shape>

Create a state list for background.

drawable/sl_bg_selected_date:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/bg_selected_date" android:state_checked="true" />
    <item android:drawable="@android:color/transparent" />
</selector>

Create event decorator for selected dates. The code below will apply provided decorator to all selected dates.

    class SelectionDecorator(private val selectionDrawable: Drawable): DayViewDecorator {
        override fun shouldDecorate(day: CalendarDay?) = true

        override fun decorate(view: DayViewFacade?) {
            view?.setSelectionDrawable(selectionDrawable)
        }
    }

Add Event decorator to calendar view

calendar.addDecorator(SelectionDecorator(
    context.getDrawable(R.drawable.sl_bg_selected_date) 
        ?: throw Exception("No selection drawable")
))

Now selected range appears as below: Screenshot_20200515-095948

yugmewada commented 1 month ago

Screenshot 2024-06-02 005739 Hello Aditya Bhaskar, Thank you for your code snippet using it i am able to succeed to fulfil my need as well, But as you can see the screen shot attached i want corners as mentioned in screenshot, So can you please give some suggestion or guide me that how can i achieve as shown in this screenshot

adityabhaskar commented 1 month ago

@yugmewada This library is abandonware. It has had no updates for 6 years. Besides, Google now provides first party date pickers in Compose. I'd suggest just using those.

prolificinteractive / material-calendarview

How to show span across date range? #1007