The CustomCalendarView provides an easy and customizable option to create a Calendar. It displays the days of a month in a grid layout and allows navigating between months.

1. Custom Calendar View Features

Currently it allows the following features:

  • Next and previous month navigation
  • Allow various customization including background color for day, week and title
  • Set custom typeface using setCustomTypeFace() method.
  • Show hide next previous month overflow days
  • Set custom day options for start day of week. By default it is set to Calendar.SUNDAY
  • Unlimited customizations for day of the month using custom Decorators.
  • Allow you to handle event when user changes month and day selection.

Custom Calendar View Android

-Advertisement-

2. Library Compatibility

This library is compatible from API 14.

3. Add CustomCalendarView Library

To use the CustomCalendarView in your application, you first need to add the library to your application. You can do this by either from Gradle, Maven or by directly downloading the source code form GitHub.

Gradle

Step 1. Add the JitPack repository to your build file

Step-1 Add it in your build.gradle at the end of repositories:

repositories {
    maven { url "https://jitpack.io" }
}

Step-2 Add the dependency in the form

dependencies {
    compile 'com.github.npanigrahy:Custom-Calendar-View:v1.1'
}

Maven

<repository>
     <id>jitpack.io</id>
     <url>https://jitpack.io</url>
</repository>

Step 2. Add the dependency in the form

<dependency>
     <groupId>com.github.npanigrahy</groupId>
     <artifactId>Custom-Calendar-View</artifactId>
     <version>v1.1</version>
</dependency>

Sbt

Step-1 Add it in your build.sbt at the end of resolvers:

resolvers += "jitpack" at "https://jitpack.io"

Step-2 Add the dependency in the form

libraryDependencies += "com.github.npanigrahy" % "Custom-Calendar-View" % "v1.1"

4. Using CustomCalendarView Library

The GitHub project source includes a sample application, that is used for demonstrating the various features currently supported by this library. Once the library is added to your project, you can include the CustomCalendarView into your activity/fragment layout using the following code snippets.

<com.stacktips.view.CustomCalendarView
	android:id="@+id/calendar_view"
	android:layout_width="match_parent"
	android:layout_height="wrap_content"
	android:background="@color/off_white">
</com.stacktips.view.CustomCalendarView>

The above code snippet will show the simple Calendar View with default design. Now, you can use the following attributes, to customize the appearance of calendar.

<com.stacktips.view.CustomCalendarView
	android:id="@+id/calendar_view"
	android:layout_width="match_parent"
	android:layout_height="wrap_content"
	android:background="@color/off_white"
	app:calendarBackgroundColor="@color/off_white"
	app:calendarTitleTextColor="@color/black"
	app:currentDayOfMonthColor="@color/blue"
	app:dayOfMonthTextColor="@color/black"
	app:dayOfWeekTextColor="@color/black"
	app:disabledDayBackgroundColor="@color/off_white"
	app:disabledDayTextColor="@color/grey"
	app:selectedDayBackgroundColor="@color/blue"
	app:titleLayoutBackgroundColor="@color/white"
	app:weekLayoutBackgroundColor="@color/white">
</com.stacktips.view.CustomCalendarView>

Let us now, initialize the calendar view to control the various other appearance and behavior of calendar using the following methods.

//Initialize CustomCalendarView from layout
calendarView = (CustomCalendarView) findViewById(R.id.calendar_view);

//Initialize calendar with date
Calendar currentCalendar = Calendar.getInstance(Locale.getDefault());

//Show Monday as first date of week
calendarView.setFirstDayOfWeek(Calendar.MONDAY);

//Show/hide overflow days of a month
calendarView.setShowOverflowDate(false);

//call refreshCalendar to update calendar the view
calendarView.refreshCalendar(currentCalendar);

//Handling custom calendar events
calendarView.setCalendarListener(new CalendarListener() {
    @Override
    public void onDateSelected(Date date) {
        SimpleDateFormat df = new SimpleDateFormat("dd-MM-yyyy");
        Toast.makeText(MainActivity.this, df.format(date), Toast.LENGTH_SHORT).show();
    }

    @Override
    public void onMonthChanged(Date date) {
        SimpleDateFormat df = new SimpleDateFormat("MM-yyyy");
        Toast.makeText(MainActivity.this, df.format(date), Toast.LENGTH_SHORT).show();
    }
});

5. Using Custom TypeFace

//Setting custom font
final Typeface typeface = Typeface.createFromAsset(getAssets(), "fonts/Arch_Rival_Bold.ttf");
if (null != typeface) {
    calendarView.setCustomTypeface(typeface);
    calendarView.refreshCalendar(currentCalendar);
}

Custom Calendar View Library in Android Custom Font

6. Using Day Decorators

Example2: How to Disable Past Dates in CustomCalendarView using Decorators.

//adding calendar day decorators
List decorators = new ArrayList<>();
decorators.add(new ColorDecorator());
calendarView.setDecorators(decorators);
calendarView.refreshCalendar(currentCalendar);

