RatingControl with Theme support

This past Wednesday I was asked to present at the Phoenix Silverlight users group on the topic of writing custom controls. Back a few months ago I created a very simple version of a Silverlight Rating control and thought it would be a great example to demonstrate how to leverage Control Templates, Visual State manager and styling. Back when I created the control I choose to use “/themes/generic.xaml” as a way to provide the default styling of my control. This works great if a developer wants to tweek the layout of the control before using it in there project, but was never intended to skin the control at runtime.

A few weeks back around PDC, Microsoft released the Silverlight Toolkit a collection of Silverlight controls developers and designers can use in there Silverlight projects. What is really cool about the way in which Shawn Burke’s team is working on control development, is this idea of releasing controls on Codeplex to get them quickly into the community.

If you play around with the toolkit you will quickly stumble on a new assembly called: “Microsoft.Windows.Controls.Theming”.  In a nut shell what this class does is give control developers access to the ability to theme their controls.  One of the key elements of this assembly is the “ImplicitStyleManager”. This class exposes some attached properties that allow designers to specify an external resource file (.xaml) containing styles which can be applied to a control and each of the controls children.

Here is what i did to get my RatingControl to use the implicit style manager. First I added a reference in my page.xaml to the Theming namespace.

xmlns:theming="clr-namespace:
Microsoft.Windows.Controls.Theming;
assembly=Microsoft.Windows.Controls.Theming"

Next I inserted a a few attributes into my rating control declaration to specify the location of my theme and how I wanted my theme applied.  I choose “Auto” which applies the theme immediately when the control is loaded.


Lastly I copied my generic.xaml file into a new themes directory located in my test Silverlight project and renamed it to “themeA.xaml”. Just to prove that the theme was loading I changed my RatingButton style to display an ellipse instead of the default star’s I had used in my original example. Below is how it all turned out.

Code: Rating.zip