TCalendarView Custom Painting

The latest version of RAD Studio 10.1 Berlin Anniversary Edition introduced among other things two brand new VCL controls: TCalendarView and TCalendarPicker. Now there is in total 7 different VCL controls in the "Windows 10" category in the Tool Palette.

The best thing about these controls is that they do have Windows 10 look-and-feel, but they are pure VCL, so they do not depend on Windows 10 API and as such can be used for example on Windows 7. I really like to play with them and "TCalendarView" is one of my favorites. There is already quite some information on the Embarcadero Community site about its functionality

• Jim McKeeth has a post on TCalendarView with great graphics explaining different properties
• I have demonstrated how to make TCalendarView data-aware
• Sarina DuPont explains how to use data-binding with TCalendarView

One of the coolest features of "TCalendarView" is that it can be custom painted. For example we may want to paint "Saturdays" and "Sundays" in red color, so our calendar is more readable. In fact it is very easy to achieve. There are three "OnDraw" events that can be used to customise drawing of each three possible views of a calendar

• OnDrawDayItem
• OnDrawMonthItem
• OnDrawYearItem

To make the demo more complete let's also draw in red the current month and the current year. Here is the code.

uses
  System.DateUtils;

procedure TForm3.CalendarView1DrawDayItem(Sender: TObject;
  DrawParams: TDrawViewInfoParams; CalendarViewViewInfo: TCellItemViewInfo);
var d: integer;
begin
  d := DayOfTheWeek(CalendarViewViewInfo.Date);
  if (d = 6) or (d = 7) then
    DrawParams.ForegroundColor := clRed;
end;

procedure TForm3.CalendarView1DrawMonthItem(Sender: TObject;
  DrawParams: TDrawViewInfoParams; CalendarViewViewInfo: TCellItemViewInfo);
begin
  if MonthOf(CalendarViewViewInfo.Date) = CurrentMonth then
    DrawParams.ForegroundColor := clRed;
end;

procedure TForm3.CalendarView1DrawYearItem(Sender: TObject;
  DrawParams: TDrawViewInfoParams; CalendarViewViewInfo: TCellItemViewInfo);
begin
  if YearOf(CalendarViewViewInfo.Date) = CurrentYear then
    DrawParams.ForegroundColor := clRed;
end;

function TForm3.CurrentMonth: word;
var y,m,d: word;
begin
  DecodeDate(Now,y,m,d);
  Result := m;
end;

function TForm3.CurrentYear: integer;
var y,m,d: word;
begin
  DecodeDate(Now,y,m,d);
  Result := y;
end;

This is how our custom painted calendar looks in action.

This architecture is really nice. You can customise the look of the "TCalendarView" VCL component in many creative new ways. Enjoy!