Vaadin Calendar

Interaction

The date and week captions, as well as events, are clickable and the clicks can be listened for by the server. Also date/time range selections, event dragging, and event resizing can be listened by the server. Using the API, you have full control over the events caused by user interaction.

The weekly view has navigation buttons to navigate forward and backward in time. These actions are also listened by the server. Custom navigation can be implemented using event handlers, as described in Section 18.9, “Customizing the Calendar”.

18.2. Installing Calendar

Vaadin Calendar is available for download from Vaadin Directory and from a Maven repository. Installing the add-on is the same as with Vaadin add-ons in general, so please refer to Chapter 17, Using Vaadin Add-ons. Vaadin Calendar includes a widget set, which you need to compile to your project widget set.

Calendar will be included in Vaadin core framework in Vaadin 7.1.

Vaadin Calendar is distributed under the Apache License version 2.0.

18.3. Basic Use

A Calendar is created just like any other Vaadin component. The component has undefined size by default and you usually want to give it a fixed or relative size, for example as follows.

Calendar cal = new Calendar("My Calendar"); cal.setWidth("600px"); cal.setHeight("300px");

You need to define a time range for the calendar, as described in the following subsection. The time range also controls the view mode of the calendar; whether it is a daily, weekly, or monthly view. You also need to provide events for the calendar, for which there are several ways.

18.3.1. Setting the Date Range

The view mode is controlled by the date range of the calendar. The weekly view is the default view mode.You can change the range by setting start and end dates for the calendar. The range must be between one and 60 days.

In the following, we set the calendar to show only one day, which is the current day.

cal.setStartDate(new Date()); cal.setEndDate(new Date());

Notice that although the range we set above is actually zero time long, the calendar still renders the time from 00:00 to 23:59. This is normal, as the Vaadin Calendar is guaranteed to render at least the date range provided, but may expand it. This behaviour is important to notice when we implement our own event providers.

18.3.2. Adding and Managing Events

The first thing the you will probably notice about the Calendar is that it is rather empty at first. The Calendar allows three different ways to add events:

396	Interaction