Join Walt Ritscher for an in-depth discussion in this video Exploring data analysis with PivotViewer, part of Silverlight 5 Essential Training.
- View Offline
PivotViewer is a powerful tool for visualizing data collections in a rich, graphical way. It has an impressive UI with lots of Flash and transition magic, which makes sorting and categorizing the data a fun experience. Here is a Pivot View application loaded with Netflix Instant Watch data. For my scenario, I'm going to watch a movie with my family. I'll choose to view them in the Graph View, which places the data in columns. Next, I'd like to sort by rating, MPAA Rating. Here you can see each column shows the rating from the movie board.
I'll click on the G setting. Next, I'll go over and choose a Rating value. I want to see only movies that have this rating or above. My daughter has picked The Return of the Pink Panther, so I'll click here to read more about it. And then when I'm happy, I can double-click on The Return of the Pink Panther to load the Netflix page. Let's see how to do this in your own application. I'm inside Visual Studio for this demonstration, in a solution called ImprovedPivotViewer. Let's start by looking at the data.
I have a Food class which represents a food item from a grocery store. I also have a Foods class which contains an internal list of food; a number of methods, like GetDepartmentList, GetAll; and a constructor that populates the internal list. To use this on my PivotViewer, I'm going to go to this Basics.xaml page. My PivotViewer lives down here in the body of my user control. I'm going to bind the data in the code behind, so I'll move over to Basics.xaml.cs and show that in my constructor, I'm instantiating the Foods class and then calling the GetAll method.
I'm then taking all those foods and assigning them to the ItemSource of the PivotViewer. I need to provide a data template to the PivotViewer so it knows how to show my food. That is done within the body of the PivotViwer, here in this ItemTemplates section. I've created a template that consists of two borders, a Stackpanel, and then normal TextBlocks using the Data Binding syntax to bind to the underlying data. I'm also going to provide some filters by setting this section here, PivotProperties.
So I create a PivotViewerStringProperty with the name that the user will see and then a binding that retrieves the information. You can see that I have Food Name, Department, and Organic. Let's run the application and see what the PivotViewer does for my data. This is my data template that's wrapped around each of the individual food items. You'll notice when I click once, it zooms in, and I click again, it zooms out. I can choose to view it by Grid view or by Column view.
Once I'm in Column view, I can choose from my three properties: Food Name, Department, or Organic. And then once I've sorted the data, I can drill down into that area to read more information. The Silverlight improvements to PivotViewer are exciting. Why not try it out in your next Silverlight application?
- Installing the toolkit and setting up the development environment
- Using Expression Blend vs. Visual Studio 2010
- Creating a Silverlight page
- Compiling an application
- Exploring the relationship between XAML and .NET
- Using C#
- Working with XAML
- Digging into the Dependency Property System
- Deploying and debugging code
- Creating sophisticated layouts with panel elements
- Managing Visual State with Visual State Manager
- Transforming the user interface (UI) with templates
- Understanding the event model
- Working with text
- Using business data in a binding
- Creating an out-of-browser (OOB) application
- Exploring trust levels
- Playing audio and video
- Handling errors
- Exploring animations
- Working with application windows
- Integration with XNA