Calendar Component

Calendar component displays items in a monthly calendar view

View larger

Close

View larger

Close

Calendar Component
Calendar component displays items in a monthly calendar view

Features

• Populate items either by setItems methods, or extending AbstractCalendarDataProvider
• Apply themes to the displayed items (blue, green, red, gray)
• Provides a listener for item click events

Sample code

calendar = new CalendarComponent<EventData>()
    .withItemDateGenerator(e -> e.getDate())
    .withItemLabelGenerator(e -> e.getLabel())
    .withItemThemeGenerator(e -> e.getTheme());
calendar.setItems(new EventData(new Date(), "Sample Event", CalendarItemTheme.LightGreen));
calendar.addEventClickListener(evt -> Notification.show(evt.getDetail().getLabel()));

calendar = new CalendarComponent<EventData>().withItemDateGenerator(e -> e.getDate())
    .withItemLabelGenerator(e -> e.getLabel())
    .withItemThemeGenerator(e -> e.getTheme());
calendar.setDataProvider(new CustomDataProvider());
calendar.addEventClickListener(evt -> Notification.show(evt.getDetail().getLabel()));
    add(calendar);

// Custom Data Provider
public class CustomDataProvider extends AbstractCalendarDataProvider<DemoView.EventData> {
  @Override
  public Collection<DemoView.EventData> getItems(Date fromDate, Date toDate) {
    List<DemoView.EventData> events = new ArrayList<>();
    events.add(new EventData(new Date(), "Sample Event", CalendarItemTheme.Gray));
    return events;
  }
}

Links

• Source Code

Compatibility