Table of Contents

Navigation and Arrows

TTMSFNCCalendar supports four navigation modes, swipe gestures, custom arrow rendering, and interactive year/month selection popups.

Set Interaction.NavigationMode:

Mode Behaviour
nmMonth Arrows navigate one month at a time (default).
nmYear Arrows navigate one year at a time.
nmFocusedDate Arrows move the focused date one day at a time.
nmCustom Call OnCustomNavigation to implement your own logic. 
TMSFNCCalendar1.Interaction.NavigationMode := nmYear;

Custom navigation

procedure TForm1.FormCreate(Sender: TObject);
begin
  TMSFNCCalendar1.Interaction.NavigationMode := nmCustom;
end;

procedure TForm1.TMSFNCCalendar1CustomNavigation(Sender: TObject;
  ADate, AFocusedDate: TDate; ADirection: Boolean);
begin
  if ADirection then
    TMSFNCCalendar1.Year := TMSFNCCalendar1.Year - 10
  else
    TMSFNCCalendar1.Year := TMSFNCCalendar1.Year + 10;
end;

ADirection = True means the right (forward) arrow was pressed; False means the left (back) arrow.

Swipe on header

TMSFNCCalendar1.Interaction.SwipeOnHeader := True;

When enabled, swiping left/right on the header area also triggers navigation.

Arrow types

Change the left and right arrow style via Header.Arrow.ArrowLeftType and Header.Arrow.ArrowRightType:

Type Appearance
atArrow Chevron arrow (default).
atTriangle Filled triangle.
atBitmap Custom bitmap. Assign Header.Arrow.ArrowLeftBitmap / ArrowRightBitmap.
atCustom Fully custom — implement OnCustomArrowDraw.
Custom arrow styles on the calendar header

Custom arrow drawing

procedure TForm1.FormCreate(Sender: TObject);
begin
  TMSFNCCalendar1.Header.Arrow.ArrowLeftType  := atCustom;
  TMSFNCCalendar1.Header.Arrow.ArrowRightType := atCustom;
end;

procedure TForm1.TMSFNCCalendar1CustomArrowDraw(Sender: TObject;
  AGraphics: TTMSFNCGraphics; ARect: TRectF; ADirection: Boolean);
var
  pl, pr: TPointF;
  h, m: Single;
begin
  h  := ARect.Bottom - ARect.Top;
  pl := PointF(ARect.Left,  ARect.Top + h / 2);
  pr := PointF(ARect.Right, ARect.Top + h / 2);
  m  := ARect.Left + (ARect.Right - ARect.Left) / 2;
  AGraphics.Stroke.Width := 2;
  if ADirection then
  begin
    AGraphics.DrawLine(PointF(m, ARect.Top), pl);
    AGraphics.DrawLine(pl, PointF(m, ARect.Bottom));
    AGraphics.DrawLine(pl, pr);
  end
  else
  begin
    AGraphics.DrawLine(PointF(m, ARect.Top), pr);
    AGraphics.DrawLine(PointF(m, ARect.Bottom), pr);
    AGraphics.DrawLine(pr, pl);
  end;
end;
Calendar with custom-drawn arrows

Year and month selection popups

Enable clicking the year or month text in the header to open a selector popup:

TMSFNCCalendar1.Interaction.AllowYearSelection  := True;
TMSFNCCalendar1.Interaction.AllowMonthSelection := True;

Configure the year popup via Interaction.YearOptions. Subscribe to OnBeforeShowYearPopup or OnBeforeShowMonthPopup to act before the popup appears.

Programmatic navigation

TMSFNCCalendar1.Date  := EncodeDate(2025, 6, 15);  // jump to a date
TMSFNCCalendar1.Month := 3;   // jump to March in the current year
TMSFNCCalendar1.Year  := 2026;

Navigation utilities:

TMSFNCCalendar1.Date := TMSFNCCalendar1.NextMonth;
TMSFNCCalendar1.Date := TMSFNCCalendar1.PreviousMonth;
TMSFNCCalendar1.Date := TMSFNCCalendar1.NextYear;

See also