Click here to Skip to main content
12,500,884 members (45,592 online)
Click here to Skip to main content
Add your own
alternative version

Stats

1.3M views
76.4K downloads
631 bookmarked
Posted

A Professional Calendar/Agenda View That You Will Use

, 27 Aug 2009 LGPL3
Rate this:
Please Sign up or sign in to vote.
An Outlook style calendar view with appointments and all-day events, and multiple day view support.

Introduction

As you can see in the screenshots, this is a fully capable calendar view for specifying appointments and all day events. It has several features so you can control what happens inside, like item blocking and item-oriented events.

It's 100% managed code! No resources; as with most of my projects, you can just include all the source files into your project to make it work.

Background

I found a couple of controls like this, but as always, they don't meet my needs, so here I come. It performs fairly well, but mostly will depend on your implementation - I'll explain that in the next section.

Using the Code

To add a calendar to your form, just drag the Calendar control. It's located under the System.Widows.Forms.Calendar namespace.

When to Use it

It can be used to display any information that is based on a date, not just appointments and meetings. Think about it, on what ugly control do you display your system log?

Controlling the View

The view of the Calendar is given by a date range provided by the ViewStart and ViewEnd properties. Depending on the number of days between these two dates, the calendar will draw them.

The Calendar can show days in two modes: Expanded and Short (see Calendar.DaysMode). Expanded is the style of the first screenshot: the days are shown in a column, and items are placed in the time they belong; while the Short mode (second screenshot) shows days on week rows, and items are shown in a more compact way.

An important property here is MaximumFullDays (by default, 8). This property indicates that when you specify a view of 8 days or less, the days will be shown in Expanded mode. Any more days will be displayed in Short mode.

Feeding Items to the Calendar

The calendar tells you when to add items to it with the LoadItems event. In that event, you should manage to bring information to display in the calendar, by adding items to the Items collection of the calendar. The event is raised every time the view changes. I strongly suggest that you use caching and not query the database every time this event is raised, because performance will be severely affected.

The demo project in the source loads items from a memory array, so it's not the best example.

private void calendar1_LoadItems(object sender, CalendarLoadEventArgs e)
{
    //Load items whose date range intersects e.DateStart and e.DateEnd
    foreach(CalendarItem item in loadedItems)
    {
         calendar1.Items.Add(item);
    }
 
    //Or even better....
    calendar1.Items.AddRange(loadedItems);
}

I strongly suggest to add items that only intersect with the calendar's view range. You can learn how to check date intersection by taking a look at the implementation of DateIntersects, in Calendar:

public static bool DateIntersects(DateTime startA, DateTime endA, 
                                  DateTime startB, DateTime endB)
{
     //Don't forget to check dates this way in your database queries!
     return startB < endA && startA < endB;
}

Events

Since you can explore other members using IntelliSense I list events here; they are important because they let you control your application of the Calendar.

  • DayHeaderClick: Occurs when a day header is clicked.
  • ItemClick: Occurs when an item is clicked.
  • ItemCreated: Occurs when an item is successfully created.
  • ItemCreating: Occurs when the user is about to create an item. It can be cancelled.
  • ItemDatesChanged: Occurs when the date range of an item changes.
  • ItemDeleted: Occurs when an item is successfully deleted.
  • ItemDeleting: Occurs when the user is about to delete an item. It can be cancelled.
  • ItemDoubleClick: Occurs when an item is double clicked.
  • ItemMouseHover: Occurs when the mouse is placed over an item.
  • ItemSelected: Occurs when an item is selected.
  • ItemTextEdited: Occurs when an item's text is edited by the user.
  • ItemTextEditing: Occurs when the user is trying to edit an item's text. It can be cancelled.
  • LoadItems: Occurs when the Calendar view is changed.

Some Nice Features

Items Overlapping

When items intersect in their date ranges, there's a nice algorithm that performs a layout to accommodate them. Give it a try.

Item Coloring

Although a Renderer takes charge of drawing items, you can specify the background colors and borders to items individually.

Even better, you can use the ApplyColor method (in CalendarItem) to an item, and the code will take charge of shading colors for the background, border, and text.

In the demo application, use the calendar's contextual menu to apply coloring to items.

TimeScale

You can choose between options of time scaling, though, the default is 30 minutes like Outlook's calendar. Here is a sample of a 15 minutes timescale.

In the demo application, use the calendar's contextual menu to choose different timescale options.

MonthViewControl

Don't you absolutely hate the way the MonthCalendar control behaves on your UI? Well, here is the solution. Now, the project contains a control called MonthView, which looks like the Outlook calendar's view, fully customizable, and it does not force the size of the control; the visualization of months will depend on the size of the container.

