Set a padding on dataGridCells in WPF

WpfDatagridStyling

Wpf Problem Overview


simple question: How can I set a padding on a dataGridCell in WPF? (either one at a time or on all cells, I don't care)

I have tried using the DataGrid.CellStyle property by adding a setter on the DataGridCell.Padding property as well as using the DataGridColumn.CellStyle property in the same way with no effect.

I also tried using the DataGridColumn.ElementStyle property with no more luck.

I'm kind of stuck there, has anyone managed to get a padding applied on a dataGridCell?

NB: I'll add that no, I cannot use transparent borders to do this, since I already use the border properties for something else. I also cannot use the margin property (which seems to work, surprisingly enough) as I use the background property and I don't want any "blank" space between my cells.

Wpf Solutions


Solution 1 - Wpf

The problem is that the Padding isn't transfered to the Border that's in the Template for DataGridCell. You can edit the Template and add the TemplateBinding for Padding

<DataGrid ...>
    <DataGrid.CellStyle>
        <Style TargetType="DataGridCell">
            <Setter Property="Padding" Value="20"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type DataGridCell}">
                        <Border Padding="{TemplateBinding Padding}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
                            <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </DataGrid.CellStyle>
    <!--...-->
</DataGrid>

Solution 2 - Wpf

Here's a cleaner method (my opinion) that combines the approach from David

<Resources>
    <Style x:Key="ColumnElementStyle" TargetType="TextBlock">
        <Setter Property="Margin" Value="5,0,10,0" />
    </Style>
</Resources>

then...

<DataGridTextColumn ElementStyle="{StaticResource ColumnElementStyle}" />
<DataGridTextColumn ElementStyle="{StaticResource ColumnElementStyle}" />

(in my case, my rows are readonly, so no EditingStyle)

Solution 3 - Wpf

Almost 5 years later, since this question seems to still be of use (it is still getting upvotes) and since it has been requested, here is the solution I used (with the ElementStyle) on a TextColumn (but you can do the same for any type of DataGridColumn):

I did it all in code behind:

class MyTextColumn : DataGridTextColumn
{
	public MyTextColumn()
	{
		ElementStyle = new Style(typeof(TextBlock));
		EditingElementStyle = new Style(typeof(TextBox));

		ElementStyle.Setters.Add(new Setter(FrameworkElement.MarginProperty, new Thickness(3)));
		EditingElementStyle.Setters.Add(new Setter(Control.PaddingProperty, new Thickness(0, 1, 0, 1)));
	}
}

But if you want to do it directly in xaml:

<DataGrid.Columns>
    <DataGridTextColumn>
        <DataGridTextColumn.ElementStyle>
            <Style TargetType="TextBlock">
                <Setter Property="Margin" Value="3"/>
            </Style>
        </DataGridTextColumn.ElementStyle>
        <DataGridTextColumn.EditingElementStyle>
            <Style TargetType="TextBox">
                <Setter Property="Padding" Value="0 1 0 1"/>
            </Style>
        </DataGridTextColumn.EditingElementStyle>
    </DataGridTextColumn>
</DataGrid.Columns>

Solution 4 - Wpf

You could also try changing

{Binding BindingValue, StringFormat={}{0:#0.0000}}

to

{Binding BindingValue, StringFormat={}{0:#0.0000 }}

Interestingly enough WPF's XAML {0:#0.0000 } will honor this extra space character in the format of the rendered control to move your values off of the edge of your grid columns.

Solution 5 - Wpf

<DataGrid.Columns>
      <DataGridTextColumn  MinWidth="100" Header="Changed by"  Width=""  Binding="{Binding Changedby}" IsReadOnly="True"  >
        <DataGridTextColumn.CellStyle>
          <Style TargetType="DataGridCell">
          <Setter Property="BorderThickness" Value="0"/>
          <Setter Property="Background" Value="Transparent" />
         <Setter Property="FrameworkElement.HorizontalAlignment"Value="Center"/>
          </Style>
      </DataGridTextColumn.CellStyle>
    </DataGridTextColumn>

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionDavidView Question on Stackoverflow
Solution 1 - WpfFredrik HedbladView Answer on Stackoverflow
Solution 2 - WpfScott BrickeyView Answer on Stackoverflow
Solution 3 - WpfDavidView Answer on Stackoverflow
Solution 4 - WpfJacobView Answer on Stackoverflow
Solution 5 - WpfRajView Answer on Stackoverflow