Android-Week-View

Android Week View is an android library to display calendars (week view or day view) within the app. It supports custom styling.

3,417

1,228

3,417

201

View on GitHub

Top Related Projects

Calendar

4,634

A highly customizable calendar view and compose library for Android and Kotlin Multiplatform.

material-calendarview

5,916

A Material design back port of Android's CalendarView

CompactCalendarView

1,521

An android library which provides a compact calendar view much like the one used in google calenders.

android-times-square

4,444

Standalone Android widget for picking a single date from a calendar view.

Quick Overview

Android-Week-View is an Android library that provides a customizable week view widget for displaying and managing events. It offers a clean and intuitive interface for users to view and interact with events across different days and times, similar to popular calendar applications.

Pros

Highly customizable appearance and behavior
Smooth scrolling and zooming capabilities
Supports both single-day and multi-day views
Easy integration with existing Android projects

Cons

Limited documentation and examples for advanced use cases
May require additional effort to implement complex event handling
Performance can degrade with a large number of events
Some reported issues with handling time zones and daylight saving time

Code Examples

Adding the WeekView to your layout:

<com.alamkanak.weekview.WeekView
    android:id="@+id/weekView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:eventTextColor="@android:color/white"
    app:textSize="12sp"
    app:hourHeight="60dp"
    app:headerColumnPadding="8dp"
    app:headerColumnTextColor="#8f000000"
    app:headerRowPadding="12dp"
    app:columnGap="8dp"
    app:noOfVisibleDays="3"
    app:headerRowBackgroundColor="#ffefefef"
    app:dayBackgroundColor="#05000000"
    app:todayBackgroundColor="#1848adff"
    app:headerColumnBackground="#ffffffff"/>

Implementing the WeekView.EventClickListener interface:

class MainActivity : AppCompatActivity(), WeekView.EventClickListener {
    override fun onEventClick(event: WeekViewEvent, eventRect: RectF) {
        Toast.makeText(this, "Clicked " + event.name, Toast.LENGTH_SHORT).show()
    }
}

Adding events to the WeekView:

val events = mutableListOf<WeekViewEvent>()
val startTime = Calendar.getInstance()
startTime.set(Calendar.HOUR_OF_DAY, 3)
startTime.set(Calendar.MINUTE, 0)
val endTime = startTime.clone() as Calendar
endTime.add(Calendar.HOUR, 1)

val event = WeekViewEvent(1, "Event", startTime, endTime)
event.color = Color.RED
events.add(event)

weekView.events = events

Getting Started

Add the dependency to your app's build.gradle file:

dependencies {
    implementation 'com.github.alamkanak:android-week-view:1.2.6'
}

Add the WeekView to your layout XML file (see example in Code Examples section).
In your Activity or Fragment, initialize the WeekView and set up event listeners:

class MainActivity : AppCompatActivity(), WeekView.EventClickListener, MonthLoader.MonthChangeListener {
    private lateinit var weekView: WeekView

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        weekView = findViewById(R.id.weekView)
        weekView.eventClickListener = this
        weekView.monthChangeListener = this
    }

    override fun onEventClick(event: WeekViewEvent, eventRect: RectF) {
        // Handle event click
    }

    override fun onMonthChange(newYear: Int, newMonth: Int): List<WeekViewEvent> {
        // Return events for the given month
        return emptyList()
    }
}

Competitor Comparisons

Calendar

4,634

A highly customizable calendar view and compose library for Android and Kotlin Multiplatform.

Pros of Calendar

More flexible layout options, including custom day cells and headers
Supports both vertical and horizontal scrolling
Better Kotlin support with coroutines and Flow

Cons of Calendar

Less focused on week view specifically
May require more customization for complex week layouts
Newer library with potentially fewer community resources

Code Comparison

Calendar:

val calendarView = CalendarView(context)
calendarView.dayBinder = object : DayBinder<DayViewContainer> {
    override fun create(view: View) = DayViewContainer(view)
    override fun bind(container: DayViewContainer, day: CalendarDay) {
        container.textView.text = day.date.dayOfMonth.toString()
    }
}

Android-Week-View:

WeekView weekView = findViewById(R.id.weekView);
weekView.setOnEventClickListener((event, eventRect) -> {
    // Handle event click
});
weekView.setMonthChangeListener((newYear, newMonth) -> {
    // Fetch and return events for the new month
});

Both libraries offer easy-to-use APIs for creating calendar views, but Calendar provides more flexibility in terms of customization and layout options. Android-Week-View is more focused on week-specific functionality out of the box. Calendar's Kotlin-first approach may be preferable for modern Android development, while Android-Week-View's established presence might offer more community support and resources.

material-calendarview

5,916

A Material design back port of Android's CalendarView

Pros of material-calendarview

More customizable appearance with Material Design principles
Supports both single-date and date-range selection
Easier integration for basic calendar functionality

Cons of material-calendarview

Limited to monthly view, lacks week or day views
Less suitable for complex scheduling or event management

Code Comparison

material-calendarview:

