Question

I’m using following code to get the cells of my datagrid to display text in the center:

    <Style x:Key="CenteredTextColumn" TargetType="{x:Type DataGridCell}">
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="BorderBrush" Value="Transparent"/>
        <Setter Property="BorderThickness" Value="1"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type DataGridCell}">
                    <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
                        <ContentPresenter VerticalAlignment="Center" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="VerticalAlignment" Value="Stretch"/>
        <Setter Property="HorizontalAlignment" Value="Stretch"/>
        <Setter Property="Foreground" Value="Black">                
        </Setter>
        <Style.Triggers>
            <Trigger Property="IsSelected" Value="True">
                <Setter Property="Background">
                    <Setter.Value>
                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                            <GradientStop Color="#FFE3ECF7" Offset="0"/>
                            <GradientStop Color="#FF71DDF9" Offset="1"/>
                            <GradientStop Color="#FF5091DC" Offset="0.546"/>
                        </LinearGradientBrush>
                    </Setter.Value>
            </Setter>
                <Setter Property="Foreground" Value="White"/>
                <Setter Property="BorderBrush" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
            </Trigger>
            <Trigger Property="IsKeyboardFocusWithin" Value="True">
                <Setter Property="BorderBrush" Value="{DynamicResource {x:Static DataGrid.FocusBorderBrushKey}}"/>
            </Trigger>                  
        </Style.Triggers>
    </Style>

it works fine, except that when I’m editing the contents of a cell, it looks like this:

I can resize the textBox by using the setter:

          <Trigger Property="IsEditing" Value="True">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type DataGridCell}">
                            <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
                                <ContentPresenter VerticalAlignment="Stretch" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                            </Border>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>               
            </Trigger>

but this causes the text in the textbox to move up:

How do I make the textbox to take the whole cell without moving the text as well?

UPDATE When I use following template:

<ControlTemplate TargetType="{x:Type DataGridCell}">
                    <Grid VerticalAlignment="Center">
                        <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
                            <ContentPresenter VerticalAlignment="Stretch" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                        </Border>
                    </Grid>
                </ControlTemplate>

My grid selection gets scruwed up:

Answer 1

will putting it in the grid that is stretched work? Although that would add an additional control for each cell..

<ControlTemplate TargetType="{x:Type DataGridCell}">
        <Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="White">
            <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
                <ContentPresenter VerticalAlignment="Center" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
            </Border>
        </Grid>
    </ControlTemplate>

also, thanks to the screenshot, there it looks like that DataGrid’s SelectionUnit is a Row, is that needed for your app? If it’s not, then specifying SelectionUnit=”Cell” and forcing active selection’s color to be white, also will solve the problem