How to alter the FontWeight for a certain column in WPF DataGrid?
In SfDataGrid, you can apply the style for every cell in a particular column based on CellValues in WPF DataGrid You can customize the FontWeight of the cells in a particular column, based on its cell content in two ways.
- Customize Style using Converters.
- CellStyleSelector.
Customize Style using Converters
You can customize the FontWeight of GridCell based on its data, by customizing its Style and Writing Converter for FontWeight property that converts the FontWeight based on bound data. The customized style can be set to SfDataGrid.CellStyle or GridColumn.CellStyle property based on your requirement.
XAML
<!--Resources-->
<Window.Resources>
<local:ChangeFontWeight x:Key="changefontweight"/>
<Style TargetType="syncfusion:GridCell" x:Key="cellstyle">
<Setter Property="FontWeight" Value="{Binding RelativeSource={RelativeSource Self},Converter = {StaticResource changefontweight}}" />
</Style>
</Window.Resources>
<!— SfDataGrid Definition -->
<syncfusion:SfDataGrid x:Name="datagrid"
CellStyle="{StaticResource cellstyle}"
AllowEditing="True"
LiveDataUpdateMode="AllowDataShaping"
AutoGenerateColumns="True"
ColumnSizer="Auto"
ItemsSource="{Binding Stocks}">
The following code example demonstrates the ChangeFontWeight Converter Class that returns the FontWeight of the text based on cell value.
C#
public class ChangeFontWeight : IValueConverter
{
object IValueConverter.Convert(object value, Type targetType, object parameter, CultureInfo info)
{
var cell = value as GridCell;
if (cell.ColumnBase.GridColumn.MappingName == "Change")
{
var data = (cell.DataContext as StockData).Change;
if (data >= 0)
return FontWeights.Bold;
else
return FontWeights.Normal;
}
return null;
}
object IValueConverter.ConvertBack(object value, Type targetType, object parameter, CultureInfo info)
{
throw new NotImplementedException();
}
}
You can apply the style for a particular column by using GridColumn.CellStyle in SfDataGrid.
CellStyleSelector
You can customize the FontWeight of GridCell based on its data, by customizing its style and writing the StyleSelector for FontWeight property that converts the FontWeight based on bound data. The customized style can be set to SfDataGrid.CellStyleSelector or GridColumn.CellStyleSelector property based on your requirement.
XAML
<!--Resources-->
<Window.Resources>
<local:StockCellStyleSelector x:Key="stockCellStyleSelector" />
</Window.Resources>
<!—Defining Resources in SfDataGrid -->
<syncfusion:SfDataGrid x:Name="datagrid"
Grid.Row="1"
Margin="10,0,30,30"
LiveDataUpdateMode="AllowDataShaping"
ColumnSizer="Auto"
CellStyleSelector="{StaticResource stockCellStyleSelector}"
NavigationMode="Row"
ItemsSource="{Binding Stocks}" ></syncfusion:SfDataGrid.Columns>
The following code example demonstrates how to write the style for FontWeight property of GridCell in App.Xaml.
XAML
<Application.Resources> <Style x:Key="SymbolCellStyle" TargetType="syncfusion:GridCell"> <Setter Property="FontWeight" Value="Bold" /> </Style> <Style x:Key="NormalCellStyle" TargetType="syncfusion:GridCell"> <Setter Property="FontWeight" Value="Normal" /> </Style> </Application.Resources>
The appropriate style is applied for a particular column depending on the row data in SelectStyle method of the StyleSelector Class.
The following code example describes the StockCellStyleSelector class that returns the style based on cell value.
C#
public class StockCellStyleSelector : StyleSelector
{
public override Style SelectStyle(object item, DependencyObject container)
{
var gridcell = container as GridCell;
if (gridcell.ColumnBase.GridColumn.MappingName == "Change")
{
var row = item as StockData;
if (row != null)
if (row.Change >= 0)
return App.Current.Resources["SymbolCellStyle"] as Style;
else
return App.Current.Resources["NormalCellStyle"] as Style;
}
return base.SelectStyle(item, container);
}
}
You can apply the style for a particular column by using GridColumn.CellStyleSelector in SfDataGrid.
The following screenshot shows changing FontWeight for a particular column based on CellValue.
Figure 1: Changing FontWeight using CellValue
Sample Links:
Conclusion
I hope you enjoyed learning about how to alter the font weight for a certain column based on the value of a cell.
You can refer to our WPF Grid feature tour page to know about its other groundbreaking feature representations and documentation, and how to quickly get started for configuration specifications. You can also explore our Grid example to understand how to create and manipulate data in the WPF Grid.
For current customers, you can check out our components from the License and Downloads page. If you are new to Syncfusion, you can try our 30-day free trial to check out our WPF Grid and other WPF controls.
If you have any queries or require clarifications, please let us know in the comments section below. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!
