How to Use Date Picker Components


Table of Contents

Introduction
How to Use General Features
Show Today Button
Show Week Numbers
Set Locale
Set First Day of Week
How to Use the Selection Model
Restrict Users from Selecting Dates
Listen for Selection Changes
Use a Different Selection Mode
How to Use the Date Picker in a JTable

Introduction

Use the JDatePicker class to provide users an easier way to enter dates. A simple approach for entering dates would be to use a date field. But it has the main disadvantage that users may insert dates in an incorrect format while a graphical component shows to the user only what can be done.

Figure 1. Date Picker before and after the button is clicked

Date Picker before and after the button is clicked

Use the JMonthView class to have in view at all times a calendar.

Figure 2. MonthView

MonthView

How to Use General Features

The code snippets presented in this section are taken from GeneralDemo.java file.

Show Today Button

The today button is always displayed in the date picker but in month viewer, its presence is optional. You can show or hide it using the setDisplayToday method. To find out whether it is displayed or not use isDisplayToday method.

monthView.setDisplayToday(todayCheckBox.isSelected());

The DateFormat.SHORT format and the current locale are used to format the current date displayed by the button.

Show Week Numbers

The week numbers are not displayed in the date picker but in month viewer, their presence is optional. You can show or hide it using the setWeekNumbersVisible method. To find out whether it is displayed or not use isWeekNumbersVisible method.

monthView.setWeekNumbersVisible(weekNumbersVisible.isSelected());

Set Locale

Another important feature of the date picker and month viewer is internationalization. By default, they use the system's locale but they can be configured to use any locale. To change their locale, use the setLocale method.

monthView.setLocale(locale);
datePicker.setLocale(locale);

Set First Day of Week

The first day of week is one of the things that change when a new locale is choosen. But sometimes, this change may not be what you want, so we have added the possibility of explicitly specifying this property. For now, this feature is not available in the date picker but only in the month viewer.

monthView.setDowFirst(df.intValue());

You can also change the first day of week by using the MonthModel.

How to Use the Selection Model

When we started to design the date picker components, one of the main objectives was to offer the developers an easy to use API that resembles to the APIs of other Swing components. For this matter we have created the date selection model.

It is a powerful mechanism that lets the developers control how days are selected, which days can be selected and also inform the listeners when the selection changes.

Restrict Users from Selecting Dates

Whether a date can be selected or not, it depends on the date selection model that is used. The DefaultDateSelectionModel is the selection model used by default and it allows all dates to be selected by default. Dates that cannot be selected are called disabled.

The simplest way to disable dates is to use the addDisabled method to specify them. This method is available in DefaultDateSelectionModel and is useful when there is only a set of such dates. Use the removeDisabled method to make a date selectable again.

Another way you can disable some dates is to use a date selection model that imposes the restrictions you want. The following example shows such a model that disables Saturdays and Sundays. All you have to do is to create a date selection model whose isDisabled method returns true for the disabled days. This approach is very usefull whenever the disabled dates follow a certain pattern. We recommend to create a new date selection model based on the DefaultDateSelectionModel.

class NoWeekendDateSelectionModel extends DefaultDateSelectionModel {
  private static Calendar cal = Calendar.getInstance();

  public boolean isDisabled(Date date) {
    cal.setTime(date);
    return (cal.get(Calendar.DAY_OF_WEEK) == Calendar.SATURDAY) || (cal.get(Calendar.DAY_OF_WEEK) == Calendar.SUNDAY);
  }
}

Here is how the month viewer looks when the above selection model is used:

Figure 3. Month View with disabled weekends

Month View with disabled weekends

DisableSelectionDemo.java contains several selection models that show how navigation can be restricted.

Listen for Selection Changes

The following example shows a handler for date selection events.

class DateSelectionHandler extends DateSelectionAdapter {
  private JTextArea messageArea;

  public DateSelectionHandler(JTextArea messageArea) {
    this.messageArea = messageArea;
  }

  public void dateSelectionChanged(DateSelectionEvent evt) {
    messageArea.append("[" + evt.getFirstDate() + ", " + evt.getLastDate() + "]");
    messageArea.append("\n");
  }

  public void selectionModeChanged(DateSelectionEvent evt) {
    JMonthView mv = (JMonthView)evt.getSource();
    DateSelectionModel model = mv.getDateSelectionModel();

    messageArea.append("----------Mode: " + model.getSelectionMode() + "----------");
    messageArea.append("\n");
  }
}

SimpleSelectionDemo.java contains the code presented here.

Use a Different Selection Mode

There are three selection models that you can use:

  • single selection can select only one date at a time

    Figure 4. Single Selection

    Single Selection
    monthView.getDateSelectionModel().setSelectionMode(SelectionMode.SINGLE);
  • single interval can select dates only as a continuous interval

    Figure 5. Single Interval Selection

    Single Interval Selection
    monthView.getDateSelectionModel().setSelectionMode(SelectionMode.SINGLE_INTERVAL);
  • multiple interval can select as many dates as possible

    Figure 6. Multiple Interval Selection

    Multiple Interval Selection
    monthView.getDateSelectionModel().setSelectionMode(SelectionMode.MULTIPLE_INTERVAL);

Use setSelectionMode and getSelectionMode methods from a date selection model in order to specify and determine the selection mode that is used.

How to Use the Date Picker in a JTable

Setting a date picker as a table cell editor is simple, as the following example shows. The bold line of code sets up the date picker as the editor for java.util.Date objects.

table = new JTable();
...
table.setDefaultEditor(Date.class, JDatePicker.createTableCellEditor());

Here is a picture that shows the date picker editor in use:

Figure 7. Date Picker Cell Editor

Date Picker Cell Editor

The previous snippet was taken from TableDemo.