CompactCalendarView
An android library which provides a compact calendar view much like the one used in google calenders.
Top Related Projects
A Material design back port of Android's CalendarView
A highly customizable calendar view and compose library for Android and Kotlin Multiplatform.
A better calendar for Android
Standalone Android widget for picking a single date from a calendar view.
Android Week View is an android library to display calendars (week view or day view) within the app. It supports custom styling.
Quick Overview
CompactCalendarView is an Android library that provides a compact calendar widget for Android applications. It offers a customizable and space-efficient way to display calendars, making it ideal for apps that need to show date-related information without taking up too much screen real estate.
Pros
- Compact and space-efficient design
- Highly customizable appearance and behavior
- Smooth scrolling and animations
- Easy integration with existing Android projects
Cons
- Limited to Android platform only
- May require additional customization for complex use cases
- Documentation could be more comprehensive
- Not actively maintained (last update was in 2020)
Code Examples
- Basic setup of CompactCalendarView:
CompactCalendarView compactCalendarView = (CompactCalendarView) findViewById(R.id.compactcalendar_view);
compactCalendarView.setUseThreeLetterAbbreviation(true);
compactCalendarView.setFirstDayOfWeek(Calendar.MONDAY);
- Adding an event to the calendar:
Event ev1 = new Event(Color.GREEN, 1433701251000L, "Some event");
compactCalendarView.addEvent(ev1);
- Setting up a listener for date click events:
compactCalendarView.setListener(new CompactCalendarView.CompactCalendarViewListener() {
@Override
public void onDayClick(Date dateClicked) {
List<Event> events = compactCalendarView.getEvents(dateClicked);
Log.d("CALENDAR", "Day was clicked: " + dateClicked + " with events " + events);
}
@Override
public void onMonthScroll(Date firstDayOfNewMonth) {
Log.d("CALENDAR", "Month was scrolled to: " + firstDayOfNewMonth);
}
});
Getting Started
To use CompactCalendarView in your Android project:
- Add the JitPack repository to your build file:
allprojects {
repositories {
...
maven { url 'https://jitpack.io' }
}
}
- Add the dependency:
dependencies {
implementation 'com.github.SundeepK:CompactCalendarView:3.0.0'
}
- Add the CompactCalendarView to your layout XML:
<com.github.sundeepk.compactcalendarview.CompactCalendarView
android:id="@+id/compactcalendar_view"
android:layout_width="fill_parent"
android:layout_height="250dp"
app:compactCalendarTargetHeight="250dp"
app:compactCalendarTextSize="12sp"
app:compactCalendarBackgroundColor="#ffe95451"
app:compactCalendarTextColor="#fff"
app:compactCalendarCurrentSelectedDayBackgroundColor="#E57373"
app:compactCalendarCurrentDayBackgroundColor="#B71C1C"
app:compactCalendarMultiEventIndicatorColor="#fff" />
- Initialize and customize the calendar in your Activity or Fragment as shown in the code examples above.
Competitor Comparisons
A Material design back port of Android's CalendarView
Pros of material-calendarview
- More customizable appearance with Material Design principles
- Supports multiple selection modes (single, multiple, range)
- Better documentation and examples
Cons of material-calendarview
- Larger library size and potentially higher resource usage
- Steeper learning curve due to more complex API
Code Comparison
CompactCalendarView:
CompactCalendarView calendarView = (CompactCalendarView) findViewById(R.id.compactcalendar_view);
calendarView.setUseThreeLetterAbbreviation(true);
calendarView.setFirstDayOfWeek(Calendar.MONDAY);
calendarView.setIsRtl(false);
calendarView.displayOtherMonthDays(false);
material-calendarview:
MaterialCalendarView calendarView = (MaterialCalendarView) findViewById(R.id.calendarView);
calendarView.setSelectionMode(MaterialCalendarView.SELECTION_MODE_MULTIPLE);
calendarView.setTopbarVisible(false);
calendarView.setDynamicHeightEnabled(true);
calendarView.setShowOtherDates(MaterialCalendarView.SHOW_ALL);
Both libraries offer easy-to-use calendar views for Android applications. CompactCalendarView focuses on simplicity and compact design, while material-calendarview provides more extensive customization options and adheres to Material Design guidelines. The choice between the two depends on the specific requirements of your project, such as design preferences, feature needs, and performance considerations.
A highly customizable calendar view and compose library for Android and Kotlin Multiplatform.
Pros of Calendar
- More customizable and flexible, allowing for various calendar layouts and styles
- Better support for Kotlin and modern Android development practices
- Actively maintained with regular updates and improvements
Cons of Calendar
- Steeper learning curve due to increased complexity and options
- May be overkill for simple calendar implementations
- Requires more setup and configuration compared to CompactCalendarView
Code Comparison
CompactCalendarView:
val compactCalendarView = findViewById<CompactCalendarView>(R.id.compactcalendar_view)
compactCalendarView.setUseThreeLetterAbbreviation(true)
compactCalendarView.setFirstDayOfWeek(Calendar.MONDAY)
compactCalendarView.setListener(object : CompactCalendarViewListener {
override fun onDayClick(dateClicked: Date) {
// Handle day click
}
})
Calendar:
class CalendarViewContainer(view: View) : ViewContainer(view) {
val textView = view.findViewById<TextView>(R.id.calendarDayText)
}
val calendarView = findViewById<CalendarView>(R.id.calendarView)
calendarView.dayBinder = object : DayBinder<CalendarViewContainer> {
override fun create(view: View) = CalendarViewContainer(view)
override fun bind(container: CalendarViewContainer, day: CalendarDay) {
container.textView.text = day.date.dayOfMonth.toString()
}
}
A better calendar for Android
Pros of Caldroid
- More customizable appearance with support for custom cell views and styles
- Built-in support for date ranges and multiple date selection
- Includes swipe gestures for month navigation
Cons of Caldroid
- Larger library size and potentially higher memory footprint
- Less frequently updated compared to CompactCalendarView
- May have a steeper learning curve due to more complex API
Code Comparison
CompactCalendarView:
compactCalendarView.setListener(new CompactCalendarView.CompactCalendarViewListener() {
@Override
public void onDayClick(Date dateClicked) {
// Handle date click
}
});
Caldroid:
CaldroidListener listener = new CaldroidListener() {
@Override
public void onSelectDate(Date date, View view) {
// Handle date selection
}
};
caldroidFragment.setCaldroidListener(listener);
Both libraries offer similar basic functionality for displaying and interacting with calendars in Android applications. CompactCalendarView focuses on simplicity and compact design, making it easier to integrate into existing layouts. Caldroid provides more advanced features and customization options, but at the cost of increased complexity and library size.
The code comparison shows that both libraries use listener interfaces for handling date selection events, with Caldroid offering a more granular approach to event handling. Developers should consider their specific requirements and project constraints when choosing between these two calendar libraries.
Standalone Android widget for picking a single date from a calendar view.
Pros of android-times-square
- More customizable appearance with extensive theming options
- Better support for date ranges and multi-day selections
- Larger community and more frequent updates
Cons of android-times-square
- Larger library size and potentially higher memory footprint
- Less compact design, may not be suitable for space-constrained UIs
- Steeper learning curve due to more complex API
Code Comparison
CompactCalendarView:
compactCalendarView.setListener(object : CompactCalendarViewListener {
override fun onDayClick(dateClicked: Date) {
// Handle day click
}
override fun onMonthScroll(firstDayOfNewMonth: Date) {
// Handle month scroll
}
})
android-times-square:
calendarView.setOnDateSelectedListener(object : CalendarPickerView.OnDateSelectedListener {
override fun onDateSelected(date: Date) {
// Handle date selection
}
override fun onDateUnselected(date: Date) {
// Handle date deselection
}
})
Both libraries offer event listeners for date selection, but android-times-square provides more granular control with separate callbacks for selection and deselection. CompactCalendarView's API is simpler, while android-times-square offers more flexibility at the cost of complexity.
Android Week View is an android library to display calendars (week view or day view) within the app. It supports custom styling.
Pros of Android-Week-View
- More flexible layout options, including day, 3-day, and week views
- Supports horizontal scrolling for navigating between time periods
- Offers customizable event styles and colors
Cons of Android-Week-View
- Larger library size and potentially higher complexity
- May require more setup and configuration for basic use cases
- Less suitable for compact or minimalist calendar displays
Code Comparison
CompactCalendarView:
CompactCalendarView compactCalendar = (CompactCalendarView) findViewById(R.id.compactcalendar_view);
compactCalendar.setUseThreeLetterAbbreviation(true);
compactCalendar.setFirstDayOfWeek(Calendar.MONDAY);
compactCalendar.addEvent(new Event(Color.RED, 1433701251000L, "Event 1"));
Android-Week-View:
WeekView mWeekView = (WeekView) findViewById(R.id.weekView);
mWeekView.setNumberOfVisibleDays(3);
mWeekView.setColumnGap((int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 8, getResources().getDisplayMetrics()));
mWeekView.setEventTextColor(getResources().getColor(R.color.event_color_01));
mWeekView.setEventTextSize((int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP, 12, getResources().getDisplayMetrics()));
Both libraries offer calendar functionality for Android applications, but Android-Week-View provides more advanced features and customization options at the cost of increased complexity. CompactCalendarView is better suited for simpler, more compact calendar displays, while Android-Week-View excels in scenarios requiring detailed weekly or daily views with extensive event management capabilities.
Convert designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual CopilotREADME
CompactCalendarView
CompactCalendarView is a simple calendar view which provides scrolling between months. It's based on Java's Date and Calendar classes. It provides a simple api to query for dates and listeners for specific events. For example, when the calendar has scrolled to a new month or a day has been selected. Still under active development.
Contributing
Please raise an issue of the requirement so that a discussion can take before any code is written, even if you intend to raise a pull request. Please see setup for testing.
Testing
CompactCalendarView makes use of screenshot-tests-for-android (https://github.com/facebook/screenshot-tests-for-android). This is for UI testing. Since screenshot-tests-for-android takes screenshots, we need a way to ensure images can be reproduced consistently. To do this, a specific emulator is used to run tests. Unfortunately, an older emulator is used for now. New pull requests which change functionality some how should aim to create new screenshot tests or unit tests if possible. To run this locally, run the below commands:
Pre-requisite (Also refer to .travis.yml):
- Python
- Python pillow installed
- Install android-19 (can be done through android sdk manager or command line).
Android 19 emulator is used because it seems to be a fast enough on travis-ci and because x86 emulators are not supported on travis-ci. Newer android version is possible but build times will increase.
Install the abi and accept:
$ $ANDROID_HOME/tools/bin/sdkmanager 'system-images;android-22;default;armeabi-v7a'
Create the emulator:
$ echo no | $ANDROID_HOME/tools/bin/avdmanager create avd --force -n testCompactCalendarEmulator -k "system-images;android-22;default;armeabi-v7a"
Create sd card (creating in current dir): Any problems with sdcard are best solved by deleting and trying again
$ mksdcard -l sdcard 100M sdcard
Run emulator (with out audio and window):
$ $ANDROID_HOME/emulator/emulator -avd testCompactCalendarEmulator -no-audio -no-window -sdcard sdcard &
Run emulator and watch(with audio and window):
$ $ANDROID_HOME/emulator/emulator -avd testCompactCalendarEmulator -sdcard sdcard
Running the tests to verify that the current tests pass and to check which tests are not producing the same screenshot:
$ ./gradlew verifyMode screenshotTests
To generate new screenshots if new tests have been added:
$ ./gradlew recordMode screenshotTests
Run the unit tests like below:
$ ./gradlew test
Android studio emulator
It's possible to test using android studio emulator. However, it must be android 19 and and 480x800 screen resolution. One example is the Nexus S emulator. Just start the emulator and execute the gradle commands to run the tests. Emulator should be found automatically.
Open/Close animations
The library supports opening/closing with or without animations.
Example usage
It is possible to change the appearance of the view via a few properties. This includes the background color, text color, textsize color of the current day and the color of the first day of the month.
<com.github.sundeepk.compactcalendarview.CompactCalendarView
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/compactcalendar_view"
android:layout_width="fill_parent"
android:paddingRight="10dp"
android:paddingLeft="10dp"
android:layout_height="250dp"
app:compactCalendarTargetHeight="250dp"
app:compactCalendarTextSize="12sp"
app:compactCalendarBackgroundColor="#ffe95451"
app:compactCalendarTextColor="#fff"
app:compactCalendarCurrentSelectedDayBackgroundColor="#E57373"
app:compactCalendarCurrentDayBackgroundColor="#B71C1C"
app:compactCalendarMultiEventIndicatorColor="#fff"
/>
Please see Sample app for full example.
// ... code omitted for brevity
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final CompactCalendarView compactCalendarView = (CompactCalendarView) findViewById(R.id.compactcalendar_view);
// Set first day of week to Monday, defaults to Monday so calling setFirstDayOfWeek is not necessary
// Use constants provided by Java Calendar class
compactCalendarView.setFirstDayOfWeek(Calendar.MONDAY);
// Add event 1 on Sun, 07 Jun 2015 18:20:51 GMT
Event ev1 = new Event(Color.GREEN, 1433701251000L, "Some extra data that I want to store.");
compactCalendar.addEvent(ev1);
// Added event 2 GMT: Sun, 07 Jun 2015 19:10:51 GMT
Event ev2 = new Event(Color.GREEN, 1433704251000L);
compactCalendar.addEvent(ev2);
// Query for events on Sun, 07 Jun 2015 GMT.
// Time is not relevant when querying for events, since events are returned by day.
// So you can pass in any arbitary DateTime and you will receive all events for that day.
List<Event> events = compactCalendar.getEvents(1433701251000L); // can also take a Date object
// events has size 2 with the 2 events inserted previously
Log.d(TAG, "Events: " + events);
// define a listener to receive callbacks when certain events happen.
compactCalendarView.setListener(new CompactCalendarView.CompactCalendarViewListener() {
@Override
public void onDayClick(Date dateClicked) {
List<Event> events = compactCalendarView.getEvents(dateClicked);
Log.d(TAG, "Day was clicked: " + dateClicked + " with events " + events);
}
@Override
public void onMonthScroll(Date firstDayOfNewMonth) {
Log.d(TAG, "Month was scrolled to: " + firstDayOfNewMonth);
}
});
}
You can modify indicators using a preset of styles, below is an example, but few other combinations are also possible:
Note that the calendar makes no attempt to de-duplicate events for the same exact DateTime. This is something that you must handle your self if it is important to your use case.
Locale specific settings
It's possible to set the locale so that weekday column names are automatically set by the calendar.
CompactCalendarView compactCalendarView = (CompactCalendarView) findViewById(R.id.compactcalendar_view);
compactCalendarView.setLocale(Locale.CHINESE);
compactCalendarView.setUseThreeLetterAbbreviation(true);
dependencies {
compile 'com.github.sundeepk:compact-calendar-view:3.0.0'
}
The MIT License (MIT)
Copyright (c) [2018] [Sundeepk]
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
Top Related Projects
A Material design back port of Android's CalendarView
A highly customizable calendar view and compose library for Android and Kotlin Multiplatform.
A better calendar for Android
Standalone Android widget for picking a single date from a calendar view.
Android Week View is an android library to display calendars (week view or day view) within the app. It supports custom styling.
Convert designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual Copilot