Navigation Header Style

4 posts, 0 answers
  1. Anton
    Anton avatar
    2 posts
    Member since:
    Dec 2016

    Posted 20 Dec 2016 Link to this post

    is there any way to adjust/set the navigation header within the "Day", "Week" or "Year" view please?

    e.g. I would like to use dd.mm.yyyy - dd.mm.yyyy date format instead of what is shown as default.

  2. Dilyan Traykov
    Admin
    Dilyan Traykov avatar
    634 posts

    Posted 20 Dec 2016 Link to this post

    Hello Anton,

    The desired result can be achieved by creating a custom view definition and overriding its FormatVisibleRangeText method. Here's an example for the WeekViewDefinition:

    public class CustomWeekViewDefinition : WeekViewDefinition
    {
        protected override string FormatVisibleRangeText(IFormatProvider formatInfo, DateTime rangeStart, DateTime rangeEnd, DateTime currentDate)
        {
            var format = rangeStart.Year == rangeEnd.Subtract(TimeSpan.FromTicks(1)).Year ?
                        (rangeStart.Month == rangeEnd.Subtract(TimeSpan.FromTicks(1)).Month ?
                        "{0:d} - {1:d MMMM yyyy}" :
                        "{0:d MMMM} - {1:d MMMM yyyy}") :
                        "{0:d MMMM yyyy} - {1:d MMMM yyyy}";
     
            return string.Format(formatInfo, format, rangeStart, rangeEnd.Subtract(TimeSpan.FromTicks(1)));
        }
    }

    <telerik:RadScheduleView.ViewDefinitions>
        <telerik:DayViewDefinition />
        <local:CustomWeekViewDefinition />
        <telerik:MonthViewDefinition />
        <telerik:TimelineViewDefinition />
    </telerik:RadScheduleView.ViewDefinitions>

    Please let me know if this works for you.

    Regards,
    Dilyan Traykov
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Anton
    Anton avatar
    2 posts
    Member since:
    Dec 2016

    Posted 22 Dec 2016 in reply to Dilyan Traykov Link to this post

    Hello Dilyan,

    Thanks for the Reply! I have thought about this solution but in this case my control type should be "local:CustomWeekViewDefinition" which inherits "WeekViewDefinition", and I will not have the very important options:

    1. StretchAppointments

    2. TimerulerGroupStringFormat

    any idea how to work around this please?

    Kind regards

    Anton

     

  4. Dilyan Traykov
    Admin
    Dilyan Traykov avatar
    634 posts

    Posted 22 Dec 2016 Link to this post

    Hello Anton,

    As suggested in my previous reply, your custom view definition should inherit from the respective view definition - MonthViewDefinitionTimelineViewDefinition etc. I gave the WeekViewDefinition just as an example.

    <telerik:RadScheduleView.ViewDefinitions>
        <local:CustomDayViewDefinition /> <!-- inherits from DayViewDefinition -->
        <local:CustomWeekViewDefinition /> <!-- inherits from WeekViewDefinition -->
        <local:CustomMonthViewDefinition /> <!-- inherits from MonthViewDefinition -->
        <local:CustomTimelineViewDefinition /> <!-- inherits from TimelineViewDefinition -->
    </telerik:RadScheduleView.ViewDefinitions>

    I hope this clarifies the matter. Please let me know if you have any further questions or concerns.

    Regards,
    Dilyan Traykov
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top