Introduction

In this article, we will discuss how to create a Xamarin.Forms app for selecting the dates for appointments, meetings, and for setting reminders. So, let's dive into the article.

Prerequisites
Step 1
  • Open your Visual Studio 2017 Community Edition.
  • Go to File -> New -> Project. Then, a new window will appear.
  • Then, under Installed, select Visual C# -> Cross-Platform.
  • On the right side of the window, select Mobile App (Xamarin.Forms). Then, give the name of the project and save it in your required location.
  • Click OK.
Xamarin
Step 2
  • Now, a new window will appear on your screen. Under template, select Blank App.
  • Select all platforms or your required platforms for executing your application.
  • Then, select .NET Standard and click OK.
Xamarin

Step 3

After creating your project, open MainPage.xaml for writing the UI part of your application.

XAML Code
  1. <?xml version="1.0" encoding="utf-8" ?>
  2. <ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:local="clr-namespace:DatePicker" x:Class="DatePicker.MainPage">
  3. <StackLayout HorizontalOptions="Center" VerticalOptions="Center">
  4. <DatePicker x:Name="MainDatePicker" MinimumDate="1/1/2018" MaximumDate="12/31/2020" DateSelected="MainDatePicker_DateSelected" />
  5. <Label x:Name="MainLabel" FontSize="20" TextColor="Blue" /> </StackLayout>
  6. </ContentPage>
In this, we use DatePicker for displaying the calendar. For that calendar, let us set the minimum and maximum ranges of that calendar. Then, use an event for displaying the date on the label.
Xamarin
Step 4

Now, open MainPage.xaml.cs file for writing the code.

C# Code
  1. using System;
  2. using System.Collections.Generic;
  3. using System.Linq;
  4. using System.Text;
  5. using System.Threading.Tasks;
  6. using Xamarin.Forms;
  7. namespace DatePicker {
  8. public partial class MainPage: ContentPage {
  9. public MainPage() {
  10. InitializeComponent();
  11. }
  12. private void MainDatePicker_DateSelected(object sender, DateChangedEventArgs e) {
  13. MainLabel.Text = e.NewDate.ToLongDateString();
  14. }
  15. }
  16. }
Xamarin
Step 5

Now, set the project's Portable file for "Startup Project" and build the project.

Xamarin
Xamarin
Step 6
  • Now, select the platform for executing your application. I am selecting UWP platform for executing the app.
  • Click on the Local Machine to deploy your app on your machine.
Xamarin

Xamarin

Xamarin

Now, I am selecting the date on the calendar.

Xamarin

Xamarin

Now, I am deploying the same app on my mobile phone using Xamarin Live Player.

Xamarin

Xamarin

On the calendar, I am selecting the date.

Xamarin

Xamarin

Conslusion

Now, we have successfully created the Xamarin app for selecting a required date.