Xamarin.Forms DatePicker shows incorrect date

[mikebikerider]

Xamarin.Forms 5 iOS DataPicker shows incorrect date if UTC Date is ahead of the local Date. The default Date format "D" is incorrectly rendered: Day of Week is missing.

Steps to Reproduce in the Western Hemisphere

1. Download the Xamarin DatePicker sample app 'Days Between Dates' and compile the iOS project.
2. Run the app at the time when UTC Date is 1 day ahead of the local date. In the UTC - 5 time zone (EST US, Canada) that is after 19:00
3. Look at the DatePicker - the date is one day behind of the local date. Tap the DatePicker to bring up the native iOS control. It shows the correct date. Select another date and click 'Done'. The date shown in the DatePicker is again 1 day behind.

Expected Behavior: The date shown in the control should be the date loaded or the date selected at all times. The Date format "D" (default) should be rendered with Day of Week before then day and month.

Actual Behavior: The date shown can be wrong depending on the local time, the format "D" is rendered without Day of Week

Basic Information

• Version with issue: 5.0.0.1874
• Last known good version: 4.8.0.1821
• Platform Target Frameworks:
  • iOS: 14.3
  • Android: not affected

• UWP: not relevant
• Android Support Library / AndroidX Version:
• NuGet Packages: Xamarin.Forms
• Affected Devices: iPhone, iPad, simulator

Environment Visual Studio 2019 16.8.3

Show/Hide Visual Studio info

Build Logs

Screenshots

Reproduction Link

The screenshot made on January 8 at 19:02 EST (US, Canada) shows date January 7, 2021.
Is should show Friday, January 8, 2021.
A screenshot made same day before 19:00 shows correct date January 8, 2021 in wrong format.
The app is not mine. It is the Xamarin.Forms sample up downloaded from the GitHub one day after it was updated to Xamarin.Forms 5.0.0.1874. Downgrading to Xamarin.Forms to 4.8.0.1821 and running the app produced correct date in correct format "D". "D" is the default.

Workaround

Set DatePicker IsVisible = False;
In XAML or in code place a Label into the same position (grid cell) as the DatePicker.
In DatePicker.DateSelected add code to set label text to e.NewDate.ToString("D") or whatever date format you chose.
For the label add TapGestureRecognizer that will call DatePicker.Focus()

[mikebikerider]

Comparing DatePickerRenderer.cs for Xamarin.Forms 4.8 and 5.0 makes me think both issues - missing Day of Week for date format "D" and wrong date are caused by changes in UpdateDateFromModel(bool animate)
both start with:
if (_picker.Date.ToDateTime().Date != Element.Date.Date)
_picker.SetDate(Element.Date.ToNSDate(), animate);
In 4.8
Control.Text = Element.Date.ToString(Element.Format);
In 5.0
NSDateFormatter dateFormatter = new NSDateFormatter();
if (Element.Format?.Equals("D") == true)
{
dateFormatter.DateStyle = NSDateFormatterStyle.Long;
var strDate = dateFormatter.StringFor(_picker.Date);
Control.Text = strDate;
}

iOS date format long has no Day of Week.
Could be calling NSDateFormatter shifts displayed date by one day when local date is behind or ahead of the UTC date?

[educatedcg]

I agree this seems like a bug.. Perfectly working datetime picker no longer picks the correct date.
If you look at the binding property:

{1/31/2021 12:00:00 AM} - making matters worse, you can't even select the end of the month unless you select the first day of the next month.. It's always off by a day... Maybe the 12AM portion??

[mikebikerider]

No, not the 12 AM portion. The underlying iOS DatePicker works correctly and always shows the correct date. The date is pushed 1 day back when control on the page is updated. Date is pushed 1 day back if you are in the Western hemisphere, I am. If I fly to the UTC + zone it would be 1 day ahead at least some hours of the day. It can be quite confusing.
The workaround I suggested is simple. The permanently displayed part of the DatePicker is just a label. Put your own label on top of it and make DatePicker not visible. Update your label in DatePicker.DateSelected event handler, and add TapGestureRecognizer for the label to focus the underlying iOS DatePicker. Look up the original post.
Of course it has to be fixed.
I still will keep my workaround because it gives me more control and better look.

[hoangwy]

Same here

As you can see
The Wheel shows January 19, 2021 but the label shows 1/18/21

[danielkboyer]

