Forum Xamarin.iOS

Issue rendering UIDatePicker on iPhone XS and 11plus only

TallRyanTallRyan Member ✭✭

I have a Forms project that needs a combined date & time picker, so off to the custom renderer land I went (which is the only reason I am posting this to the iOS forum as well). Things seemed fine when I was testing on my iPhone 8 Plus test device, but on an iPhone XS or 11 Pro (physical devices, both on 13.3) the picker does not render correctly - all the dates are greyed out, and time is completely invisible. I played with the forms side layout as well as UIDatePicker properties, but nothing had any effect on the rendering issues on newer iOS devices. Unsurprisingly, the simulator for both those devices renders correctly. Full sample project along with screenshots can be found on GitHub, esenciadev/DatePickerTest (freshly registered account so I cannot post a link, apologies)

Page:

<StackLayout Orientation="Vertical" Margin="8,16,8,16">
    <Label Text="This is just a test"
       HorizontalOptions="Center"
           Margin="8,16,8,16"
       VerticalOptions="Start" />
    <local:MyDatePicker Date="{Binding Date}"
                        Margin="8,16,8,16"
                        DateChangedCommand="{Binding DateChangedCommand}"
                        VerticalOptions="FillAndExpand"
                        HorizontalOptions="FillAndExpand"/>
    </StackLayout>

Relevant code from the renderer:

protected override void OnElementChanged(ElementChangedEventArgs<MyDatePicker> e)
{
    base.OnElementChanged(e);

    if (e.OldElement != null)
    {
        _datePicker.ValueChanged -= DatePickerOnValueChanged;
    }

    if (e.NewElement != null)
    {
        if (Control == null)
        {
            _datePicker = new UIDatePicker(new CGRect(
                e.NewElement.Bounds.X,
                e.NewElement.Bounds.Y,
                e.NewElement.Bounds.Width,
                e.NewElement.Bounds.Height
             ));
            _datePicker.Mode = UIDatePickerMode.DateAndTime;
            _datePicker.Date = (NSDate) Element.Date;
            _datePicker.MaximumDate = (NSDate) Element.Date.AddDays(1);
            _datePicker.MinimumDate = (NSDate) Element.Date.Subtract(TimeSpan.FromDays(5));
            _datePicker.MinuteInterval = 1;

            SetNativeControl(_datePicker);
        }

        _datePicker.ValueChanged += DatePickerOnValueChanged;
    }
}

Best Answer

Answers

Sign In or Register to comment.