How to center the content of cells in a data grid?

Question

I set the min height of a datagrid that way:

<DataGrid MinRowHeight="40">

After feeding the datagrid with datas, the text in each cell is top and left aligned. I could not find an easy way to center that text.

Any suggestions for doing that?

Answer 1

use ElementStyle

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

  <Style x:Key="Centering" TargetType="{x:Type TextBlock}">
       <Setter Property="HorizontalAlignment" Value="Center" />
  </Style>

Answer 2

Final solution:

<Style x:Key="DataGridContentCellCentering" TargetType="{x:Type DataGridCell}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type DataGridCell}">
                <Grid Background="{TemplateBinding Background}">
                    <ContentPresenter VerticalAlignment="Center" />
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Answer 3

Here is a slightly longer version of Arpit Shah's answer.

<DataGrid AutoGenerateColumns="False" IsReadOnly="True" ItemsSource="{Binding Rows}">
    <DataGrid.Resources>
        <Style x:Key="RightAligned" TargetType="DataGridCell">
            <Setter Property="HorizontalAlignment" Value="Right" />
        </Style>
    </DataGrid.Resources>
    <DataGrid.Columns>
        <DataGridTextColumn CellStyle="{StaticResource RightAligned}" 
                            Binding="{Binding Path=Quantity, Mode=OneWay}" 
                            Header="Quantity" Width="60" />
        <DataGridTextColumn Binding="{Binding Path=Category, Mode=OneWay}" 
                            Header="Category" Width="150" />
    </DataGrid.Columns>
</DataGrid>

Answer 4

you can use styles. i add a sample for DataGridCheckBoxColumn, i hope it put you in the right direction.

<DataGridCheckBoxColumn Header="is active" IsReadOnly="False">
      <DataGridCheckBoxColumn.ElementStyle>
            <Style TargetType="CheckBox">
                 <Setter Property="VerticalAlignment" Value="Center"/>
                  <Setter Property="HorizontalAlignment" Value="Center"/>
             </Style>
      </DataGridCheckBoxColumn.ElementStyle>
      <DataGridCheckBoxColumn.Binding>
             <Binding Path="ISACTIVE" ValidatesOnDataErrors="True" Converter="{StaticResource MyBoolToIsActiveConverter}" Mode="TwoWay" UpdateSourceTrigger="PropertyChanged"
                                 NotifyOnValidationError="True" ValidatesOnExceptions="True">
                        </Binding>
                    </DataGridCheckBoxColumn.Binding>
                </DataGridCheckBoxColumn>

Answer 5

Try setting the DataGrid's Vertical and HorizontalContentAlignment to Center

<DataGrid VerticalContentAlignment="Center" HorizontalContentAlignment="Center" />

If that doesn't work, you can use the solution in this answer. It uses a style that aligns the DataGrid cell contents

Answer 6

The following code will center the contents of cells in DataGrid:

<Style TargetType="DataGridCell">
    <Setter Property="TextBlock.TextAlignment" Value="Center" />
</Style>