How to customize the sfdatagrid header text font style ?

[K Guptha]

is there any simple way to modify the Column header text value

if (e.Column.MappingName == "Dept")
{
e.Column.TextAlignment = TextAlignment.Center;
e.Column.HeaderText = "Developer consultant";
}
here I would like to change the header text font as bold, blue color for the first string (Developer) and Gray color for the second string (consultant). Can you please help me with this any sample or example. Is it possible to do with SfDataGrid ?

[Divakar Subramaniam]

Hi Kumar, 

 

 

If you need to change the HeaderText’s Font style, then it is possible by setting HeaderFontAttribute property as “Bold” or any other. Please refer the below code snippet. 

 

<sfGrid:GridTextColumn HeaderFontAttribute="Bold" MappingName="CustomerID" /> 

 

 

If you need to change the Font color, then it is not possible to achieve directly like above case. However, you can achieve it by using HeaderTemplate. Please refer the below code snippet. 

 

<sfGrid:GridTextColumn MappingName="CustomerID"> 

    <sfGrid:GridTextColumn.HeaderTemplate> 

          <DataTemplate> 

               <Label Text="CustomerID" TextColor="Blue" /> 

          </DataTemplate> 

    </sfGrid:GridTextColumn.HeaderTemplate> 

</sfGrid:GridTextColumn> 

 

 

We have prepared a simple sample for your reference and you can download the same from the below link. 

 

Sample link: http://www.syncfusion.com/downloads/support/forum/128702/ze/DataGridDemo-877850511  

 

 

Regards, 

Divakar. 

 

[K Guptha]

Thanks for your reply, here I would like to display that CustomerID as below :

Customer ID 

is this possible like this.

[Divakar Subramaniam]

Hi Kumar, 

 

 

It is not possible to achieve your requirement in SfDataGrid directly. However, you can achieve it by using HeaderTemplate by loading two labels. Please refer the below code snippet. 

 

<sfGrid:GridTextColumn Width="100" MappingName="CustomerID"> 

    <sfGrid:GridTextColumn.HeaderTemplate> 

        <DataTemplate> 

            <StackLayout Orientation="Horizontal"> 

                <Label FontAttributes="Bold" 

                       HorizontalTextAlignment="Center" 

                       Text="Customer" 

                       TextColor="Black" 

                       VerticalTextAlignment="Center" /> 

                <Label HorizontalTextAlignment="Center" 

                       Text="ID" 

                       TextColor="Blue" 

                       VerticalTextAlignment="Center" /> 

            </StackLayout> 

        </DataTemplate> 

    </sfGrid:GridTextColumn.HeaderTemplate> 

</sfGrid:GridTextColumn> 

 

 

Also, I have attached a working sample for your reference and you can download the same from the below link. 

 

Sample link: http://www.syncfusion.com/downloads/support/forum/128702/ze/DataGridDemo516784980  

 

 

Regards, 

Divakar.