Time Scales

Jul 11, 2025
3 minutes to read

Overview

The Time Scale elements are inherent to the Timeline View. They appear as rulers with different time scales above the time cell area. The appointment’s position on the time line can be recognized with the help of these elements.

Time scales are contained within the collection accessible by using the TimelineView.Scales property.

Built-in Time Scales

The following built-in classes representing the time scales are available:

The visual appearance of time scale elements can be customized via the TimeScale.DisplayFormat and TimeScale.Width properties. To hide a specific time scale use the TimeScale.Visible property.

You can specify a custom set of scales by clearing the time scale collection and populating it with required scales.

Custom Scales

To create a time scale with an arbitrary fixed interval, create the TimeScaleFixedInterval class instance by using a constructor with a parameter that is the required time interval. The following snippet illustrates how to add a 30 minutes time scale.

C#
VB.NET

csharp

using DevExpress.XtraScheduler;
// ...
TimeScaleFixedInterval scale30Minutes = new TimeScaleFixedInterval(TimeSpan.FromMinutes(30));
schedulerControl1.TimelineView.Scales.Add(scale30Minutes);

Imports DevExpress.XtraScheduler
' ...
Private scale30Minutes As New TimeScaleFixedInterval(TimeSpan.FromMinutes(30))
schedulerControl1.TimelineView.Scales.Add(scale30Minutes)

You can define classes that inherit from standard time scales. Do this to create custom scales with unique settings. For instance, in the code sample below, the custom MyCustomScale class overrides the TimeScale.IsDateVisible(DateTime) method to hide non-working hours: 2 p.m. plus the 7 p.m. ~ 8 a.m. interval.

C#
VB.NET

csharp

public partial class Form1 : RibbonForm {
    public Form1() {
        InitializeComponent();
        //. . .
        MyCustomScale myScale = new MyCustomScale();
        schedulerControl.TimelineView.Scales.Add(myScale);
        schedulerControl.TimelineView.Scales.Last().Width = 100;
        //. . .
    }
}
public class MyCustomScale : TimeScaleHour
{
    public MyCustomScale() {}

    public override string DisplayName { get => "Custom Work Hours"; set => base.DisplayName = value; }
    public override string MenuCaption { get => "Custom Work Hours"; set => base.MenuCaption = value; }

    public override string FormatCaption(DateTime start, DateTime end)
    {
        if (start.Hour <= 12) return start.Hour.ToString() + " AM";
        else return (start.Hour - 12).ToString() + " PM";
    }
    public override bool IsDateVisible(DateTime date)
    {
        if (date.Hour >= 8 && date.Hour <= 18)
            return !(date.Hour == 14);
        else return false;
    }
}

Partial Public Class Form1
    Inherits RibbonForm

    Public Sub New()
        InitializeComponent()
        '. . .
        Dim myScale As New MyCustomScale()
        schedulerControl.TimelineView.Scales.Add(myScale)
        schedulerControl.TimelineView.Scales.Last().Width = 100
        '. . .
    End Sub
End Class
Public Class MyCustomScale
    Inherits TimeScaleHour

    Public Sub New()
    End Sub

    Public Overrides Property DisplayName() As String
        Function(get) "Custom Work Hours"
        Sub(set) MyBase.DisplayName = value
    End Property
    Public Overrides Property MenuCaption() As String
        Function(get) "Custom Work Hours"
        Sub(set) MyBase.MenuCaption = value
    End Property

    Public Overrides Function FormatCaption(ByVal start As Date, ByVal [end] As Date) As String
        If start.Hour <= 12 Then
            Return start.Hour.ToString() & " AM"
        Else
            Return (start.Hour - 12).ToString() & " PM"
        End If
    End Function
    Public Overrides Function IsDateVisible(ByVal [date] As Date) As Boolean
        If [date].Hour >= 8 AndAlso [date].Hour <= 18 Then
            Return Not([date].Hour = 14)
        Else
            Return False
        End If
    End Function
End Class

You can also merge specific columns to hide unwanted time intervals. This technique is described in this document.

You can also create a new time scale by inheriting from the TimeScaleFixedInterval class.

Tip

A complete sample project is available in the DevExpress Code Examples database at https://supportcenter.devexpress.com/ticket/details/e1480/winforms-scheduler-display-discontinuous-custom-time-scales-in-timeline-view.