Custom Calendar View Library in Android Decorator

If you enjoy this library, don’t forget to like our Facebook page or follow us on twitter @Stacktips.

Join The Discussion

Please note: We reserve the right to delete comments that contains snarky remarks, offensive or off-topic. To know more read our comments policy.
  • MacketSWE

    Hi! Why does the theme for my entire app change when I put this in my repository and dependencies?

  • Narendra

    Hi, please help me ,, its urgent

    How to stop previous month navigation from current month

  • Emmanuel Busobozi

    Good morning Nilanchala, this is a nice library but I have two questions to ask
    1..Iam using this customCalendarView but I want to change the background color for only one day in the calendar and that background color of that day should not disapear even when I close the app,how can i do that.

    Second Question
    2.How can i display a certain month of the year programmatically with a button click in the calendar without having to press next until i reach the year and month.For example I want the calendar to show me November 2030.How can I do that.

  • how to add events or color on particular days / dates.
    I am not getting Decorators

  • JWest

    How could I get the current selected date of the calendar in a Button event? I have a button below of the calendar. After the user click into calendar, He needs to click a button to go to next activity. I need to get the selected date clicked to pass as a bunlde. Is it possible? I have used Date dd=calendarView.getCurrentCalendar().getTime(); but it returns the current date not the selected date. Does someone can help me?

  • James

    Hi great tutorial sir , can I get the date data in database then mark it in this custom calendar?
    please help

  • Sure you can. You may use TextView span in conjunction with DayDecorator

    • Joe

      Hi Nilanchala,I used library,I done event drawing(Same day when I asked question). Library is really useful.Thanks :)

      • Thanks Joe. Glad it helped.
        Would you mind pasting an screenshot if possible? It might help other users. :-)

        • friend swades

          Can you please paste code to add dot or image to the dayview?

        • friend swades

          Can you please share the code to update the date cell please?

  • The onMonthChanged() callback in CalendarListener does it.

    //Handling custom calendar events
    calendarView.setCalendarListener(new CalendarListener() {
    @Override
    public void onDateSelected(Date date) {
    SimpleDateFormat df = new SimpleDateFormat(“dd-MM-yyyy”);
    Toast.makeText(MainActivity.this, df.format(date), Toast.LENGTH_SHORT).show();
    }

    @Override
    public void onMonthChanged(Date date) {
    SimpleDateFormat df = new SimpleDateFormat(“MM-yyyy”);
    Toast.makeText(MainActivity.this, df.format(date), Toast.LENGTH_SHORT).show();
    }

  • replace “com.imanoweb.calendarview.CustomCalendarView” with com.stacktips.view.CustomCalendarView if you using v1.1

  • Prachi Karapurkar

    how to disable previous dates from current date..sir can you help me out..

  • bayerish

    how to add this awesome lib on Eclipse?

    • Currently we do not have the Eclipse portable project. You can build a JAR out of the library and add it to your eclipse project lib directly.

  • Pankaj

    Great library. Does all basic stuffs you need. However it doesn’t support week view.

  • Currently it is not supporting localization.

  • keyur

    hey Nilanchala Panigrahy am developing app and i want to add public holiday list in it then can you give some hint how can i implement that??

    • You can do that using DaysDecorator provided in library. Check out our example and featured comment section

  • Humayoon

    Thanks I have Resolved my issue And Thanks For help this code help me alot

  • Humayoon

    #Nilanchala Panigrahy Thanks for help but that will not change some dates color it will change the whole month dates color
    for example i want to change 16 ,17,20,5,7 dates color not full of month dates

  • Humayoon

    #Nilanchala Panigrahy Hy

    how can i change specific dates colors in any month I tried but could not set color of specifice dates

    because I tried to set colors of specific dates fore example

    dayView = (DayView) view.findViewWithTag(DAY_OF_MONTH_TEXT + date);
    dayView.setTextColor(mContext.getResources().getColor(R.color.no_leaverecieve_text_color));

    if i set 14 and 18 it will set 12 and 16 and some time in another months when i set 8 and 12 it will set 10 and 14

  • Cesar Daniel Meneses Guevara

    Hi I need help with the following problem. Clicking on a date that has a specific color given by the DayDecorator class color is lost

    • Hi Cesar, This is a known bug. Will fix it in my free time.

      • Cesar Daniel Meneses Guevara

        I hope it is soon

  • Maju Sumanto

    Sorry this is the first time i develop an android apps…
    and i want to ask could i add item list under the custom calendar view which is contains our schedule?

    • You can absolutely do that. For that you need to add the CalendarView to list header.

      // inflate custom header and attach it to the list
      LayoutInflater inflater = getLayoutInflater();
      ViewGroup header = (ViewGroup) inflater.inflate(R.layout.custom_header, listView, false);
      listView.addHeaderView(header, null, false);

      Checkout similar example ListView Header Parallax in Android

      • Maju Sumanto

        thanks!!!

  • Hi Amit, unfortunately currently it is not supported.

  • You can do that in decorator as follows

    private class DaysDecorator implements DayDecorator {
    @Override
    public void decorate(DayView dayView) {
    if(null == dayView) return;

    if (dayView.getDate().before(new Date())) {
    dayView.setClickable(false);
    }
    }

    • SubbuRaj Reddy

      Thanks bro

      • Cheers :-)

        • bhavin h makwana

          hi, i am making math formula app…so what i ahve to use offline webview or imageview to store formula…i appreciate ur help ..how can i contact u

  • Neha Sharma

    Its very urgent ….

  • Neha Sharma

    Please help me because currently I am making an app and I want this function in your calendar

  • Neha Sharma

    Can I change the month by scrolling down in this calendar?

    • Hey @disqus_dz0L9TTcVs:disqus. Currently the calendar view is not supporting scrolling down.

  • neil

    Its Possible to hide previous day for current day in same month

  • Ameen Maheen

    hey can you tell me how to mark days with different color for a set of dates on the calandar

  • Nageswararao CH

    I need to customize sun,Mon,tue… Sat ,like some special text (Ex: 1,2,..7),how I need to replace ?please guid me,your response will appriceated.

  • Vinay

    Hi , i want to display round background with color to the particular day.

  • Akeshwar Jha

    Hi Nilanchala, thanks for the library. I have a simple question: How do I retrieve a particular DayView corresponding to a date in my activity class?

  • Mahesh Lad

    is it possible to show month like 26 feb to 26 march ?

  • Naveen hoovinahalli

    Hi
    As requested by girish singh, Even I want to set the background color of some days of month in different color, And I saw that day decor example but i dint get the solution , Can you please explain how can we do that

  • You need to implement DayDecorator. See the example in the comments above.

  • Can you do a pull request and modify. Once you done, I can merge it back to trunk.

  • You need to use the DaysDecorator to achieve this. Here is the sample code that might help you..

    private class DaysDecorator implements DayDecorator {
    @Override
    public void decorate(DayView dayView) {
    if(!isPastDay(dayView.getDate())){
    dayView.setBackgroundColor(getResources().getColor(R.color.disable_color));
    }
    }
    }

    private boolean isPastDay(Date date) {
    Calendar c = Calendar.getInstance();

    // set the calendar to start of today
    c.set(Calendar.HOUR_OF_DAY, 0);
    c.set(Calendar.MINUTE, 0);
    c.set(Calendar.SECOND, 0);
    c.set(Calendar.MILLISECOND, 0);

    // and get that as a Date
    Date today = c.getTime();

    // test your condition, if Date specified is before today
    if (date.before(today)) {
    return true;
    }
    return false;
    }

    • Prachi Karapurkar

      its not working can u please help me out..

  • SANdeep Tengale

    Is is possible to show only months of the year and days of the week in this library??

  • Marek Mošať

    Is it possible add small text to Dates in calendar. I have database with 2 columns: date and name. How add this columns (arrays) to calendar?

  • Prashanth

    Awesome library. I need to set the max and min date, please help me how can i achieve this by using your library

    • Unfortunately the library is limited with this feature. you need to extend yourself

  • i want to change the color of current week.how it?

  • Kamal Sampath upasena

    This a awesome lib thank you for creating such a awesome one, But how to use decorator for specific date ? can you please post a example on that , if i want colour a specific date on calendar (Like Public Holiday) how can i achieve this ?

  • Nabeel Hafeez

    ArrayList error occured “Diamond types are not supported at this language level” and ColorDecorator() class can not resolved.

    • Check your java version.

      • Dhananjay tiwari

        i need to implement background icons instead of colors in decoraters.Can you help me?

      • MAHAPRASAD CHAND

        i want to add an event to your calendar when clicked a particular date . can you do that

        • Punithapriya

          did u find the answer

          • You can do that using following code snippets

            Intent intent = new Intent(Intent.ACTION_INSERT)
            .setData(CalendarContract.Events.CONTENT_URI)
            .putExtra(CalendarContract.EXTRA_EVENT_BEGIN_TIME, eventDate.getTimeInMillis())
            .putExtra(CalendarContract.EXTRA_EVENT_END_TIME, eventDate.getTimeInMillis() + 60 * 60 * 1000)
            .putExtra(CalendarContract.Events.TITLE, title)
            .putExtra(CalendarContract.Events.DESCRIPTION, description)
            .putExtra(CalendarContract.Events.AVAILABILITY, CalendarContract.Events.AVAILABILITY_BUSY);
            context.startActivity(intent);
            Toast.makeText(context, context.getString(R.string.added_to_calendar_message), Toast.LENGTH_SHORT).show();

    • Naveen hoovinahalli

      use this it will work

      List decorators = new ArrayList();