Xamarin.Forms - Calendar Control in Syncfusion

Introduction

In this article, you will learn about using Syncfusion Calendar Control in Xamarin.Forms. These features are not included by default in Xamarin.Forms controls. So, we need to install separate NuGet Packages.

Nuget Packages

Package Name : "Syncfusion.Xamarin.SfCalendar”

Overview of Syncfusion.Xamarin. SfCalendar

The Calendar control provides a multi-view representation to display and select one or more dates within specified ranges. It also provides a gesture-friendly UI to perform operations like navigations, events, and more.

Pre- Requirements

  • Windows 10 (Recommended)
  • Visual Studio 2017 Community Edition (It is a free software available online).
  • Syncfusion Essential Studio for UWP and get Syncfusion Community License (It is free for an individual with less than $1 Million revenue).

Let’s start!

Step 1

Open Visual Studio->New Project->Templates->Visual C#->Cross Platform->Cross Platform App(Xamarin). Now, give the Project Name and Project Location.

Xamarin

Step 2

Next, opens a new window. Here, select Template->Blank App, UI Technology->Xamarin.Forms and finally Code Sharing Strategy ->Portable Class Library (PCL).

Xamarin

Step 3

After the project creation, we need to add the NuGet Packages for our project. So open Solution Explorer ->Project Name->Right-click and select Manage NuGet Packages. In that popup window to search “Syncfusion.Xamarin.SFCalendar” followed by installing “Syncfusion.Xamarin.SFCalendar”

Xamarin

Step 4

Open Solution Explorer->Project Name (PCL)-> MainPage.xaml then click to open XAML Code .

Here, put Syncfusion.SfCalendar Namespace followed by SfCalendar code.

Xamarin

NameSpace

"xmlns:calen="clr-namespace:Syncfusion.SfCalendar.XForms;assembly=Syncfusion.SfCalendar.XForms"

XAML Code

  1. "<?xml version="  
  2. 1.0 " encoding="  
  3. utf - 8 " ?> < ContentPage xmlns = "http://xamarin.com/schemas/2014/forms"  
  4. xmlns: x = "http://schemas.microsoft.com/winfx/2009/xaml"  
  5. xmlns: local = "clr-namespace:SFCalaender"  
  6. xmlns: calen = "clr-namespace:Syncfusion.SfCalendar.XForms;assembly=Syncfusion.SfCalendar.XForms"  
  7. x: Class = "SFCalaender.MainPage"  
  8. Title = "Calender Control by Synufusion" > < calen: SfCalendar x: Name = "Calender" / > < /ContentPage>  

 

Step 4

Finally set up Default Running Platform [Android /iOS/UWP].

Output - Android

Xamarin

UWP

Xamarin

Finally, we successfully created Xamarin.Forms Syncfusion Calendar Control.