Bind to Property Grid and its Elements

• Dec 20, 2021
• 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:

  XAML

  <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:

  XAML

  <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:

XAML

<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>

C#

private void ApplyButtonClicked(object sender, RoutedEventArgs e) {
    PropertyGridHelper.GetPropertyGrid((DependencyObject)sender).CloseEditor();
}
private void CancelButtonClicked(object sender, RoutedEventArgs e) {
    PropertyGridHelper.GetPropertyGrid((DependencyObject)sender).HideEditor();
}

VB.NET

Private Sub ApplyButtonClicked(ByVal sender As Object, ByVal e As RoutedEventArgs)
    PropertyGridHelper.GetPropertyGrid(DirectCast(sender, DependencyObject)).CloseEditor()
End Sub
Private Sub CancelButtonClicked(ByVal sender As Object, ByVal e As RoutedEventArgs)
    PropertyGridHelper.GetPropertyGrid(DirectCast(sender, DependencyObject)).HideEditor()
End Sub