I am getting the same issue, this is frustrating, a working build is now halted because of this. @mikebikerider solution works, it's just a pain to implement this anywhere I have a DatePicker. Is there a fix that does not require creating a label over it?

[educatedcg]

It's crazy that no one is picking this bug up. It's a fundamental breaking bug. If no one picks it up, one of us will have to fix it. I had to revert my app to 4.8, because this make 5.0 unusable for me on iOS.

[PureWeen]

I waited all day to test this issue and from what I can tell this is fixed with the latest SR1 of Xamarin.Forms

I'm closing this for now. If you still have an issue with the latest 5.0 release of Forms let me know and we can re-open

[PureWeen]

@rachelkang is still seeing this issue where she's at in the world so going to re-open for now :-/

[mikebikerider]

The issue has to be caused by changes in DatePickerRendererBase.UpdateDateFromModel(bool animate) from Xamarin.Forms 4.8 to 5.0.
A second work around could be custom renderer overriding OnElementChanged() and OnElementPropertyChanged().
As an extra bonus you can pick a desired DatePicker style - Default, Wheels, Compact for iOS 13.4 and higher.

using YourAppName.iOS.Renderers;
using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;
using UIKit;
using System.ComponentModel;

[assembly: ExportRenderer(typeof(DatePicker), typeof(MyDatePickerRenderer))]
namespace YourAppName.iOS.Renderers
{
public class MyDatePickerRenderer : DatePickerRenderer
{
protected override void OnElementChanged(ElementChangedEventArgs e)
{
base.OnElementChanged(e);

        if (e.NewElement != null && this.Control != null)
        {
            try
            {
                UIDatePicker picker = (UIDatePicker)Control.InputView;
                if (UIDevice.CurrentDevice.CheckSystemVersion(13, 4))
                {
                    //select desired style
                    picker.PreferredDatePickerStyle = UIDatePickerStyle.Automatic;
                }
                UpdateDateFromModel(picker, false);

            }
            catch
            {
                // do nothing
            }
        }
    }
    protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
    {
        base.OnElementPropertyChanged(sender, e);
        try
        {
            try
            {
                UIDatePicker picker = (UIDatePicker)Control.InputView;
                UpdateDateFromModel(picker, true);

            }
            catch
            {
                // do nothing
            }
        }
        catch { }
    }
    private void UpdateDateFromModel(UIDatePicker picker, bool animate)
    {
        if (picker.Date.ToDateTime().Date != Element.Date.Date)
            picker.SetDate(Element.Date.ToNSDate(), animate);
        Control.Text = Element.Date.ToString(Element.Format);
    }
}

}

UpdateDateFromModel() - I pasted from the 4.8 DatePickerRendererBase

[Westat-Transportation]

For the record, I am also seeing this issue in 4.8.0.1269. I also resolved this by applying @mikebikerider 's workaround.

[tommy-elliott-awh]

I have experienced this issue emulating in iOS on iPhone 12 iOS 14.3 on 1/27/21 in EST for the full duration between 11:40am EST and 5pm EST on Xamarin Forms 5 in VS 2019 v16.8.4 in Windows, connected to a Mac mini build agent with the latest Xcode 12. The formatted text date display "M/d/yyyy" was correct with today's date when initially loaded (today's date), but as soon as a change was made to any part of the date (I used the wheels style for the DatePicker), the formatted text date changed to represent one day before the selected date, even crossing month and year boundaries (displayed "12/31/2000" when 1/1/2001 had been selected, and similarly one day before what is selected for every date, regardless of selected date). After applying the workaround steps in @mikebikerider 's custom renderer workaround, the issue was resolved.

[PureWeen]

If anyone having this issue can test with the following nugets and let us know if it's resolved that would be helpful

https://dev.azure.com/xamarin/public/_build/results?buildId=34568&view=artifacts&pathAsName=false&type=publishedArtifacts

[mikebikerider]

