SfDataGrid custom header style with theme

[David García]

Hello,

I'm trying to customize the background of the Column header of the SfDataGrid control in WPF while also apply the MaterialLight theme.

I try to create a style to only change the background but I don't know on which style base it on so the other elements of the Header are as the MaterialLight theme defines, and only modify the background color.

Any can help me with this?

Thanks.

[Elavazhagan Elangovan]

Hi David García,

We have reviewed your query based on the information you provided. Your requirement to apply a background color to the header column alone while using themes can be achieved by setting a style for the GridHeaderCellControl element using a style template. Whenever you customize the style while a theme is applied, please ensure to set the ApplyThemeAsDefaultStyle property to true. This property ensures that the theme is applied based on the default style, resulting in a consistent and visually appropriate user interface.

Xaml code snippet related Apply styles to Header column:

<Window.Resources>

       <Style TargetType="syncfusion:GridHeaderCellControl" x:Key="headerStyle">

           <Setter Property="Background" Value="LightBlue"/>

       </Style>

   </Window.Resources>

   <Grid>

       <syncfusion:SfDataGrid x:Name="dataGrid" ItemsSource="{Binding Orders}" HeaderStyle="{StaticResource headerStyle}"/>

   </Grid>

C# code snippet related to ApplyThemeAsDefaultStyle set as true:

public MainWindow()

{

    SfSkinManager.ApplyThemeAsDefaultStyle=true;

    InitializeComponent();           

}

UG Link: ApplyStylesTocolumnHeader
                 ApplyThemeAsDefaultStyle

Find the sample demo in the attachment.

Please let me know if you have any concerns.

Regards,
Elavazhagan E.

If this post is helpful, please consider Accepting it as the solution so that other members can locate it more quickly.

Attachment: DataGridDemo_e178d356.zip