WPF datagridtextcolumn vertical content alignment not working

Question

I am new to c# and looking for some help on WPF UI.

1) I would like to have my data grid's content all to be shown in center of the column.

2) In order to look nice in UI, I need the datagridtextboxcolumn and datagridtemplatecolumn (combo box) width and height fits the columns.

Currently, I already implement the style of Content Presenter with Stretch VerticalAlignment and HorizontalAlignment which success make the data fits to the columns width and height.

And it success showing the data horizontally center after I set setter property of TextBlock.TextAlignment.

But the data is not showing in the center vertically even though I already set the setter property of Vertical Content Alignment to Center.

So, I need experts to give me some advices on making the data shown in center vertically and horizontally with stretching the width height to fits the columns.

Below is my style code

    <Style x:Key="Body_Content_DataGrid_Centering"
    TargetType="{x:Type DataGridCell}">
        <Setter Property="TextBlock.TextAlignment" Value="Center" />
        <Setter Property="VerticalContentAlignment" Value="Center" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type DataGridCell}">
                    <Grid Background="{TemplateBinding Background}">
                        <ContentPresenter VerticalAlignment="Stretch" HorizontalAlignment="Stretch"/>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

And below will be my DataGrid implementation code:

    <DataGrid x:Name="dataGridAccount" RowHeight="27" MinRowHeight="50" ColumnHeaderHeight="50" MinColumnWidth="150" RowHeaderWidth="0" Margin="0" Grid.Row="1" AutoGenerateColumns="False" CellStyle="{StaticResource Body_Content_DataGrid_Centering}" VerticalContentAlignment="Bottom">
        <DataGrid.Columns>
            <DataGridTextColumn Binding="{Binding username}" ClipboardContentBinding="{x:Null}" Header="Username" Width="1*">
                <DataGridTextColumn.HeaderStyle>
                    <Style TargetType="{x:Type DataGridColumnHeader}">
                        <Setter Property="HorizontalContentAlignment" Value="Center"/>
                    </Style>
                </DataGridTextColumn.HeaderStyle>
            </DataGridTextColumn>
            <DataGridTemplateColumn Header="Entry Level" Width="1*">
                <DataGridTemplateColumn.HeaderStyle>
                    <Style TargetType="{x:Type DataGridColumnHeader}">
                        <Setter Property="HorizontalContentAlignment" Value="Center"/>
                    </Style>
                </DataGridTemplateColumn.HeaderStyle>
                <DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding entryLevel}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                    </DataTemplate>
                </DataGridTemplateColumn.CellTemplate>
                <DataGridTemplateColumn.CellEditingTemplate>
                     <DataTemplate>
                        <ComboBox ItemsSource="{StaticResource entryLevel}"
                                                  SelectedItem="{Binding entryLevel}" Margin="0" HorizontalContentAlignment="Center" VerticalContentAlignment="Center"/>
                     </DataTemplate>
                </DataGridTemplateColumn.CellEditingTemplate>
            </DataGridTemplateColumn>
        </DataGrid.Columns>
    </DataGrid>

Current Result: http://imgur.com/a/BfJrC

Expected Result: http://imgur.com/a/v8v8a

English is not my mother tongue, please excuse any errors on my part.

Thanks in advanced.

Eike B Eike B · Accepted Answer · 2017-09-08T06:30:04

I would suppose, that your Textblock inside the GridCells are not taking the whole space of the cell. You set the VerticalAlignment="Stretch" HorizontalAlignment="Stretch" for the GridCell, but not for the TextBlock inside this Cell. So you should add both Alignments to the TextBlock Style inside the Cells as well.

WPF datagridtextcolumn vertical content alignment not working

2 Answers