Lesson 5: Format Rows and Cells Based on their Values
- 2 minutes to read
This tutorial demonstrates how to apply conditional formats that help users visually identify trends and largest or smallest values, and compare data.
The GridControl allows you to apply the following format conditions:
Format Condition | Description |
---|---|
Format |
Formats cells based on the specified Expression. |
Top |
Formats cells with top/bottom N values or values that are above/below an average value. |
Unique |
Formats cells whose values are unique or duplicate. |
Do the following to apply a format condition:
- Create a FormatCondition object and add it to the DataControlBase.FormatConditions collection.
- In the FormatCondition, specify the FieldName property to format values within this column or set the ApplyToRow property to true to format values within the entire row.
- Specify the Expression property with a format rule.
- Specify the PredefinedFormatName property to apply a predefined format or use the Format property to create your own format.
<dxg:GridControl ...>
<dxg:GridControl.FormatConditions>
<!-- Changes the background of rows to light red
if the quantity value is greater than 50. -->
<dxg:FormatCondition ApplyToRow="True" Expression="[Quantity] > 50"
PredefinedFormatName="{x:Bind dxg:PredefinedFormatNames.LightRedFill}"/>
<!-- Changes the format of cell values in the Unit Price column to bold and red
if they are greater than 80. -->
<dxg:FormatCondition FieldName="UnitPrice" Expression="[UnitPrice] > 80">
<dxg:FormatCondition.Format>
<dxg:Format FontWeight="Bold" Foreground="Red"/>
</dxg:FormatCondition.Format>
</dxg:FormatCondition>
</dxg:GridControl.FormatConditions>
</dxg:GridControl>
See Also