[WPF/WCF] DataGrid + DoubleClick + MVVM + Loading Splash (description & code)

Using the DataGrid WPF Toolkit, this post shows a simple client/server application to fill a DataGrid according to the information that is provided by a WCF service. When any row receives a double click, a new document (jpeg or docx for this example) is opened by an external application.

The application is designed using MVVM pattern, where View and ViewModel are placed in the client side and Model in the server side. In our example, we will show a set of “Alerts” in a DataGrid , so that we will have the next elements:

• Model: Alert. This class provide all the information about an “Alert” entity.
• View: Custom DataGrid with all the alerts
• ViewModel: Intermediary element between Model and View to decouple the alert model from its view. In our case,  ViewModel provides a collection of alerts and a command to open its associated document.

About the DataGrid control, I would like to highlight the next points:

• Double click behavior in DataGrid control using attached properties. See the new HandleDoubleClick and TheCommandToRun properties in DataGrid, which are declared in WpfApplication.TestGridView => AttachedProperties => SelectorDoubleClickCommandBehavior.cs
• Using DataGridTemplateColumn: I got some problems trying to apply padding in the cell content, regarding the rest styles and behaviors (see Themes folder). To resolve it, I’ve used a DataGridTemplateColumn, which allows integrate any custom content in a cell. In this way, I’m using a TextBlock with a specify margin to simulate that padding.

In the server side (WCF service), I’ve implemented a request/response messages architecture, so that it would be easier and scalable to add other functionality like delete or create alerts (see the service implementation in WcfService.ServiceLibrary => AlertsService.cs, as well as the retrieve messages and handler).

Download source (VS2008)

This application is based on different sources, which can be found below. At the same time, I would like to be grateful to my workmate Wael, who is a great developer and he always gives me great advices.

Useful Links:

• Download WPF Toolkit library with DataGrid: http://wpf.codeplex.com/
• Good article describing clearly and deeply WPF Toolkit DataGrid control : http://sweux.com/blogs/smoura/index.php/wpf/2009/04/27/wpf-toolkit-datagrid-part-ii-custom-styling/
• Another article describing WPF Toolkit DataGrid: http://windowsclient.net/wpf/wpf35/wpf-35sp1-toolkit-datagrid-feature-walkthrough.aspx
• Good practical example to customise a WPF Toolkit DataGrid: http://www.codeproject.com/KB/WPF/WPFDataGridExamples.aspx
• Loading control: http://elegantcode.com/2009/08/21/a-simple-wpf-loading-animation/
• Using CommandBinding with MVVM pattern: http://codingcontext.wordpress.com/2008/12/10/commandbindings-in-mvvm/