Material-calendarview: custom background with range selection

Created on 8 Jun 2017  路  8Comments  路  Source: prolificinteractive/material-calendarview

I want to change the range selection to the provided preview. I studied the code but found No way to custmize DayView.

Anyhelp would be appreciated.

149695452190255

Most helpful comment

@Vietvantue Theres a another lib here on top of this lib: https://github.com/ptrstovka/calendarview2
Its from @TheGreat0004 . Thanks mate!

All 8 comments

Same here want to do the same but it seems DayView is restricted. I wish the developer @quentin41500 would help us.

@quentin41500 I actually figured out a solution:

  1. select first option for multiple dates in calendar
  2. download latest source code -> and pull this PR https://github.com/prolificinteractive/material-calendarview/pull/500 (this should have already been merged but I am guessing the dev is missing or busy)
  3. Go to DayView.java and change the calculateBounds method to protected.
  4. compile/build project into a .aar -> import into your own project.
  5. create CustomDayView and create a new DayViewProvider (there is a method now SetDayViewProvider)
  6. override calculateBounds and copy the original code with one minor change when width is greater than height:
    tempRect.set(0, padding, width, height - padding);
    (this will make sure that the width of each field is now right next to the other there is no spacing in between.
  7. Create decorators (4 of them)
  8. Decorator for normal selection (a round circle), android shape will do
  9. Decorator for round circle with rectangle on the right, android shape (I used layer-list)
  10. Decorator for round circle with rectangle on the left, android shape (I used layer-list)
  11. Decorator with rectangle for between dates

All decorators get the dates from the constructor.

  1. MaterialCalendarViewInstance.RangeSelected should now provide to the decorates the selected range and refresh the decorators Invalidate method of decorators (https://github.com/prolificinteractive/material-calendarview/blob/master/docs/DECORATORS.md)
  2. enjoy your beloved calendar :)

@quentin41500 Thanks for the steps. But possible to share ur code? esp the creation of 4 decorators?

@quentin41500 :+1: Thank you for instruction!
@iad24 I'm also working on it. Will share code to you when finish

@Vietvantue Theres a another lib here on top of this lib: https://github.com/ptrstovka/calendarview2
Its from @TheGreat0004 . Thanks mate!

@Vietvantue Btw, have u continued on ur own implementation of doing this? Just curious

Anyone has implemented the suggestion given by @Qwin ?

@aadilHaffez please go with the new library, as link shared by @iad24

Was this page helpful?
0 / 5 - 0 ratings