RadCalendar for Vue: Overview

RadCalendar for NativeScript is based on the corresponding native calendar components from the Progress UI for iOS and Progress UI for Android suites. It exposes a unified API covering all major features coming from the native components like:

  • inline events
  • different view modes
  • cells customization
  • selection


View modes

RadCalendar supports four different view modes that are suitable for different application scenarios:

  • Week - displays the dates within one week
  • Month - displays the dates within one month
  • MonthNames - displays the months within a year
  • Year - displays a whole year
  • Day - displays a timeline for a day with its events

For more information about View Modes take a look at the dedicated article: Calendar view modes.

Vue directives

When working with RadCalendar with Vue you will need to use the custom Vue directives. Simply use the RadCalendar selector to declare an in the Vue component.
Here is a full list of the available custom Vue RadCalendar directives and components:


Represent the major elements:

Selector Class (more details)
RadCalendar The calendar element