如何为UWP的DatePicker创建自定义渲染器? [英] How can I create a custom renderer for DatePicker for UWP?

问题描述

我正在尝试为UWP创建自定义DatePicker渲染器，但出现编译错误. 试图获取CalenderDatePicker而不是普通的DataPicker.无论我尝试一个还是另一个，我都遇到相同的错误.

I'm trying to create a custom DatePicker renderer for UWP but I'm getting a compile error. Trying to get a CalenderDatePicker instead of the normal DataPicker. I am getting the same error whether I try one or the other.

我的代码是:

CustomControl.cs

CustomControl.cs

namespace myNameSpace.CustomControl
{
    public class CustomDatePicker : DatePicker
    {
    }
}

在UWP文件夹中还有我的CustomDatePickerRenderer.cs

And my CustomDatePickerRenderer.cs in the UWP folder

[assembly: ExportRenderer(typeof(CustomDatePicker), typeof(CustomDatePickerRenderer))]
namespace myNameSpace.UWP
{    
    public class CustomDatePickerRenderer : ViewRenderer<DatePicker, Windows.UI.Xaml.Controls.CalendarDatePicker>, ITabStopOnDescendants, IDontGetFocus
    {
        protected override void OnElementChanged(ElementChangedEventArgs<DatePicker> e)
        {
            base.OnElementChanged(e);

            if (Control == null)
            {
                Windows.UI.Xaml.Controls.CalendarDatePicker datePicker = new Windows.UI.Xaml.Controls.CalendarDatePicker();
                SetNativeControl(datePicker);
            }
        }
    }
}

我得到的错误是:

The type 'Windows.UI.Xaml.Controls.DatePicker' cannot be used as type parameter 'TElement' in the generic type or method 'ViewRenderer<TElement, TNativeElement>'. There is no implicit reference conversion from 'Windows.UI.Xaml.Controls.DatePicker' to 'Xamarin.Forms.View'.

从文档中我可以发现这应该没问题-是否无法为DatePicker创建自定义渲染器?请帮忙.

From the documentation I can find this should be ok - is it not possible to create a custom renderer for the DatePicker? Please help.

推荐答案

对于经验丰富的开发人员来说，这可能不是一件大事，但是我很高兴我能用它-用UWP CalendarDatePicke替换Xamarin.Forms DataPicker-因此我将发布我的工作解决方案(如果其他人可以使用它的话).

This might not be a big thing by experiences developers, but I'm thrilled that I got it working - substituting the Xamarin.Forms DataPicker with the UWP CalendarDatePicke - so I'll just post my working solution, if someone else could use it.

感谢pinedax解决了我的第一个问题-最后我实际上将其更改为CustomDatePicker，因为这是MS文档中的内容.

Thanks to pinedax for solving my initial problem - which I actually changed to my CustomDatePicker in the end, because this is what is in the documentation from MS.

我需要做的最后一件事是确保在两个不同控件之间注册的日期发生更改，因为它们为此使用了不同的事件.

The last thing I needed was to ensure that Date changes where registered between to two different controls, since they use different events for this.

我的代码是:

CustomDatePicker.cs

CustomDatePicker.cs

namespace myNameSpace.CustomControl
{
    public class CustomDatePicker : DatePicker
    {        
    }
}

UWP文件夹中的CustomDatePickerRenderer.cs

CustomDatePickerRenderer.cs in the UWP folder

[assembly: ExportRenderer(typeof(CustomDatePicker), typeof(CustomDatePickerRenderer))]
namespace myNameSpace.UWP
{   
    public class CustomDatePickerRenderer : ViewRenderer<CustomDatePicker, Windows.UI.Xaml.Controls.CalendarDatePicker>
    {
        protected override void OnElementChanged(ElementChangedEventArgs<CustomDatePicker> e)
        {
            base.OnElementChanged(e);

            if (e.OldElement != null)
            {
                // Unsubscribe from event handlers and cleanup any resources
                Control.DateChanged -= OnDateChanged;
                Element.DateSelected -= OnDateSelected;
            }

            if (e.NewElement != null)
            {
                if (Control == null)
                {
                    // Instantiate the native control and assign it to the Control property with
                    // the SetNativeControl method
                    if (Control == null)
                    {
                        Windows.UI.Xaml.Controls.CalendarDatePicker datePicker = new Windows.UI.Xaml.Controls.CalendarDatePicker();
                        datePicker.FirstDayOfWeek = Windows.Globalization.DayOfWeek.Monday;
                        SetNativeControl(datePicker);
                    }
                }
                Control.DateChanged += OnDateChanged;
                Element.DateSelected += OnDateSelected;
            }
        }

        private void OnDateChanged(CalendarDatePicker sender, CalendarDatePickerDateChangedEventArgs e)
        {           
            DateTimeOffset dto = (DateTimeOffset)e.NewDate;
            Element.Date = dto.DateTime;
        }

        private void OnDateSelected(Object sender, DateChangedEventArgs e)
        {
            DateTime dt = e.NewDate;
            Control.Date = new DateTimeOffset(dt);
        }
    }   
}

现在我可以从Xamarin.Forms XAML文件中引用我的CustomDatePicker(UWP CalendarDatePicker)

And I can now reference my CustomDatePicker (UWP CalendarDatePicker) from my Xamarin.Forms XAML file

<local:CustomDatePicker x:Name="FilterDatePicker" DateSelected="OnDateFilterDateChanged" VerticalOptions="Center"></local:CustomDatePicker>

这篇关于如何为UWP的DatePicker创建自定义渲染器?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！