Silverlight 4.0 CollectionViewSource with WCF RIA Services
(Page 1 of 4 )
This article introduces the “CollectionViewSource” element available in Silverlight (using WCF RIA Services) and also discusses applying filters to existing data using “CollectionViewSource.”
To make this article simple, I managed to create a simple Silverlight 4.0 application which consumes a WCF RIA Service created using the WCF RIA Service Library. If you are not familiar with developing applications using the WCF RIA Service Library and Silverlight 4.0, check out a beginner’s article available at http://jagchat.spaces.live.com/blog/cns!41050F68F010A662!4439.entry.
The solution was developed using Microsoft Visual Studio 2010 Ultimate Edition with Microsoft Silverlight 4.0 on Windows 7 Ultimate edition. I didn’t really test it in any other environment. I request that you post in the discussion area if you have any problems with execution.
Working with CollectionViewSource in Siverlight
Using a WCF RIA Service, we can somehow bring data down to a Silverlight application. Once the data is available to the Silverlight application, we may want to have it be viewed in different logical ways (such as a sorted view, filtered view etc.). “CollectionViewSource” is mainly designed to have view-like scenarios against the data already available in Silverlight. Not only that, but we can also track and work with the “current” item. We will discuss these soon.
Let us start with an example.
<UserControl x:Class="SLBusinessAppWithRiaLib.CvsBasic"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400"
xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk" Width="500" Height="500">
<UserControl.Resources>
<CollectionViewSource x:Key="cvsEmp"/>
</UserControl.Resources>
<Grid x:Name="LayoutRoot" Background="White">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<sdk:DataGrid
x:Name="dgEmp"
Margin="8" MinHeight="200" IsReadOnly="True" />
</Grid>
</UserControl>
The above code contains the declarations for a “DataGrid” and “CollectionViewSource.” You should also note that “CollectionViewSource” is defined in the “Resources” of the Silverlight user control (or page). At this point, we have not brought any data to Silverlight yet. Also, “DataGrid” and “CollectionViewSource” in the above code are not related to each other (we bind them in code).
Let us modify the code behind as follows:
Imports System.ServiceModel.DomainServices.Client
Imports System.Windows.Data
Partial Public Class CvsBasic
Inherits UserControl
Private oCtxt As New BusinessLib.Web.EmpMgrDomainSvc
Private oCvsEmp As CollectionViewSource
Public Sub New()
InitializeComponent()
oCvsEmp = CType(Me.Resources("cvsEmp"), CollectionViewSource)
oCvsEmp.Source = oCtxt.emps
oCtxt.Load(oCtxt.GetEmpsQuery())
Me.dgEmp.ItemsSource = oCvsEmp.View
End Sub
End Class
The next section explains the above code.
Next: CollectionViewSource in Siverlight: code explained >>
More Silverlight Articles
More By Jagadish Chaterjee
