How to use CustomEditor of PropertyGrid to display a particular property?

2 mins read

CustomEditor support enables you to set custom value editors for particular properties instead of default editors

In the example below, by default a TextBox is used to display String data type. By setting a CustomEditor for this String property, SfTextBoxExt will be displayed as the ValueEditor

The same has been explained in the code example below

MainWindow.xaml

 
<syncfusion:PropertyGrid x:Name="pgrid" HorizontalAlignment="Stretch" ButtonPanelVisibility="Visible"  VerticalAlignment="Stretch"  SearchBoxVisibility="Visible" DefaultPropertyPath="Content"  BorderThickness="0" Background="White"/>

MainWindow.xaml.cs

public MainWindow()
        {
            InitializeComponent();
            this.Loaded += new RoutedEventHandler(MainWindow_Loaded);
            SkinStorage.SetVisualStyle(this, "Metro");
            this.pgrid.SelectedObject = new Customer();
        }
        void MainWindow_Loaded(object sender, RoutedEventArgs e)
        {
 
            CustomEditor TextBoxEditor = new CustomEditor() { HasPropertyType = true, PropertyType = typeof(String) };
 
 
            TextBoxEditor.Editor = new CustomEditorPropertyGridSample.ICustomTypeEditors.SfTextBoxEditor();
 
 
            pgrid.CustomEditorCollection.Add(TextBoxEditor);
 
            pgrid.RefreshPropertygrid();
        }

Customer.cs

public class Customer
{
private string _name;
private int _age;
private DateTime _dateOfBirth;
private string _SSN;
private string _address;
private string _email;
private bool _frequentBuyer;
 
public string Name
{
get
{
return _name;
}
set
{
_name=value;
}
}
 
public string SSN
{
get
{
return _SSN;
}
set
{
_SSN=value;
}
}
 
public string Address
{
get
{
return _address;
}
set
{
_address=value;
}
}
 
public DateTime DateOfBirth
{
get
{
return _dateOfBirth;
}
set
{
_dateOfBirth=value;
}
}
 
public int Age
{
get
{
return _age;
}
set
{
_age=value;
}
}
 
public bool FrequentBuyer
{
get
{
return _frequentBuyer;
}
set
{
_frequentBuyer=value;
}
}
 
public string Email
{
get
{
return _email;
}
set
{
_email=value;
}
}
}

ICustomTypeEditors.cs

public  class ICustomTypeEditors
    {
        public class SfTextBoxEditor : ITypeEditor
        {
 
            public void Attach(PropertyViewItem property, PropertyItem info)
            {
                if (info.CanWrite)
                {
                    var binding = new Binding("Value")
                    {
                        Mode = BindingMode.TwoWay,
                        Source = info,
                        ValidatesOnExceptions = true,
                        ValidatesOnDataErrors = true
                    };
                    BindingOperations.SetBinding(text, SfTextBoxExt.TextProperty, binding);
                }
                else
                {
                   
                    var binding = new Binding("Value")
                    {
 
                        Source = info,
                        ValidatesOnExceptions = true,
                        ValidatesOnDataErrors = true
                    };
                    BindingOperations.SetBinding(text, SfTextBoxExt.TextProperty, binding);
                }
            }
 
            SfTextBoxExt text;
            public object Create(PropertyInfo propertyInfo)
            {
                text = new SfTextBoxExt() { };
              
              
                return text;
            }
 
            public void Detach(PropertyViewItem property)
            {
                throw new NotImplementedException();
            }
        }
    }

In the following screenshot, SfTextBoxExt is displayed as the Value Editor

Did you find this information helpful?

Yes

Comments (0)

How to use CustomEditor of PropertyGrid to display a particular property?

Access denied