Truncation problem with Xamarin.Forms iOS inline UIDatePicker

156 views Asked by At

The default iOS behaviour of a Xamarin.Forms DatePicker view is the iOS "Wheel" UIDatePicker. enter image description here

Btw this control is quite ugly and users complained because they wanted (as happening in Android) a calendar view to choose from.

So after a quick search, I came across a new functionality available from iOS 14 which allows to use a "calendar" style for the UIDatePicker.

This is accomplished by a custom renderer calling the PreferredDatePickerStyle with the Inline value:

public class CustomDatePickerRenderer : DatePickerRenderer
{
    protected override void OnElementChanged(ElementChangedEventArgs<DatePicker> e)
    {
        base.OnElementChanged(e);

        if (Control != null)
        {
            if (UIDevice.CurrentDevice.CheckSystemVersion(14, 0))
            {
                UIDatePicker picker = (UIDatePicker)Control.InputView;
                picker.PreferredDatePickerStyle = UIDatePickerStyle.Inline;
            }
        }
    }
}

The result is fine on wider iPhones, but on iPhone 8 the effect is this:

enter image description here

The last calendar row is off screen and there's no way to show it (no scrolling) Has anyone encountered and solved this situation ?

2

There are 2 answers

3
Liqun Shen-MSFT On

I can reproduce this issue. Not only for iPhone8 but also for 8 Plus, iPhone SE. All of these devices have physical Home Button. You could report an issue here: Xamarin.Forms Issues On Github. As an alternative, you could try using UIDatePickerStyle.Compact or Automatic.

0
Ibrahim Elkady On

UIDatePicker picker = (UIDatePicker)Control.InputView;

  picker.PreferredDatePickerStyle = UIDatePickerStyle.Inline;

// this Line Will Fix it

  picker.AutoresizingMask = UIViewAutoresizing.None;