Skip to main content
All docs
V24.2

DevExpress v24.2 Update — Your Feedback Matters

Our What's New in v24.2 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

Take the survey Not interested

Bind to Property Grid and its Elements

  • 2 minutes to read

Use the PropertyGridHelper class to bind to a DevExpress.Xpf.PropertyGrid and its elements. The PropertyGridHelper class has the following attached properties:

  • PropertyGrid - a PropertyGridControl instance that is the Property Grid.
  • EditorPresenter - a CellEditorPresenter instance that is used to configure and display cell editors within the selected property.
  • ViewportSize - a Size value that is the Property Grid viewport size.
  • RowData - a DevExpress.Xpf.PropertyGrid.RowData instance that has information about the selected property.
  • RowControl - a DevExpress.Xpf.PropertyGrid.RowControlBase descendant that is the selected property.
  • View - a DevExpress.Xpf.PropertyGrid.PropertyGridView instance that is the Property Grid’s view.

#Examples

#XAML

  • The following XAML snippet illustrates how to use the PropertyGridHelper to customize the DescriptionTemplate:

    <dxprg:PropertyDefinition.DescriptionTemplate>
        <DataTemplate>
            <TextBlock Foreground="Red"
                Text="{Binding Path=(dxprg:PropertyGridHelper.PropertyGrid).SelectedPropertyValue,
                    RelativeSource={RelativeSource Self}}" />
        </DataTemplate>
    </dxprg:PropertyDefinition.DescriptionTemplate>
    
  • The example below illustrates how to use the PropertyGridHelper to change the editor’s cell background color conditionally:

    <dx:ThemedWindow.Resources>
        <Style TargetType="dxprg:PropertyDefinition">
            <Setter Property="ContentTemplate">
                <Setter.Value>
                    <DataTemplate>
                        <dxprg:CellEditorPresenter Name="PART_Editor" />
                        <DataTemplate.Triggers>
                            <DataTrigger Value="True">
                                <DataTrigger.Binding>
                                    <Binding Converter="{local:HighlightFieldConverter}"
                                        Path="(dxprg:PropertyGridHelper.PropertyGrid).SelectedObject"
                                        RelativeSource="{RelativeSource Self}" />
                                </DataTrigger.Binding>
                                <Setter TargetName="PART_Editor" Property="Background" Value="LightPink" />
                            </DataTrigger>
                        </DataTemplate.Triggers>
                    </DataTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </dx:ThemedWindow.Resources>
    

#Code-Behind

You can use the PropertyGridHelper in code-behind. The example below illustrates how to add OK and Cancel buttons to a Property Grid’s editor:

<dxprg:PropertyDefinition Path="*">
    <dxprg:PropertyDefinition.EditSettings>
        <dxe:ButtonEditSettings AllowDefaultButton="False" ValidateOnEnterKeyPressed="False" ValidateOnTextInput="False">
            <dxe:ButtonEditSettings.Buttons>
                <dxe:ButtonInfo GlyphKind="Apply" Click="ApplyButtonClicked" />
                <dxe:ButtonInfo GlyphKind="Cancel" Click="CancelButtonClicked" />
            </dxe:ButtonEditSettings.Buttons>
        </dxe:ButtonEditSettings>
    </dxprg:PropertyDefinition.EditSettings>
</dxprg:PropertyDefinition>
private void ApplyButtonClicked(object sender, RoutedEventArgs e) {
    PropertyGridHelper.GetPropertyGrid((DependencyObject)sender).CloseEditor();
}
private void CancelButtonClicked(object sender, RoutedEventArgs e) {
    PropertyGridHelper.GetPropertyGrid((DependencyObject)sender).HideEditor();
}