blazor-devexpress-dot-blazor-dot-dxscheduler-e11eac55.md
Specifies the template used to display text in the Scheduler’s Date Navigator.
Namespace : DevExpress.Blazor
Assembly : DevExpress.Blazor.v25.2.dll
NuGet Package : DevExpress.Blazor
[Parameter]
public RenderFragment<SchedulerViewInfo> DateNavigatorTextTemplate { get; set; }
| Type | Description |
|---|---|
| RenderFragment<SchedulerViewInfo> |
The template content.
|
The Scheduler’s Date Navigator displays a date or date range that corresponds to the current Scheduler view. These dates have a standard .NET format.
You can use the DateNavigatorTextTemplate to customize the text displayed in the Date Navigator. The following code hides the month/year part for the start date if both start and end dates have the same month/year.
@using MyProject.Services
<DxScheduler DataStorage="@DataStorage">
<Views>
<DxSchedulerWeekView ShowWorkTimeOnly="true" />
<DxSchedulerWorkWeekView ShowWorkTimeOnly="true" />
<DxSchedulerMonthView />
</Views>
<DateNavigatorTextTemplate><span>@CalculateDateString(context)</span></DateNavigatorTextTemplate>
</DxScheduler>
@code {
DxSchedulerDataStorage DataStorage = new DxSchedulerDataStorage() {
AppointmentsSource = AppointmentCollection.GetAppointments(),
AppointmentMappings = new DxSchedulerAppointmentMappings() {
Type = "AppointmentType",
Start = "StartDate",
End = "EndDate",
Subject = "Caption",
AllDay = "AllDay",
LabelId = "Label",
StatusId = "Status",
RecurrenceInfo = "Recurrence"
}
};
string CalculateDateString(SchedulerViewInfo viewInfo) {
if (viewInfo.ActiveViewType == SchedulerViewType.Month) {
return viewInfo.VisibleTimeRange.Start.ToString("MMM yyyy");
}
else {
if (viewInfo.VisibleTimeRange.End - viewInfo.VisibleTimeRange.Start < TimeSpan.FromDays(1)) {
return viewInfo.VisibleTimeRange.Start.ToString("dd MMM yyyy");
}
else {
if (viewInfo.VisibleTimeRange.Start.Year != viewInfo.VisibleTimeRange.End.Year)
return viewInfo.VisibleTimeRange.Start.ToString("dd MMM yyyy") + " - " + viewInfo.VisibleTimeRange.End.ToString("dd MMM yyyy");
else {
if (viewInfo.VisibleTimeRange.Start.Month != viewInfo.VisibleTimeRange.End.Month)
return viewInfo.VisibleTimeRange.Start.ToString("dd MMM") + " - " + viewInfo.VisibleTimeRange.End.ToString("dd MMM yyyy");
else
return viewInfo.VisibleTimeRange.Start.ToString("dd") + " - " + viewInfo.VisibleTimeRange.End.ToString("dd MMM yyyy");
}
}
}
}
}
public class Appointment {
public Appointment() {}
public DateTime StartDate { get; set; }
public DateTime EndDate { get; set; }
public string Caption { get; set; }
public int Label { get; set; }
public int Status { get; set; }
public bool AllDay { get; set; }
}
using System.Globalization;
public static partial class AppointmentCollection {
public static List<Appointment> GetAppointments() {
DateTime date = DateTime.Today;
var dataSource = new List<Appointment>() {
new Appointment {
Caption = "Upgrade Personal Computers",
StartDate = date + (new TimeSpan(0, 14, 0, 0)),
EndDate = date + (new TimeSpan(0, 16, 30, 0)),
Label = 1,
Status = 1
},
new Appointment {
Caption = "Install New Router in Dev Room",
StartDate = date + (new TimeSpan(2, 11, 30, 0)),
EndDate = date + (new TimeSpan(2, 13, 30, 0)),
Label = 6,
Status = 1
},
new Appointment {
Caption = "New Brochures",
StartDate = date + (new TimeSpan(2, 15, 00, 0)),
EndDate = date + (new TimeSpan(2, 16, 45, 0)),
Label = 8,
Status = 1
},
new Appointment {
Caption = "Approve Personal Computer Upgrade Plan",
StartDate = date + (new TimeSpan(3, 13, 30, 0)),
EndDate = date + (new TimeSpan(3, 16, 0, 0)),
Label = 1,
Status = 1
},
new Appointment {
Caption = "Customer Workshop",
StartDate = date + (new TimeSpan(4, 11, 0, 0)),
EndDate = date + (new TimeSpan(4, 12, 0, 0)),
AllDay = true,
Label = 8,
Status = 1
},
new Appointment {
Caption = "Upgrade Server Hardware",
StartDate = date + (new TimeSpan(6, 11, 0, 0)),
EndDate = date + (new TimeSpan(6, 13, 30, 0)),
Label = 6,
Status = 1
}
};
return dataSource;
}
private static string ToString(DateTime dateTime) {
return dateTime.ToString(CultureInfo.InvariantCulture);
}
}
See Also