Some interesting properties of the control are:

  • FirstDayOfWeek - To change what day your weeks start with.
  • ItemPadding - To set the padding of the internal items, so you can make a compact or not so much view.
  • SelectionMode - Manual, Day, Week, WorkWeek, and Month.
  • WorkWeekStart - To specify what day the work-weeks start with.
  • WorkWeekEnd - To specify what day the work-weeks end with.

History

  • Aug 02 2009: First release.
  • Aug 05 2009
    • License changed to LGPL.
    • Added the FirstDayOfWeek property to change what day your weeks start with.
    • Added the Tag property to CalendarItem.
  • Aug 27 2009
    • Added minute exact indicators.
    • Added keyboard arrows support.
    • Added Image and ImageAlign properties to CalendarItem for adding images to items.
    • Added Pattern and PatternColor properties to CalendarItem for marking items with textures.
    • Added the MonthView control to have a nice calendar control.

License

This article, along with any associated source code and files, is licensed under The GNU Lesser General Public License (LGPLv3)

Share

About the Author

Jose Menendez Póo
Team Leader
Mexico Mexico
I'm in game programming now: https://itunes.apple.com/us/app/ugly-aliens-training-center/id859271884?ls=1&mt=8

Jose Manuel Menéndez Poó

- I've been programming Windows and Web apps since 1997.
- My greatest concern nowadays is user interface usability.

Questions and stuff by twitter: @menendezpoo

Blog
menendezpoo.com

You may also be interested in...

Pro
Pro

