WPF 4: Changing DataGrid Cell Appearance on Mouse Events

Posted by: Mahesh Sabnis , on 10/28/2011, in Category WPF
Views: 72657
Abstract: This article shows how to use property triggers in WPF to apply styles to the DataGrid at runtime.
I was having a discussion with one of my clients about changing the appearance of the WPF DataGrid Cell, when a certain condition is met. His requirement was that a WPF application contains a DataGrid which displays Sales data. When a user wants to focus on a specific Quarter sales for a specific product, then the Cell containing the Sales data should be highlighted. Now this is a typical requirement where you can easily apply effects on the DataGrid cell using Property Triggers. In WPF, we can target Styles to a specific UI element using which the UI can be dynamically manipulated.

Let us get started.

Step 1: Open VS2010 and create a WPF application. Add the following XAML code in MainWindow.xaml:

WPF DataGrid Style

Step 2: In the code-behind (MainWindow.xaml.cs) add the following code:

WPF DataGrid Style Collection

The above code defines a ProductSales class and its collection. Bind this collection with the DataGrid in the Windows Loaded event as below:

image

Step 3: Open MainWindow.xaml and add the following style in the Windows Resources section.

Datagrid Windows Resources

The above XAML code contains a Style targeted to the DatGridCell. The property for applying the Style is defined as ‘IsMouseOver’. If you observe, the Style does not have any key (x:key) set for it. This means that the style defined can now be applied on every DataCell of the DataGrid.

Step 4: Run the application and hover the mouse over the DataGrid Cell. The result will be as shown below:

WPF DataGrid Cell

The entire source code of this article can be downloaded
over here
Give a +1 to this article if you think it was well written. Thanks!
Recommended Articles
Mahesh is having 10 years of experience in IT education and development. He is a Microsoft Certified Trainer (MCT) since 2005 and has conducted various Corporate Training programs for .NET Technologies (all versions). Follow him on twitter @maheshdotnet


Page copy protected against web site content infringement by Copyscape


User Feedback
Comment posted by Salim on Thursday, November 17, 2011 10:09 PM
Thanks very nice keep it up
Comment posted by Greg on Sunday, March 11, 2012 11:38 AM
Great article!
Comment posted by Mahesh Sabnis on Saturday, June 23, 2012 6:20 AM
Hi Salim and Greg,

Thanks a lot
Regards
MAhesh
Comment posted by sathish on Monday, June 23, 2014 6:24 AM
very nice

Post your comment
Name:  
E-mail: (Will not be displayed)
Comment:
Insert Cancel