Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to Set style for DataGrid header in WPF

Tags:

I have a DataGrid like this:

<DataGrid AutoGenerateColumns="False"             Height="221"            HorizontalAlignment="Center"            VerticalContentAlignment="Center"            HorizontalContentAlignment="Center"            Margin="6,269,0,0"            Name="dataGrid1"            VerticalAlignment="Center"            Width="875"            SelectionChanged="dataGrid1_SelectionChanged">     <DataGrid.Columns>         <DataGridTextColumn x:Name="Id"                              Header="ID"                             Binding="{Binding Path=Key}"                              HeaderStyle="" />         <DataGridTemplateColumn Header="Image"                                  Width="SizeToCells"                                  IsReadOnly="True"                                  MinWidth="80">             <DataGridTemplateColumn.CellTemplate>                 <DataTemplate>                     <Image Width="16"                             Height="16"                            Source="{StaticResource MyImageSource}"                            HorizontalAlignment="Center"                             VerticalAlignment="Center"/>                 </DataTemplate>             </DataGridTemplateColumn.CellTemplate>         </DataGridTemplateColumn>     </DataGrid.Columns> </DataGrid> 

How I can center DataGrid Header? and apply style for it?

thanks


Edit 1):

after write this code:

<DataGrid.ColumnHeaderStyle>     <Style TargetType="{x:Type DataGridColumnHeader}">         <Setter Property="FontWeight"  Value="Bold" />         <Setter Property="HorizontalAlignment" Value="Center" />         <Setter Property="HorizontalContentAlignment" Value="Center" />     </Style> </DataGrid.ColumnHeaderStyle> 

grid columns become :

enter image description here

Why?

like image 789
Arian Avatar asked Oct 30 '11 07:10

Arian


2 Answers

To avoid the effect of the header collapsing simply correct your style in this way:

  <Setter Property="HorizontalAlignment" Value="Stretch" />   <Setter Property="HorizontalContentAlignment" Value="Center" /> 
like image 131
j.b. Avatar answered Sep 23 '22 14:09

j.b.


Adding the Style for DatagridColumnHeader of the Datagrid

<DataGrid Name="GatewayPortsDataGrid" Height="auto" Width="auto">      <DataGrid.Resources>             <Style BasedOn="{StaticResource {x:Type DataGridColumnHeader}}" TargetType="{x:Type DataGridColumnHeader}" >             <Setter Property="Background" Value="White" />             <Setter Property="Foreground" Value="Black" />                                                <Setter Property="BorderBrush" Value="Black"/>                                               <Setter Property="BorderThickness" Value="1 1 1 1"/>                                            <Setter Property="Margin" Value="-1,-1,0,0" />             <Setter Property="Height" Value="28" />                                                                                 <Setter Property="Width" Value="auto"/>                                                 <Setter Property="HorizontalContentAlignment" Value="Center"/>                                                                                     </Style>         </DataGrid.Resources> </DataGrid> 
like image 41
Maghalakshmi Saravana Avatar answered Sep 25 '22 14:09

Maghalakshmi Saravana