MaterialCalendarView calendarView = findViewById(R.id.calendarView);
calendarView.setOnDateSelectedListener(new OnDateSelectedListener() {
    @Override
    public void onDateSelected(@NonNull MaterialCalendarView widget, @NonNull CalendarDay date, boolean selected) {
        // Handle date selection
    }
});

Android-Week-View:

WeekView weekView = findViewById(R.id.weekView);
weekView.setOnEventClickListener(new WeekView.EventClickListener() {
    @Override
    public void onEventClick(WeekViewEvent event, RectF eventRect) {
        // Handle event click
    }
});

Summary

material-calendarview is better suited for simple date selection and display with a focus on Material Design aesthetics. Android-Week-View offers more advanced scheduling features and multiple view options, making it more appropriate for complex calendar applications. The choice between the two depends on the specific requirements of the project, with material-calendarview being easier to implement for basic needs and Android-Week-View providing more flexibility for detailed scheduling.

CompactCalendarView

1,521

An android library which provides a compact calendar view much like the one used in google calenders.

Pros of CompactCalendarView

Lightweight and focused on monthly view, making it easier to implement for simple calendar needs
Supports custom event indicators and color customization out of the box
Smoother scrolling and better performance for large datasets

Cons of CompactCalendarView

Limited to monthly view only, lacking week and day views
Less flexibility for complex event rendering and time-based scheduling
Fewer customization options for individual day cells and overall layout

Code Comparison

CompactCalendarView:

CompactCalendarView compactCalendarView = (CompactCalendarView) findViewById(R.id.compactcalendar_view);
Event ev1 = new Event(Color.GREEN, 1433701251000L, "Some event");
compactCalendarView.addEvent(ev1);

Android-Week-View:

WeekView mWeekView = (WeekView) findViewById(R.id.weekView);
WeekViewEvent event = new WeekViewEvent(1, "Event", startTime, endTime);
mWeekView.addEvent(event);

Both libraries offer simple ways to add events, but Android-Week-View provides more granular control over event timing and duration, while CompactCalendarView focuses on date-based events with simpler customization options.

Caldroid

1,417

A better calendar for Android

Pros of Caldroid

More customizable appearance with support for custom cell views and styles
Easier integration with existing Android projects due to its fragment-based approach
Better support for date range selection and highlighting

Cons of Caldroid

Less performant for large date ranges or complex views
Limited support for week view functionality
Fewer built-in event handling options compared to Android-Week-View

Code Comparison

Caldroid:

CaldroidFragment caldroidFragment = new CaldroidFragment();
Bundle args = new Bundle();
Calendar cal = Calendar.getInstance();
args.putInt(CaldroidFragment.MONTH, cal.get(Calendar.MONTH) + 1);
args.putInt(CaldroidFragment.YEAR, cal.get(Calendar.YEAR));
caldroidFragment.setArguments(args);

Android-Week-View:

WeekView mWeekView = (WeekView) findViewById(R.id.weekView);
mWeekView.setOnEventClickListener(this);
mWeekView.setMonthChangeListener(this);
mWeekView.setEventLongPressListener(this);

Both libraries offer calendar functionality for Android applications, but they focus on different aspects. Caldroid provides a more traditional monthly calendar view with extensive customization options, while Android-Week-View specializes in a week-based view with better support for event handling and performance optimizations for larger datasets.

android-times-square

4,444

Standalone Android widget for picking a single date from a calendar view.

Pros of android-times-square

Simpler implementation focused on month-based calendar view
Easier to integrate for basic date selection needs
Lightweight and less resource-intensive

Cons of android-times-square

Limited to monthly view, lacks week and day views
Less customizable compared to Android-Week-View
Fewer features for complex scheduling scenarios

Code Comparison

Android-Week-View:

WeekView weekView = findViewById(R.id.weekView);
weekView.setOnEventClickListener(this);
weekView.setMonthChangeListener(this);
weekView.setEventLongPressListener(this);

android-times-square:

CalendarPickerView calendar = findViewById(R.id.calendar_view);
Date today = new Date();
calendar.init(today, nextYear.getTime())
    .inMode(CalendarPickerView.SelectionMode.SINGLE);

Android-Week-View offers more flexibility with event handling and customization, while android-times-square provides a simpler API for basic date selection. Android-Week-View is better suited for complex scheduling applications, whereas android-times-square is ideal for straightforward date picking functionality in apps that don't require detailed time-based views or extensive customization.

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

README

Android Week View

Android Week View is an android library to display calendars (week view or day view) within the app. It supports custom styling.

Features

Week view calendar
Day view calendar
Custom styling
Horizontal and vertical scrolling
Infinite horizontal scrolling
Live preview of custom styling in xml preview window

Who uses it

Series Addict
Using the library? Just tweet me or send me an email.

Usage

Import the library into your project.

Grab via maven

<dependency>
  <groupId>com.github.alamkanak</groupId>
  <artifactId>android-week-view</artifactId>
  <version>1.2.6</version>
  <type>aar</type>
</dependency>

Grab via gradle

compile 'com.github.alamkanak:android-week-view:1.2.6'

