Format DatePicker value to MM/dd/yyyy or MM-dd-yyyy in Xamarin.Forms (C# - Xaml)

Introduction:
In Xamarin.Forms, we can format datepicker value to specific date format using "Format" property in Xaml or C# code. But you might be faced the issues with date format. For example if you set datepicker Format to "MM/dd/yyyy", value will be shown in different format for some devices like "MM-dd-yyyy". In this article, we can learn how to fix this issues.

Description:
We can achieve custom date formats for date picker with custom renderers

In your Android project add below custom renderer for DatePicker to format date value to "MM/dd/yyyy"

1. using System.ComponentModel;  
2. using System.Globalization;  
3. using Android.Content;  
4. using Xamarin.Forms;  
5. using Xamarin.Forms.Platform.Android;  
6.   
7. [assembly: ExportRenderer(typeof(DatePicker), typeof(DatePicker))]  
8. namespace DatePickerFromat.Droid.Renderers  
9. {  
10.     public class CustomDatePicker : DatePickerRenderer  
11.     {  
12.         public CustomDatePicker(Context context) : base(context)  
13.         {  
14.         }  
15.   
16.         protected override void OnElementChanged(ElementChangedEventArgs<DatePicker> e)  
17.         {  
18.             base.OnElementChanged(e);  
19.             if (e.NewElement != null && Control != null)  
20.             {  
21.                 this.Control.Text = Element.Date.ToString("MM/dd/yyyy", CultureInfo.InvariantCulture)?.Replace("-", "/");  
22.             }  
23.         }  
24.   
25.         protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)  
26.         {  
27.             if (Element != null && Control != null)  
28.             {  
29.                 this.Control.Text = Element.Date.ToString("MM/dd/yyyy", CultureInfo.InvariantCulture)?.Replace("-", "/");  
30.             }  
31.         }  
32.     }  
33. }  

In your iOS project add below custom renderer for DatePicker to format date value to "MM/dd/yyyy"

1. using System.ComponentModel;  
2. using System.Globalization;  
3. using DatePickerFromat.iOS.Renderers;  
4. using Xamarin.Forms;  
5. using Xamarin.Forms.Platform.iOS;  
6.   
7. [assembly: ExportRenderer(typeof(DatePicker), typeof(CustomDatePicker))]  
8. namespace DatePickerFromat.iOS.Renderers  
9. {  
10.     public class CustomDatePicker : DatePickerRenderer  
11.     {  
12.         protected override void OnElementChanged(ElementChangedEventArgs<DatePicker> e)  
13.         {  
14.             base.OnElementChanged(e);  
15.   
16.             if (e.NewElement != null && Control != null)  
17.             {  
18.                 this.Control.Text = Element.Date.ToString("MM/dd/yyyy", CultureInfo.InvariantCulture)?.Replace("-", "/");  
19.             }  
20.         }  
21.   
22.         protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)  
23.         {  
24.             if (Element != null && Control != null)  
25.             {  
26.                 this.Control.Text = Element.Date.ToString("MM/dd/yyyy", CultureInfo.InvariantCulture)?.Replace("-", "/");  
27.             }  
28.         }  
29.   
30.     }  
31. }  

You can also directly work on below sample source code to understand this article.

You can also see output of this article from below youtube video. Also for more videos please don't forget to SUBSCRIBE our youtube channel from here.

FeedBack Note: Please share your thoughts, what you think about this post, Is this post really helpful for you? I always welcome if you drop comments on this post and it would be impressive.

Follow me always at @Subramanyam_B