1
votes

There is a WPF Datagrid, with nothing special with it. It has sometimes HeadersVisibility All/Row, depends on the usage in our code. But regardless of the header style, it has alignment issues. Neither the header/data text are aligned properly, nor the first headers in the top-left corner, 1 pixel is missing here. I attach a picture to be more visible.

enter image description here

This really looks unprofessional and amateur. The text align is much worse than the top-left corner, so if I could fix that it would already be a big improvement.

Vertical: as I see, the row header texts are aligned properly to the center, unlike the data which is a bit above.

Horizontal: here does not matter which one is aligned to which (header<>data), but at least they should be in-line.

Thanks

EDIT The XAML part:

<dg2d:DataGrid2DT.CellStyle>
    <Style TargetType="wpftoolkit:DataGridCell">
            <Setter Property="TextBlock.VerticalAlignment" Value="Stretch"/>
            <Setter Property="TextBlock.HorizontalAlignment" Value="Stretch"/>
        <Style.Triggers>
            <Trigger Property="IsSelected" Value="True">
                <Setter Property="Background" Value="LightBlue"/>
            </Trigger>
        </Style.Triggers>
    </Style>
</dg2d:DataGrid2DT.CellStyle>

I tried to add <Setter Property="TextBlock.Padding" Value="5, 5, 0, 0" /> but this had no effect. Just for try I added <Setter Property="TextBlock.TextAlignment" Value="Right" /> - this works fine. Only paddig does nothing. Maybe cell is too small for padding?

EDIT2

If I set VerticalAlignment to "Center" Textblock is put to the center of the cell. With this the text is more or less in the center, but not good, as textblock is not filling the cell anymore. I want the textblock to fill the cell, and have the text vertically centered. Using "Padding" should solve my problem, but it has no effect.

enter image description here

2
Have you tried to set the VerticalAlingment and/or 'HorizontalAlignment' of the content-control of your rowheader or column-header. You can also try to set them on your CellTomtom
But the alignment issue is not with the row or column header, but with the data cell. See the screenshot, header text is well-aligned, unlike the data cell.Zotyi
How do you define the cell? as DataGridTemplateColumn?Tomtom

2 Answers

1
votes

You can center the text in your DataGridColumn like:

<DataGridTemplateColumn Header="1">
    <DataGridTemplateColumn.CellTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding Item1Property}" VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </DataTemplate>
    </DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
0
votes

I found the solution, by using Padding I can align the cell text to be inline with the header texts. However, as I mentioned, using simple Padding or TextBlock.Padding does not work, you need a "trick", I found it here: Set a padding on dataGridCells in WPF

<dg2d:DataGrid2DT.CellStyle>
    <Style TargetType="wpftoolkit:DataGridCell">
        <Setter Property="TextBlock.VerticalAlignment" Value="Stretch"/>
        <Setter Property="TextBlock.HorizontalAlignment" Value="Stretch"/>

--> solution
        <Setter Property="Padding" Value="2,2,0,0"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type wpftoolkit: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>
<-- solution

        <Style.Triggers>
            <Trigger Property="IsSelected" Value="True">
                <Setter Property="Background" Value="LightBlue"/>
            </Trigger>
        </Style.Triggers>
    </Style>
</dg2d:DataGrid2DT.CellStyle>