Add WeekView in your xml layout.

<com.alamkanak.weekview.WeekView
        android:id="@+id/weekView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:eventTextColor="@android:color/white"
        app:textSize="12sp"
        app:hourHeight="60dp"
        app:headerColumnPadding="8dp"
        app:headerColumnTextColor="#8f000000"
        app:headerRowPadding="12dp"
        app:columnGap="8dp"
        app:noOfVisibleDays="3"
        app:headerRowBackgroundColor="#ffefefef"
        app:dayBackgroundColor="#05000000"
        app:todayBackgroundColor="#1848adff"
        app:headerColumnBackground="#ffffffff"/>

Write the following code in your java file.

// Get a reference for the week view in the layout.
mWeekView = (WeekView) findViewById(R.id.weekView);

// Set an action when any event is clicked.
mWeekView.setOnEventClickListener(mEventClickListener);

// The week view has infinite scrolling horizontally. We have to provide the events of a
// month every time the month changes on the week view.
mWeekView.setMonthChangeListener(mMonthChangeListener);

// Set long press listener for events.
mWeekView.setEventLongPressListener(mEventLongPressListener);

Implement WeekView.MonthChangeListener, WeekView.EventClickListener, WeekView.EventLongPressListener according to your need.

Provide the events for the WeekView in WeekView.MonthChangeListener.onMonthChange() callback. Please remember that the calendar pre-loads events of three consecutive months to enable lag-free scrolling.

MonthLoader.MonthChangeListener mMonthChangeListener = new MonthLoader.MonthChangeListener() {
    @Override
    public List<WeekViewEvent> onMonthChange(int newYear, int newMonth) {
        // Populate the week view with some events.
        List<WeekViewEvent> events = getEvents(newYear, newMonth);
        return events;
    }
};

Customization

You can customize the look of the WeekView in xml. Use the following attributes in xml. All these attributes also have getters and setters to enable you to change the style dynamically.

allDayEventHeight
columnGap
dayBackgroundColor
dayNameLength
eventMarginVertical
eventPadding
eventTextColor
eventTextSize
firstDayOfWeek
headerColumnBackground
headerColumnPadding
headerColumnTextColor
headerRowBackgroundColor
headerRowPadding
hourHeight
hourSeparatorColor
hourSeparatorHeight
noOfVisibleDays
overlappingEventGap
textSize
todayBackgroundColor
todayHeaderTextColor
showDistinctPastFutureColor
futureBackgroundColor
pastBackgroundColor
showDistinctWeekendColor
futureWeekendBackgroundColor
pastWeekendBackgroundColor
showNowLine
nowLineColor
nowLineThickness
scrollDuration

Interfaces

Use the following interfaces according to your need.

mWeekView.setWeekViewLoader() to provide events to the calendar
mWeekView.setMonthChangeListener() to provide events to the calendar by months
mWeekView.setOnEventClickListener() to get a callback when an event is clicked
mWeekView.setEventLongPressListener() to get a callback when an event is long pressed
mWeekView.setEmptyViewClickListener() to get a callback when any empty space is clicked
mWeekView.setEmptyViewLongPressListener() to get a callback when any empty space is long pressed
mWeekView.setDateTimeInterpreter() to set your own labels for the calendar header row and header column
mWeekView.setScrollListener() to get an event every time the first visible day has changed

Sample

There is also a sample app to get you started.

To do

Add event touch feedback selector
Show events that expand multiple days properly

Changelog

Version 1.2.6

Add empty view click listener
Fix padding bug
Fix bug when setting colors of different components
Add ability to turn off fling gesture
Add example of how to load events asynchronously in the sample app

Version 1.2.5

Add support for using subclasses of WeekViewEvent
Fix scroll animation
Add support for semi-transparent header colors

Version 1.2.4

NOTE: If you are using WeekView.MonthChangeListener, make sure to change it into MonthLoader.MonthChangeListener
Add support to have loaders other than MonthViewLoader
Add pinch to zoom support
Add support for location
Add ability to have different colors for past, future, weekend days
Add support for "now" line

Version 1.2.3

Get callbacks when scrolling horizontally
goToHour and goToDate methods has been fixed
Use getFirstVisibleHour method to get the first visible hour in the week view

Version 1.2.1

Better scrolling added
Get callbacks when empty view is tapped/long pressed
Control the speed of scrolling
Support for multiple language added
Ability to set your own interpreter for header row and column added

Version 1.1.7

You can now dynamically scroll to an hour of your preference.

Version 1.1.6

Added support for events that expands to multiple days

Version 1.1.5

A bug related to overlapping events fixed
You can now programmatically get first and last visible day in the week view

Version 1.1.4

Small bug fixed

Version 1.1.3

Margins support added for overlapping events

Version 1.1.2

Small bugs fixed
Hour separator inconsistency fixed

Version 1.1.1

Overlapping event bug fixed

Version 1.1.0

Added support for overlapping events

License

Copyright 2014 Raquib-ul-Alam

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

   http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.

Top Related Projects

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