How to customize the header text of a grid column with different colors?

1 min read

SfDataGrid allows you customize the header text of a grid column with different colors using the SfDataGrid.HeaderTemplate. You can load two labels inside a StackLayout with horizontal orientation and customize the text color of the Labels to achieve the requirement.

The below code example illustrates how to customize the header text of a grid column with different colors using the GridColumn.HeaderTemplate.

<sfGrid:SfDataGrid x:Name ="dataGrid"

ColumnSizer="Star"

AutoGenerateColumns="False"

ItemsSource="{Binding OrdersInfo}">

<sfGrid:SfDataGrid.Columns>

<sfGrid:GridTextColumn MappingName="OrderID">

<sfGrid:GridTextColumn.HeaderTemplate>

</StackLayout>

</DataTemplate>

</sfGrid:GridTextColumn.HeaderTemplate>

</sfGrid:GridTextColumn>

<sfGrid:GridTextColumn MappingName="CustomerID"/>

<sfGrid:GridTextColumn MappingName="Freight"/>

<sfGrid:GridTextColumn MappingName="Country"/>

</sfGrid:SfDataGrid.Columns>

</sfGrid:SfDataGrid>

On executing the above code example, the below output is obtained.

$C:\Users\pavithra.sivakumar\AppData\Local\Microsoft\Windows\INetCacheContent.Word\Screenshot_2017-02-28-16-52-58.png$

Sample Link

How to customize the header text with different colors?

Did you find this information helpful?

Yes

Comments (0)

How to customize the header text of a grid column with different colors?

Access denied