Silverlight 5 Pivot Viewer Control: Part 1


In this article we will learn about creating a Pivot Viewer control in Silverlight .

Lets get started with a short description of what a PivotViewer Control is.

For this example I have used the Silverlight 5 PivotViewer, since most of us would have Silverlight 5 right now .

The Silverlight PivotViewer Control does not come by default with the Silverlight 4 toolkit. It has to be downloaded and installed separately .

With Silverlight 5 one would get the PivotViewer by default .

For Silverlight 4 it must be downloaded from the link shown below :
 
http://www.microsoft.com/download/en/details.aspx?displaylang=en&id=17747

Once installed , the PivotViewer gets installed in the path as shown below :

C:\Program Files (x86)\Microsoft SDKs\Silverlight\v4.0\PivotViewer\Aug10

Hence forth I am using Silverlight 5 but similar steps needs to be followed for Silverlight 4.


Add a reference to the below DLL as shown below :

SilPvrVwr1.gif

Let's start coding then . PivotViewer uses a special type of Collection called as Collection XML .

We need to understand Collection XML in order to effectively work with PivotViewer .

Collection XML (CXML) is the schema used to describe structured data to be displayed in the PivotViewer collection experience.

We make use of a class called CxmlCollectionSource to bind to the ItemSource of the PivotViewer

More Information on the CxmlCollectionSource can be found in the link below :

http://msdn.microsoft.com/en-us/library/system.windows.controls.pivot.cxmlcollectionsource(v=vs.96).aspx

Shown below is how the data is bound to the ItemSource property of the PivotViewer Control .

SilPvrVwr2.gif

The final code is below :

            _cxml = new CxmlCollectionSource(new Uri("http://www.xpert360.net/PDC2010/PDC2010.cxml", UriKind.Absolute));

            pv1.PivotProperties = _cxml.ItemProperties.ToList();
            pv1.ItemTemplates = _cxml.ItemTemplates;
            pv1.ItemsSource = _cxml.Items;


Let's give it a run.

SilPvrVwr3.gif

Play around with the Pivot . In this article we have just introduced a PivotViewer control we would go deeper into it in the future articles .