# Quick Start: Display a Calendar Control

## Content



This section describes how to add a Calendar control to your Xamarin application and select a date on the calendar at runtime. This topic comprises of two steps:

*   [Step 1: Add a Calendar Control](/componentone/docs/xamarin/online-forms/controls/CalendarOverview/CalendarQuickStart#step-1-add-a-calendar-control)
*   [Step 2: Run the Project](/componentone/docs/xamarin/online-forms/controls/CalendarOverview/CalendarQuickStart#step-2-run-the-project)

The following image shows how the Calendar appears after completing the above steps.

![](https://cdn.mescius.io/document-site-files/images/fb6b46a2-eac0-487c-84c3-5e1b4c7b1348/images/calendar_quickstart.png)

### Step 1: Add a Calendar Control

Complete the following steps to initialize a Calendar control in C# or XAML.

#### In Code

1.  Add a new class (say QuickStart.cs) to your Portable or Shared project and include the following references.
    
    ```csharp
    using Xamarin.Forms;
    using C1.Xamarin.Forms.Calendar;
    ```
    
2.  Instantiate a Calendar control in a new method ReturnMyControl() as illustrated in the code below.
    
    ```csharp
    public static C1Calendar ReturnMyControl()
       {
           C1Calendar calendar = new C1Calendar();
           calendar.MaxSelectionCount = -1;
           calendar.HorizontalOptions = LayoutOptions.FillandExpand;
           calendar.FontSize = 20;
           return calendar;
       }
    ```
    

#### In XAML

1.  Add a new Content Page (for example QuickStart.xaml) to your Portable or Shared project and modify the \<ContentPage> tag to include the following references:
    
    ```xml
    <ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:c1="clr-namespace:C1.Xamarin.Forms.Calendar;assembly=C1.Xamarin.Forms.Calendar"
    x:Class="CalendarQuickStart.QuickStart"
    Padding="20">
    </ContentPage>
    ```
    
2.  Initialize a Calendar control by adding the following markup inside the \<ContentPage>\</ContentPage> tags as illustrated below.
    
    ```xml
    <Grid>
        <Label Text="{Binding MainText}" HorizontalOptions="Center" Font="Large" />
        <c1:C1Calendar x:Name="calendar" MaxSelectionCount="-1"/>
    </Grid>
    ```
    

#### Step 2: Run the Project

1.  In the Solution Explorer, double-click App.xaml.cs file to open it.
2.  Complete the following steps to display the Calendar control.
    *   **To return a C# class**: In the class constructor App(), set a new ContentPage as the MainPage and assign the control to the ContentPage's Content by invoking the ReturnMyControl() method in **Step 2** above. The following code shows the class constructor App() after completing this step.
        
        ```csharp
        public App()
          {
             // The root page of your application
             MainPage = new ContentPage
               {
                 Content = QuickStart.ReturnMyControl()
                };
          }
        ```
        
    *   **To return a Content Page**: In the constructor App(), set the Content Page QuickStart as the MainPage. The following code shows the class constructor App(), after completing this step.
        
        ```csharp
        public App()
          {
             // The root page of your application
             MainPage = new QuickStart();
           }
        ```
        
3.  Some additional steps are required to run iOS and UWP apps:
    *   **iOS App**:
        1.  In the Solution Explorer, double click AppDelegate.cs inside YourAppName.iOS project to open it.
        2.  Add the following code to the FinishedLaunching() method.
            
            ```csharp
            C1.Xamarin.Forms.Calendar.Platform.iOS.C1CalendarRenderer.Init();
            ```
            
    *   **UWP App**:
        1.  In the Solution Explorer, expand the MainPage.xaml inside YouAppName.UWP project.
        2.  Double click the MainPage.xaml.cs to open it and add the following code to the class constructor.
            
            ```csharp
            C1.Xamarin.Forms.Calendar.Platform.UWP.C1CalendarRenderer.Init();
            ```
            
        3.  (Optional) In case you compile your UWP application in **Release** mode, you need to explicitly add the following code to the **OnLaunched** method in your **App.xaml.cs** to include the correct assemblies with your application.
            
            ```csharp
            var assembliesToInclude = new List<Assembly>();
            assembliesToInclude.Add(typeof(C1.Xamarin.Forms.Calendar.Platform.UWP.C1CalendarRenderer)
            .GetTypeInfo().Assembly);
            assembliesToInclude.Add(typeof(C1.UWP.Calendar.C1Calendar).GetTypeInfo().Assembly);
            Xamarin.Forms.Forms.Init(e, assembliesToInclude);
            ```