How to use Date Picker in Xceed PropertyGrid?

Question

We are using Extended WPF Toolkit in order to implement PropertyGrid.

The default date picking control does not seem to be the WPF DatePicker, but instead a custom control, if I'm not mistaken.

Usually, we are using DatePicker controls in order to select dates. Is it possible to use them, too, for the PropertyGrid control? We need this in order to provide a consistent date format of dd.MM.yyyy and since this property is a date, time should also not be displayed.

Can this be done using Xceed Property Grid?

[Category("General")]
[DisplayName("Date")]
[PropertyOrder(2)]
public DateTime? Date { get; set; }

Answer 1

What you ask for is not so difficult to achive: Xceed PropertyGrid is high customizable and a property editor can be customized by using the ITypeEditor interface and the Editor attribute.

First of all we need to define a custom editor control:

public class DateTimePickerEditor : DateTimePicker, ITypeEditor
{
    public DateTimePickerEditor()
    {
        Format = DateTimeFormat.Custom;
        FormatString = "dd.MM.yyyy";

        TimePickerVisibility = System.Windows.Visibility.Collapsed;
        ShowButtonSpinner = false;
        AutoCloseCalendar = true;
    }

    public FrameworkElement ResolveEditor(PropertyItem propertyItem)
    {
        Binding binding = new Binding("Value");
        binding.Source = propertyItem;
        binding.Mode = propertyItem.IsReadOnly ? BindingMode.OneWay : BindingMode.TwoWay;

        BindingOperations.SetBinding(this, ValueProperty, binding);
        return this;
    }
}

All the stuff in the constructor are made for obtaining a specific behavior (i.e. no time controls, a specific date format and so on).

Now we need to set the DateTimePickerEditor as the default editor for the object property (that in our sample is called "Date"):

[Category("General")]
[DisplayName("Date")]
[PropertyOrder(2)]
[Editor(typeof(DateTimePickerEditor), typeof(DateTimePicker))]
public Nullable<DateTime> Date

I hope it helps.