How to: Change a Modified Cell Appearance
- 5 minutes to read
This example demonstrates how to animate transitions when conditional formatting is changed.
Set the TableView.AnimateConditionalFormattingTransition property to true to enable animation effects. See the Conditional Formatting Animation section of the Conditional Formats topic to learn more.
The image below shows the result.
Note
A complete sample project is available at https://github.com/DevExpress-Examples/how-to-change-a-modified-cell-appearance-e4025.
- Window1.xaml.cs
- Window1.xaml
- ViewModel.cs
- Window1.xaml.vb
- Application.xaml
- ViewModel.vb
- Application.xaml.vb
using System.Collections.Generic;
using System.Windows;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Markup;
using System.Windows.Media;
using System.ComponentModel;
using System;
using DevExpress.Xpf.Grid;
using System.Windows.Controls;
namespace DXGrid_ConditionalFormatting {
public partial class Window1 : Window {
public Window1() {
InitializeComponent();
}
}
}
<Window x:Class="DXGrid_ConditionalFormatting.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:dx="http://schemas.devexpress.com/winfx/2008/xaml/core"
xmlns:local="clr-namespace:DXGrid_ConditionalFormatting"
xmlns:dxg="http://schemas.devexpress.com/winfx/2008/xaml/grid"
xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors"
xmlns:dxgt="http://schemas.devexpress.com/winfx/2008/xaml/grid/themekeys"
xmlns:dxmvvm="http://schemas.devexpress.com/winfx/2008/xaml/mvvm"
Title="Window1" Height="300" Width="470">
<Window.DataContext>
<local:ViewModel/>
</Window.DataContext>
<Grid>
<dxg:GridControl ItemsSource="{Binding Products}">
<dxg:GridControl.Columns>
<dxg:GridColumn FieldName="Name"/>
<dxg:GridColumn FieldName="OldPrice" EditSettings="{dxe:TextSettings Mask=C, MaskType=Numeric, MaskUseAsDisplayFormat=True}"/>
<dxg:GridColumn FieldName="NewPrice" EditSettings="{dxe:TextSettings Mask=C, MaskType=Numeric, MaskUseAsDisplayFormat=True}"/>
<dxg:GridColumn FieldName="DeltaPrice" EditSettings="{dxe:TextSettings Mask=C, MaskType=Numeric, MaskUseAsDisplayFormat=True}"/>
<dxg:GridColumn FieldName="IsAvailable"/>
</dxg:GridControl.Columns>
<dxg:GridControl.View>
<dxg:TableView x:Name="view" AutoWidth="True" AnimateConditionalFormattingTransition="True" AllowConditionalFormattingMenu="True" AllowDataUpdateFormatConditionMenu="True">
<dxg:TableView.FormatConditions>
<dxg:DataBarFormatCondition FieldName="OldPrice" PredefinedFormatName="GreenSolidDataBar" MaxValue="100" MinValue="0"/>
<dxg:DataBarFormatCondition FieldName="NewPrice" PredefinedFormatName="BlueSolidDataBar" MaxValue="1000" MinValue="0"/>
<dxg:IconSetFormatCondition FieldName="DeltaPrice" PredefinedFormatName="PositiveNegativeTrianglesIconSet"/>
<dxg:ColorScaleFormatCondition FieldName="DeltaPrice">
<dx:ColorScaleFormat ColorMin="Green" ColorMiddle="White" ColorMax="Red"/>
</dxg:ColorScaleFormatCondition>
<dxg:DataUpdateFormatCondition FieldName="IsAvailable" PredefinedFormatName="YellowFillWithDarkYellowText" Rule="Always">
<dx:Format Background="Pink"/>
</dxg:DataUpdateFormatCondition>
</dxg:TableView.FormatConditions>
</dxg:TableView>
</dxg:GridControl.View>
</dxg:GridControl>
</Grid>
</Window>
using DevExpress.Mvvm.DataAnnotations;
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Windows.Threading;
namespace DXGrid_ConditionalFormatting {
public class ViewModel {
public ObservableCollection<Product> Products {
get;
set;
}
DispatcherTimer updateTimer = new DispatcherTimer();
public ViewModel() {
PopulateData();
SetUpdateTimer();
}
protected void PopulateData() {
Products = new ObservableCollection<Product>();
Random randomPriceValue = new Random();
for (int i = 0; i < 30; i++) {
decimal oldPrice = ((decimal)randomPriceValue.Next(1000) / 10);
decimal newPrice = ((decimal)randomPriceValue.Next(10000) / 10);
Products.Add(new Product() { Name = "Product" + i, OldPrice = oldPrice, NewPrice=newPrice, DeltaPrice = newPrice - oldPrice, IsAvailable = (i % 2 == 0) });
}
}
private void SetUpdateTimer() {
updateTimer.Tick += updateTimer_Tick;
updateTimer.Interval = new TimeSpan(0, 0, 2);
updateTimer.Start();
}
void updateTimer_Tick(object sender, EventArgs e) {
Random rnd = new Random();
int updateProductNumber;
for (int i = 0; i < 3; i++) {
updateProductNumber = rnd.Next(Products.Count);
Products[updateProductNumber].IsAvailable = !Products[updateProductNumber].IsAvailable;
}
for (int i = 0; i < 5; i++) {
updateProductNumber = rnd.Next(Products.Count);
decimal oldPrice = ((decimal)rnd.Next(1000) / 10);
decimal newPrice = ((decimal)rnd.Next(10000) / 10);
Products[updateProductNumber].DeltaPrice = newPrice - oldPrice;
Products[updateProductNumber].OldPrice = oldPrice;
Products[updateProductNumber].NewPrice = newPrice;
}
}
}
public class Product : INotifyPropertyChanged {
string name;
decimal oldPrice;
decimal newPrice;
decimal deltaPrice;
bool isAvailable;
public string Name {
get {
return name;
}
set {
name = value;
RaisePropertyChanged("Name");
}
}
public decimal OldPrice {
get {
return oldPrice;
}
set {
oldPrice = value;
RaisePropertyChanged("OldPrice");
}
}
public decimal NewPrice
{
get
{
return newPrice;
}
set
{
newPrice = value;
RaisePropertyChanged("NewPrice");
}
}
public decimal DeltaPrice
{
get
{
return deltaPrice;
}
set
{
deltaPrice = value;
RaisePropertyChanged("DeltaPrice");
}
}
public bool IsAvailable {
get {
return isAvailable;
}
set {
isAvailable = value;
RaisePropertyChanged("IsAvailable");
}
}
public event PropertyChangedEventHandler PropertyChanged;
protected void RaisePropertyChanged(string propertyName) {
if (PropertyChanged != null)
PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
}
}
}
Imports System.Collections.Generic
Imports System.Windows
Imports System.Windows.Data
Imports System.Windows.Documents
Imports System.Windows.Markup
Imports System.Windows.Media
Imports System.ComponentModel
Imports System
Imports DevExpress.Xpf.Grid
Imports System.Windows.Controls
Namespace DXGrid_ConditionalFormatting
Partial Public Class Window1
Inherits Window
Public Sub New()
InitializeComponent()
End Sub
End Class
End Namespace
<Application x:Class="DXGrid_ConditionalFormatting.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
StartupUri="Window1.xaml">
<Application.Resources>
</Application.Resources>
</Application>
Imports DevExpress.Mvvm.DataAnnotations
Imports System
Imports System.Collections.Generic
Imports System.Collections.ObjectModel
Imports System.ComponentModel
Imports System.Linq
Imports System.Text
Imports System.Windows.Threading
Namespace DXGrid_ConditionalFormatting
Public Class ViewModel
Public Property Products() As ObservableCollection(Of Product)
Private updateTimer As New DispatcherTimer()
Public Sub New()
PopulateData()
SetUpdateTimer()
End Sub
Protected Sub PopulateData()
Products = New ObservableCollection(Of Product)()
Dim randomPriceValue As New Random()
For i As Integer = 0 To 29
Dim oldPrice As Decimal = (CDec(randomPriceValue.Next(1000)) / 10)
Dim newPrice As Decimal = (CDec(randomPriceValue.Next(10000)) / 10)
Products.Add(New Product() With { _
.Name = "Product" & i, _
.OldPrice = oldPrice, _
.NewPrice=newPrice, _
.DeltaPrice = newPrice - oldPrice, _
.IsAvailable = (i Mod 2 = 0) _
})
Next i
End Sub
Private Sub SetUpdateTimer()
AddHandler updateTimer.Tick, AddressOf updateTimer_Tick
updateTimer.Interval = New TimeSpan(0, 0, 2)
updateTimer.Start()
End Sub
Private Sub updateTimer_Tick(ByVal sender As Object, ByVal e As EventArgs)
Dim rnd As New Random()
Dim updateProductNumber As Integer
For i As Integer = 0 To 2
updateProductNumber = rnd.Next(Products.Count)
Products(updateProductNumber).IsAvailable = Not Products(updateProductNumber).IsAvailable
Next i
For i As Integer = 0 To 4
updateProductNumber = rnd.Next(Products.Count)
Dim oldPrice As Decimal = (CDec(rnd.Next(1000)) / 10)
Dim newPrice As Decimal = (CDec(rnd.Next(10000)) / 10)
Products(updateProductNumber).DeltaPrice = newPrice - oldPrice
Products(updateProductNumber).OldPrice = oldPrice
Products(updateProductNumber).NewPrice = newPrice
Next i
End Sub
End Class
Public Class Product
Implements INotifyPropertyChanged
Private name_Renamed As String
Private oldPrice_Renamed As Decimal
Private newPrice_Renamed As Decimal
Private deltaPrice_Renamed As Decimal
Private isAvailable_Renamed As Boolean
Public Property Name() As String
Get
Return name_Renamed
End Get
Set(ByVal value As String)
name_Renamed = value
RaisePropertyChanged("Name")
End Set
End Property
Public Property OldPrice() As Decimal
Get
Return oldPrice_Renamed
End Get
Set(ByVal value As Decimal)
oldPrice_Renamed = value
RaisePropertyChanged("OldPrice")
End Set
End Property
Public Property NewPrice() As Decimal
Get
Return newPrice_Renamed
End Get
Set(ByVal value As Decimal)
newPrice_Renamed = value
RaisePropertyChanged("NewPrice")
End Set
End Property
Public Property DeltaPrice() As Decimal
Get
Return deltaPrice_Renamed
End Get
Set(ByVal value As Decimal)
deltaPrice_Renamed = value
RaisePropertyChanged("DeltaPrice")
End Set
End Property
Public Property IsAvailable() As Boolean
Get
Return isAvailable_Renamed
End Get
Set(ByVal value As Boolean)
isAvailable_Renamed = value
RaisePropertyChanged("IsAvailable")
End Set
End Property
Public Event PropertyChanged As PropertyChangedEventHandler Implements INotifyPropertyChanged.PropertyChanged
Protected Sub RaisePropertyChanged(ByVal propertyName As String)
RaiseEvent PropertyChanged(Me, New PropertyChangedEventArgs(propertyName))
End Sub
End Class
End Namespace
Imports System
Imports System.Collections.Generic
Imports System.Configuration
Imports System.Data
Imports System.Linq
Imports System.Windows
Namespace DXGrid_ConditionalFormatting
''' <summary>
''' Interaction logic for App.xaml
''' </summary>
Partial Public Class App
Inherits Application
End Class
End Namespace