Xamarin Forms PCL - DatePicker doesn't open correctly on UWP

Question

I don't get something, I would like, from a button , open my DatePicker . So I coded that:

private void OnDateClicked(object sender, EventArgs ea)
{
    Debug.WriteLine("PLOPPP");
    //DatePickerControl.IsVisible = true;
    //DatePickerControl.Focus();
    Device.BeginInvokeOnMainThread(() => {
        DatePickerControl.Focus();
    });
}

Once the button got clicked/touched by the user, nothing happens.. Why? I'm just searching to open the Date Selector but I can't figure out why it doesn't work ><

The XAML part is looking like that:

    <AbsoluteLayout x:Name="LayoutTools"
                    AbsoluteLayout.LayoutBounds="0.5, 0.05, 0.9, 0.075"
                    AbsoluteLayout.LayoutFlags="All">
      <!-- DATE -->
      <!--<control:SquareLayout x:Name="DateButton" BackgroundColor="{x:StaticResource NL_BlueNight}" ScalingBase="Height"
                            AbsoluteLayout.LayoutBounds="0, 0.5, 0.1, 1"
                            AbsoluteLayout.LayoutFlags="All"/>-->
      <AbsoluteLayout x:Name="DateButton" BackgroundColor="{x:StaticResource NL_BlueNight}" Opacity="0.8"
                      AbsoluteLayout.LayoutBounds="0, 0.5, 0.1, 1"
                      AbsoluteLayout.LayoutFlags="All">
        <control:CustomLabel Text="{Binding DaySelected}" FontFamily="{extension:FontFamily Roboto_Light}" FontSize="20" TextColor="Gray"
                             HorizontalTextAlignment="Center" VerticalTextAlignment="Center"
                             AbsoluteLayout.LayoutBounds="0.5, 0.5, 1, 1"
                             AbsoluteLayout.LayoutFlags="All"/>
        <Button Clicked="OnDateClicked" BackgroundColor="Transparent" BorderColor="Transparent"
                AbsoluteLayout.LayoutBounds="0.5, 0.5, 1, 1"
                AbsoluteLayout.LayoutFlags="All"/>
      </AbsoluteLayout>
    </AbsoluteLayout>
    <!-- <control:CustomDatePicker.../> -->

So here, the CustomLabel is bind to an object which give the number of the current day. Over it, a Button which call the private void OnDateClicked(object sender, EventArgs ea) method.

Then, in this method, I'm trying to open the DatePicker I have put in the XAML part:

    <!-- code above -->
    <control:CustomDatePicker x:Name="DatePickerControl" Format="dd-MM-yyyy" Date="{Binding CurrentDate}" IsVisible="False"
                              MinimumDate="{Binding CurrentDate}"
                              FontFamily="{extension:FontFamily Roboto_Light}" FontSize="20" TextColor="White"
                              XAlign="Center" HasBorder="false" BackgroundColor="Transparent"
                              AbsoluteLayout.LayoutBounds="0.5, 0.5, 1, 1"
                              AbsoluteLayout.LayoutFlags="All"/>

The idea is just to open the selector, then I save the all date but only display the day of this selected date, in the Label .

Thank in advance !

Answer 1

It's known issue . Maybe it would be fixed in the future. I could suggest my workaround with using renderer for UWP:

[assembly: ExportRenderer(typeof(DatePickerRenderer), typeof(SomeDatePickerRenderer))]
namespace SuperForms.UWP.Renderers
{
    public class SomeDatePickerRenderer : DatePickerRenderer
    {
        protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.DatePicker> e)
        {
            base.OnElementChanged(e);

            if (Control != null)
            {
                // TODO: Focus() doesn't open date picker popup on UWP, it's known issue 
                // on Xamarin.Forms and should be fixed in 2.5. Had to open it manually.
                var flyout = new DatePickerFlyout() { Placement = FlyoutPlacementMode.Top };
                flyout.DatePicked += (s, args) =>
                {
                    Control.Date = args.NewDate;
                };

                FlyoutBase.SetAttachedFlyout(Control, flyout);
            }
        }

        protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
        {
            base.OnElementPropertyChanged(sender, e);

            if (e.PropertyName == VisualElement.IsFocusedProperty.PropertyName)
            {
                if (Element.IsFocused)
                {
                    FlyoutBase.ShowAttachedFlyout(Control);
                }
            }
        }
    }
}

Now it's being shown each time when IsFocus change to true , so you need to set up it due to your requirements.