Wednesday, July 13, 2011

How to set the DevExpress ASPxScheduler current time line marker to only appear for the current date

I’ve been using the DevExpress ASPxScheduler with one of our WebForms apps and it’s been a pretty good experience so far. It does pretty much what I need for it to do and I have been able to bend it to do things that I want it to do.

One feature is that it displays a marker on the scheduler to represent the current time.  This is a feature that Outlook does on its calendar and the ASPxScheduler by and large is trying to mirror that experience.  In this case, they behave slightly differently than Outlook.  In Outlook, the time line marker only appears when the calendar time span includes the current date.  If the calendar view does not include the current date, you don’t see that line.

(Image of the scheduler control showing the time marker taken from the online documentation)

With the ASPxScheduler, if you have time line marker enabled, it’s always being displayed, no matter what the date is.  That is a little bit counter intuitive and doesn’t match the Outlook model that DevExpress is trying to following.  As it turns out, it was easy to change that behavior.

You can use the VisibleIntervalChanged event of ASPxScheduler control and make the time line marker behave like Outlook with a single line of code:

protected void ASPxScheduler1_VisibleIntervalChanged(object sender, EventArgs e)
ASPxScheduler1.OptionsBehavior.ShowTimeMarker = ASPxScheduler1.ActiveView.GetVisibleIntervals().Interval.Contains(DateTime.UtcNow.Date.AddMinutes(1));

We use this event to enable the display of the marker when the current date is being displayed by the control, otherwise disable the marker. The call to GetVisibleIntervals().Interval returns TimeInterval object, which is a DevExpress.XtraScheduler class that represents an interval of time for the current scheduler view.  You can use the Contains() method to check if a DateTime or TimeInterval object is contained within the interval.  Internally, the ASPxScheduler uses UTC time, so you want to pass the current date as UTC.  We add 1 minute to the time otherwise the DayView for the previous day will include the current date.

This functionality works for the version of the ASPxScheduler that was current at the time this was written, v2011.1.5.