This example demonstrates how to change the appearance of individual cells based on specific conditions using the Conditional Formatting feature in markup.
The image below shows the result.
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:ConditionalFormatting"
xmlns:dxc="http://schemas.devexpress.com/winfx/2008/xaml/core"
xmlns:dxg="http://schemas.devexpress.com/winfx/2008/xaml/grid"
x:Class="ConditionalFormatting.MainWindow"
Title="MainWindow" Height="500" Width="800">
<Window.DataContext>
<local:ConditionalFormattingViewModel/>
</Window.DataContext>
<Grid>
<dxg:GridControl Name="grid" ItemsSource="{Binding Path=Items}" AllowLiveDataShaping="True" EnableSmartColumnsGeneration="True">
<dxg:GridControl.Columns>
<dxg:GridColumn FieldName="State" IsSmart="True" SortIndex="0" VisibleIndex="0"/>
<dxg:GridColumn FieldName="Sales" IsSmart="True" VisibleIndex="1"/>
<dxg:GridColumn FieldName="SalesVsTarget" IsSmart="True" FixedWidth="True" VisibleIndex="2"/>
<dxg:GridColumn FieldName="Profit" IsSmart="True" VisibleIndex="3"/>
<dxg:GridColumn FieldName="CustomersSatisfaction" IsSmart="True" FixedWidth="True" VisibleIndex="4"/>
<dxg:GridColumn FieldName="MarketShare" IsSmart="True" FixedWidth="True" VisibleIndex="5"/>
</dxg:GridControl.Columns>
<dxg:GridControl.View>
<dxg:TableView AllowEditing="False" AllowConditionalFormattingMenu="True">
<dxg:TableView.FormatConditions>
<dxg:FormatCondition Expression="[SalesVsTarget] < 0.0m" FieldName="SalesVsTarget" PredefinedFormatName="RedText"/>
<dxg:FormatCondition Expression="[Profit] < 0.0" FieldName="Profit">
<dxc:Format Foreground="Red"/>
</dxg:FormatCondition>
<dxg:FormatCondition Expression="[SalesVsTarget] > 0.0m" FieldName="SalesVsTarget" PredefinedFormatName="GreenText"/>
<dxg:DataBarFormatCondition FieldName="Sales" PredefinedFormatName="RedGradientDataBar"/>
<dxg:TopBottomRuleFormatCondition Expression="[Sales]" FieldName="{x:Null}" PredefinedFormatName="BoldText" Rule="TopPercent" Threshold="10"/>
<dxg:DataBarFormatCondition FieldName="Profit" PredefinedFormatName="GreenGradientDataBar"/>
<dxg:IconSetFormatCondition FieldName="MarketShare" PredefinedFormatName="Quarters5IconSet"/>
<dxg:IconSetFormatCondition FieldName="CustomersSatisfaction" PredefinedFormatName="Stars3IconSet"/>
</dxg:TableView.FormatConditions>
</dxg:TableView>
</dxg:GridControl.View>
</dxg:GridControl>
</Grid>
</Window>
Imports System
Imports System.Collections.Generic
Imports System.Configuration
Imports System.Data
Imports System.Linq
Imports System.Threading.Tasks
Imports System.Windows
Namespace ConditionalFormatting
''' <summary>
''' Interaction logic for App.xaml
''' </summary>
Partial Public Class App
Inherits Application
Private Sub OnAppStartup_UpdateThemeName(ByVal sender As Object, ByVal e As StartupEventArgs)
DevExpress.Xpf.Core.ApplicationThemeHelper.UpdateApplicationThemeName()
End Sub
End Class
End Namespace
<Application x:Class="ConditionalFormatting.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
StartupUri="MainWindow.xaml" Startup="OnAppStartup_UpdateThemeName">
<Application.Resources>
</Application.Resources>
</Application>