RadCalendar: Getting Started

This article will guide you through the process of adding a RadCalendar instance to a page in a {N} application.

Adding a RadCalendar to Your Page

To be able to add a RadCalendar instance to your page you need to define a custom XML namespace as follows xmlns:calendar="nativescript-pro-ui/calendar".

After defining the namespace adding a RadCalendar instance to your page is done as follows:

<navigation:ExamplePage
    xmlns:navigation="navigation/example-page"
    xmlns:calendar="nativescript-pro-ui/calendar"
    xmlns="http://www.nativescript.org/tns.xsd">
    <navigation.actionBar>
        <ActionBar title="Getting Started" />
    </navigation.actionBar>
    <calendar:RadCalendar id="calendar" />
</navigation:ExamplePage>

RadCalendar must be put in a parent layout panel that does not require from its children to have their own desired size. You should not therefore put RadCalendar in a StackLayout or an auto-sized row within a GridLayout.

This will initialize a new RadCalendar instance and put it as a direct child of your page:

TelerikUI RadCalendar: Getting Started TelerikUI RadCalendar: Getting Started

References

Want to see this scenario in action?
Check our SDK examples repo on GitHub. You will find this and many other practical examples with NativeScript UI.