Calendar Month View and Event Indicator

3 posts, 1 answers
  1. Sivaramalingam
    Sivaramalingam avatar
    2 posts
    Member since:
    Jun 2018

    Posted 06 Jun 2018 Link to this post

    How to achieve following things in Xamarin.iOS.

    -- How to hide next month dates in month view? Currently, it is displaying the next month dates in the current month. (Refer attached image: Month_View_Dates) 

    -- How to place event indicators above the dates? It is displayed below the dates now. (Refer attached image: Event _Indicator)

    -- How to display weekends in grey? (Refer attached image: Event _Indicator)


    Thanks in advance.

  2. Answer
    Didi avatar
    383 posts

    Posted 08 Jun 2018 Link to this post

    Hi Sivaramalingam,

    Thank you for the provided images.

    Hiding the next month dates is currently not part of the RadCalendar functionalities. As a workaround you could change the visibility of the cells which are not from the current month through CustomRenderer.
    However, this will not affect the calculations that the calendar does to position its cells and it will still display 6 rows.
    Please take a look at the provided snippet for this functionality: 

    public class CustomCalendarRenderer : CalendarRenderer
        protected override CalendarDelegate CreateCalendarDelegateOverride()
            return new CustomCalendarDelegate();
    public class CustomCalendarDelegate : CalendarDelegate
            public override void UpdateVisualsForCell(TKCalendar calendar, TKCalendarCell cell)
                base.UpdateVisualsForCell(calendar, cell);
                var dayCell = cell as TKCalendarDayCell;
                if (dayCell != null)
                    dayCell.Hidden = (dayCell.State & TKCalendarDayState.CurrentMonth) == 0;
    For more information about how to create a custom renderer for iOS in Calendar control, take a look at our documentation here.

    About hiding the previous month days you can set the viewMode property to TKCalendarViewMode to enable this view. How to do that, please take a look at the following link below:

    Events indicators can be positioned above the dates by setting the ShapesVerticalLocation property to Top. Please take a look at the provided snippet below how to implement this in the project:

    calendar.AppointmentsStyle = new Telerik.XamarinForms.Input.CalendarAppointmentsStyle
                   DisplayMode = AppointmentDisplayMode.Shape,
                   MaxCount = 1,
                   ShapeSize = new Xamarin.Forms.Size(10, 10),
                   ShapesHorizontalLocation = HorizontalLocation.Center,
                   ShapesVerticalLocation = VerticalLocation.Top,
                   ShapeType = CalendarAppointmentShapeType.Ellipse
    Please take a look at our documentation here how to use the AppointmentsStyle property of the RadCalendar component.

    I have logged the request for hiding next month days in month view as a feature request so you can find your Telerik points updated for reporting this to us.

    I hope I could be of help.

    Progress Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. Sivaramalingam
    Sivaramalingam avatar
    2 posts
    Member since:
    Jun 2018

    Posted 08 Jun 2018 in reply to Didi Link to this post

    Thanks for your detailed answer. It was really helpful. 
Back to Top