Xamarin.Forms build 5.0.0.6978 fixes the incorrect date issue. Prior to installing the new nuget - the date shown in the date picker (DarkSlateGray background) was 1 day behind the date shown in the label above the date picker. The date picker format is "D". The date shown in the date picker control is not format "D". The label above the date picker has date format "D". The date picker does not show the Day of Week. [cid:image002.png@01D6FB57.219E7E50] Build 5.0.0.6978 shows correct date. The date, date format is not "D" [cid:image004.png@01D6FB57.219E7E50] Build 5.0.0.6978 opens date picker with old style 'Wheels'. This begs a question what was the point tinkering with the date picker, adding a date bug, and screwing up date format, while keeping the deprecated look and feel? Xamarin.Forms 4.8 and prior show the same older 'Wheels' style date picker, and render the date format "D" correctly. The date picker style can be selected via custom renderer. Date Picker iOS - specific option would be a more graceful solution. At this point, grace is not an option. The Compact (Automatic) style looks odd, Inline not usable. This is what inline looks like 5.0.0.6978 [cid:image008.png@01D6FB57.219E7E50] The top of the date picker is cut off. Conclusion: The bigger issue, wrong date, seems to be fixed. I'd be more confident taking a look at the DatePicker renderer code. Two remaining issues: Date format "D" is not rendered correctly. I have pretty good idea why. iOS dateFormatter.DateStyle.Long is different from .NET "D". The below code from DatePicker.Renderer. UpdateDateFromModel() looks odd and produces odd result. if (Element.Format?.Equals("D") == true) { dateFormatter.DateStyle = NSDateFormatterStyle.Long; var strDate = dateFormatter.StringFor(_picker.Date); Control.Text = strDate; } If I select "D" in XAML or code I expect the date starting with the Day of Week. I also expect the iOS and Android versions of my apps have similar look and feel. The Android date picker with Format="D" shows the date starting with the day of week. The iOS date picker does not show day of week. It is not such a big deal as I can easily work around via custom renderer, or by placing a label on top of the date picker and displaying the date the way I please. Date picker Inline style is unusable. The Compact style has odd look and feel. My guess is that was the reason for reverting from 'Automatic' in the initial 5.0 release to 'Wheels' in later builds. In production versions of my iOS apps I kept the Compact (Automatic) style via custom renderer despite the odd look and feel. Not as odd as having to look up someplace else for the day of week. Michael Rubinstein (mikerider) From: Shane Neuville [mailto:notifications@github.com] Sent: Thursday, February 04, 2021 8:23 PM To: xamarin/Xamarin.Forms <Xamarin.Forms@noreply.github.com> Cc: mikebikerider <mbrubinstein@hotmail.com>; Mention <mention@noreply.github.com> Subject: Re: [xamarin/Xamarin.Forms] Xamarin.Forms DatePicker shows incorrect date (#13366) If anyone having this issue can test with the following nugets and let us know if it's resolved that would be helpful https://dev.azure.com/xamarin/public/_build/results?buildId=34568&view=artifacts&pathAsName=false&type=publishedArtifacts<https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fdev.azure.com%2Fxamarin%2Fpublic%2F_build%2Fresults%3FbuildId%3D34568%26view%3Dartifacts%26pathAsName%3Dfalse%26type%3DpublishedArtifacts&data=04%7C01%7C%7Cbee4a4a45f4745cd55ee08d8c974944c%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C637480849826645940%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C1000&sdata=5RrxQ%2BueK%2FigI0NGWfaUGVeaAD2SsJpjrnmr%2FO62I6A%3D&reserved=0> - You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub<https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fxamarin%2FXamarin.Forms%2Fissues%2F13366%23issuecomment-773715364&data=04%7C01%7C%7Cbee4a4a45f4745cd55ee08d8c974944c%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C637480849826655948%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C1000&sdata=tjszJM5ghAKHbhWyKDmOIxmQPEZhwYdIDL6FWNyjaYY%3D&reserved=0>, or unsubscribe<https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fnotifications%2Funsubscribe-auth%2FAESZQ2W3QG3WJ62UX4DJEMTS5NB7LANCNFSM4V54CNGA&data=04%7C01%7C%7Cbee4a4a45f4745cd55ee08d8c974944c%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C637480849826655948%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C1000&sdata=IloMkjYPSQpFdeajJy6bQYZ%2FJavrpB9FsnrkcFf4a5g%3D&reserved=0>.

[educatedcg]

Did this make it into a nightly build? Tried 5.0.1.1876 - nightly build and saw the same effect with that binds a additional datefield to the selected date value

[tommy-elliott-awh]

@educatedcg It looks like @mikebikerider said

Xamarin.Forms build 5.0.0.6978 fixes the incorrect date issue.

which isn't in a nuget release yet, so I'm applying the workaround within the custom iOS renderer until it is available from nuget, and I would suggest you do the same.