Andy T
Andy T

Reputation: 1971

WPF - DataGrid Column Header Alignment

I'm using the WPFToolkit DataGrid control and I wanted to restyle some of the column headers so that the header text is displayed vertically instead of horizontally (the data in the column is all numeric and therefore, not very wide, but the header text is long). So I created a DataTemplate to and tried to get the DataGridColumn.HeaderTemplate to it. This is my template:

<DataTemplate x:Key="headerTemplate"> 
        <StackPanel VerticalAlignment="Bottom" HorizontalAlignment="Left" Background="Aqua"> 
            <StackPanel.LayoutTransform> 
                <RotateTransform Angle="-90"/> 
            </StackPanel.LayoutTransform> 
            <TextBlock Text="{Binding}" VerticalAlignment="Bottom" HorizontalAlignment="Left" Background="Pink"> 
            </TextBlock> 
        </StackPanel> 
    </DataTemplate>

This works just fine, except the alignment of the header is always left and center. No combination of alignments for the StackPanel or the TextBlock seems to make any difference. I would like to have the text aligned at the bottom and middle. How can I make it do that?

Thanks,

AT

Upvotes: 5

Views: 18899

Answers (3)

jle
jle

Reputation: 9479

If you don't want to mess up the style that you have already applied, use BasedOn:

<DataGrid.ColumnHeaderStyle>
                <Style BasedOn="{StaticResource MetroDataGridColumnHeader}" TargetType="{x:Type DataGridColumnHeader}">
                    <Setter Property="HorizontalContentAlignment" Value="Center" />
                </Style>
            </DataGrid.ColumnHeaderStyle>

Upvotes: 3

SINGULARITY
SINGULARITY

Reputation: 1212

This also works

<Style TargetType="{x:Type DataGridColumnHeader}">
   <Setter Property="HorizontalContentAlignment" Value="Center"/>
</Style>

Add the x:Key="" if you don't want to target all DataGridColumnHeader's

Upvotes: 2

Andy T
Andy T

Reputation: 1971

OK, found the answer.

The property I was looking for was VerticalContentAlignment.

I created a style and attached that using the HeaderStyle property, and it worked :)

<Style x:Key="VerticalGridHeaderStyle" TargetType="tk:DataGridColumnHeader">
    <Setter Property="VerticalContentAlignment" Value="Bottom"/>
</Style>

Upvotes: 8

Related Questions