Comments and Discussions

 
AnswerRe: Error selecting days in Expanded View Pin
orthimnas26-Sep-11 7:00
memberorthimnas26-Sep-11 7:00 
QuestionDownloading Data from SQL Pin
Danny Hulmston8-Jun-11 4:51
memberDanny Hulmston8-Jun-11 4:51 
GeneralWhat is the easiest way to prevent overlapping items? Pin
donalr7-Jun-11 12:13
memberdonalr7-Jun-11 12:13 
GeneralRe: What is the easiest way to prevent overlapping items? Pin
Jose Menendez Póo7-Jun-11 12:19
memberJose Menendez Póo7-Jun-11 12:19 
GeneralASP.NET Compatible ? Pin
Member 79743681-Jun-11 23:37
memberMember 79743681-Jun-11 23:37 
GeneralRe: ASP.NET Compatible ? Pin
Jose Menendez Póo7-Jun-11 12:16
memberJose Menendez Póo7-Jun-11 12:16 
GeneralBug on the OnKeyPress() Event Pin
ousoonerjoe4-May-11 11:41
memberousoonerjoe4-May-11 11:41 
QuestionWanted this with a modification Pin
Member 78809924-May-11 8:56
memberMember 78809924-May-11 8:56 
GeneralMy vote of 5 Pin
itsho21-Mar-11 11:40
memberitsho21-Mar-11 11:40 
GeneralDrag Drop Event. Pin
egemend11-Mar-11 1:31
memberegemend11-Mar-11 1:31 
GeneralRe: Drag Drop Event. Pin
Kim Togo20-Apr-11 0:27
memberKim Togo20-Apr-11 0:27 
GeneralRe: Drag Drop Event. Pin
FrankNedz11-Jul-12 9:25
memberFrankNedz11-Jul-12 9:25 
GeneralRe: Drag Drop Event. Pin
FrankNedz11-Jul-12 10:01
memberFrankNedz11-Jul-12 10:01 
GeneralRe: Drag Drop Event. Pin
Kim Togo11-Jul-12 20:31
memberKim Togo11-Jul-12 20:31 
Glad you found a solution. And yes, the link I posted is not working any more ?.
GeneralMy vote of 5 Pin
rodrilobo0210-Mar-11 12:24
memberrodrilobo0210-Mar-11 12:24 
Generalvisual studio 2010 Pin
kancerman7-Mar-11 18:14
memberkancerman7-Mar-11 18:14 
GeneralRe: visual studio 2010 Pin
Kim Togo15-Apr-11 8:15
memberKim Togo15-Apr-11 8:15 
Questioncalendar.item.clear [modified] Pin
dinakl2121-Feb-11 23:05
memberdinakl2121-Feb-11 23:05 
AnswerRe: calendar.item.clear [modified] Pin
Boris Evstatiev13-Oct-11 3:21
memberBoris Evstatiev13-Oct-11 3:21 
GeneralChange Color for specific days Pin
Julien_6213-Feb-11 20:15
memberJulien_6213-Feb-11 20:15 
GeneralRe: Change Color for specific days Pin
Member 310368529-Sep-11 23:59
memberMember 310368529-Sep-11 23:59 
Generalshow time on cells [modified] Pin
hugui097-Feb-11 6:48
memberhugui097-Feb-11 6:48 
GeneralBug in CalendarRendererBoxEventArgs constructors Pin
Nicolas Stuardo3-Feb-11 4:34
memberNicolas Stuardo3-Feb-11 4:34 
GeneralRe: Bug in CalendarRendererBoxEventArgs constructors Pin
Kim Togo20-Apr-11 0:35
memberKim Togo20-Apr-11 0:35 
GeneralThemes Pin
Angelo Cresta2-Feb-11 4:52
memberAngelo Cresta2-Feb-11 4:52 
General15 min height Pin
Ernest Bariq30-Jan-11 5:00
memberErnest Bariq30-Jan-11 5:00 
GeneralMy vote of 5 Pin
Rhut18-Jan-11 23:06
memberRhut18-Jan-11 23:06 
QuestionHow to read items at a given date Pin
Member 228177117-Jan-11 12:58
memberMember 228177117-Jan-11 12:58 
AnswerRe: How to read items at a given date Pin
Kim Togo20-Apr-11 0:48
memberKim Togo20-Apr-11 0:48 
GeneralTooltip Pin
Leviathan6613-Jan-11 22:30
memberLeviathan6613-Jan-11 22:30 
Generalmy vote is 5 , What about rendering to MonoCalender style Pin
Member 228177111-Jan-11 11:34
memberMember 228177111-Jan-11 11:34 
GeneralMy vote of 5 Pin
shuigang5-Jan-11 18:29
membershuigang5-Jan-11 18:29 
GeneralDate Changing and hour Pin
kdkllr25-Nov-10 7:46
memberkdkllr25-Nov-10 7:46 
GeneralRe: Date Changing and hour Pin
shuigang2-Dec-10 21:19
membershuigang2-Dec-10 21:19 
GeneralRe: Date Changing and hour Pin
Kim Togo15-Apr-11 8:20
memberKim Togo15-Apr-11 8:20 
GeneralAdding some other calendar to this nice control Pin
Meysam Javdi15-Nov-10 1:10
memberMeysam Javdi15-Nov-10 1:10 
GeneralMy vote of 5 Pin
kdkllr12-Nov-10 4:50
memberkdkllr12-Nov-10 4:50 
Questionit can be printed?? Pin
kdkllr12-Nov-10 4:26
memberkdkllr12-Nov-10 4:26 
AnswerRe: it can be printed?? Pin
jyuzakumo15-Feb-13 3:46
memberjyuzakumo15-Feb-13 3:46 
GeneralWrite and read a label on each "time" (consider a interval of 10 minutes) of each day Pin
Giacomo Vezzani10-Nov-10 21:05
memberGiacomo Vezzani10-Nov-10 21:05 
GeneralRe: Write and read a label on each "time" (consider a interval of 10 minutes) of each day Pin
chenliang.xf11-Jan-11 21:29
memberchenliang.xf11-Jan-11 21:29 
GeneralRe: Write and read a label on each "time" (consider a interval of 10 minutes) of each day Pin
Giacomo Vezzani11-Jan-11 22:50
memberGiacomo Vezzani11-Jan-11 22:50 
GeneralBug with context menu Pin
longiemweb27-Sep-10 17:11
memberlongiemweb27-Sep-10 17:11 
GeneralRe: Bug with context menu Pin
shuigang29-Sep-10 20:04
membershuigang29-Sep-10 20:04 
GeneralRe: Bug with context menu Pin
Enriad29-Sep-10 20:12
memberEnriad29-Sep-10 20:12 
GeneralRe: Bug with context menu [My vote of 5] Pin
Arnaud Dovi29-Mar-12 4:09
memberArnaud Dovi29-Mar-12 4:09 
QuestionHow to scroll calendar to certain hour... Pin
gamisterio24-Sep-10 20:02
membergamisterio24-Sep-10 20:02 
AnswerRe: How to scroll calendar to certain hour... Pin
gamisterio25-Sep-10 6:18
membergamisterio25-Sep-10 6:18 
GeneralRe: How to scroll calendar to certain hour... Pin
Kim Togo4-Oct-10 4:00
memberKim Togo4-Oct-10 4:00 
GeneralRe: How to scroll calendar to certain hour... Pin
007up1-Nov-10 12:30
member007up1-Nov-10 12:30 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Terms of Use | Mobile
Web01 | 2.8.160919.1 | Last Updated 27 Aug 2009
Article Copyright 2009 by Jose Menendez Póo
Everything else Copyright © CodeProject, 1999-2016
Layout: fixed | fluid