DatePicker & TimePicker width and rendering problems on Universal Windows

Thibault_VellicusThibault_Vellicus CHUniversity ✭✭


For those having troubles with the rendering of DatePicker or TimePicker on Universal Windows platform, I had to write this custom renderer:

[assembly: ExportRenderer(typeof(Xamarin.Forms.TimePicker), typeof(MyTimePickerRenderer))] [assembly: ExportRenderer(typeof(Xamarin.Forms.DatePicker), typeof(MyDatePickerRenderer))] namespace Observo.Client.Win.CustomRenderer { public class MyDatePickerRenderer : ViewRenderer<Xamarin.Forms.DatePicker, Windows.UI.Xaml.Controls.DatePicker> { protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.DatePicker> e) { base.OnElementChanged(e); if (e.NewElement != null) { SetNativeControl(new Windows.UI.Xaml.Controls.DatePicker { MinWidth = 0 }); } } protected override Windows.Foundation.Size MeasureOverride(Windows.Foundation.Size availableSize) { //availableSize.Width value is wrong!!! return base.MeasureOverride(availableSize); } } public class MyTimePickerRenderer : ViewRenderer<Xamarin.Forms.TimePicker, Windows.UI.Xaml.Controls.TimePicker> { protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.TimePicker> e) { base.OnElementChanged(e); if (e.NewElement != null) { SetNativeControl(new Windows.UI.Xaml.Controls.TimePicker { MinWidth = 0 }); } } } }

Initial post from @AlessandroMoscatelli :


  • Thibault_VellicusThibault_Vellicus CHUniversity ✭✭

    Or maybe easier in App.xaml:

    <Application x:Class="ObservoForm.Client.Win.App" xmlns="" xmlns:x="" xmlns:local="using:ObservoForm.Client.Win" RequestedTheme="Light"> <Application.Resources> <ResourceDictionary> <Style TargetType="TimePicker"> <Setter Property="MinWidth" Value="0" /> </Style> <Style TargetType="DatePicker"> <Setter Property="MinWidth" Value="0" /> </Style> </ResourceDictionary> </Application.Resources> </Application>

  • ShranarShranar FRMember

    It works but I have an issue on the dateChange event (DatePicker). The date of the Xamarin.Forms.Datepicker don't change and the entry of the datepicker become empty.

    Bind the Xamarin.Forms.Datepicker works now.

    • DatePickerRenderer
    protected override void OnElementChanged(ElementChangedEventArgs e)
                if (e.NewElement != null)
                    SetNativeControl(new Windows.UI.Xaml.Controls.DatePicker { MinWidth = 0 });
                    this.Control.DateChanged += dateChanged;     
    private void dateChanged(object sender, DatePickerValueChangedEventArgs e)
                this.Element.Date = e.NewDate.Date;

    However I don't know how to correctly bind the datepicker entry.

  • joao.martinsjoao.martins PTMember
    edited August 2016

    I had an exception when doing the XAML version: Message "Position 14:37. Can't resolve MinWidthProperty on DatePicker". Can you help please? I did this inside a Grid:
    <Grid.Resources> <ResourceDictionary> <Style TargetType="DatePicker"> <Setter Property="MinWidth" Value="0" /> </Style> </ResourceDictionary> </Grid.Resources>

  • Thibault_VellicusThibault_Vellicus CHUniversity ✭✭

    @joao.martins : Are you writing this code into the PCL project? If yes, it won't work. You have to write the XAML code directly in the App.xaml from the Windows UWP project.
    We define here the UI from the Windows.UI.Xaml.Controls.DatePicker control and not the Xamarin.Forms.DatePicker.

  • joao.martinsjoao.martins PTMember

    @VellicusThibault: Well, that was the problem! And it is solved. Many thanks!

Sign In or Register to comment.