Silverlight Tip of the Day #91 – How to Apply Themes from the Silverlight Toolkit
In addition to controls, the Silverlight Toolkit comes with a great set of themes that can easily be applied to your controls. These themes currently include:
- Bureau Black
- Bureau Blue
- Expression Dark
- Expression Light
- Rainier Purple
- Rainier Orange
- Shiny Blue
- Shiny Red
- Whistler Blue
You can see a sample preview of each of these themes by visiting this link.
In this Tip I will be showing you the necessary steps to get a theme applied to your Silverlight controls.
Step 1. Add a Reference to the Theme Components.
- In your Solution explorer right click on “References” and choose “Add Reference”.
- Browse to the location where you installed the Silverlight Toolkit binaries (i.e. c:\SilverlightToolkit\Binaries).
- Add Microsoft.Windows.Controls.Theming.
- In my demo I will be using the Shiny Red theme so also include a reference to Microsoft.Windows.Controls.Theming.ShinyRed.dll which is located in the Binaries\Themes folder.
Step 2. Add Namespace Declaration
- Open Page.xaml and add the following statement to your UserControl to reference the ShinyRed component.
<UserControl x:Class="MapEditor.Page"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x=http://schemas.microsoft.com/winfx/2006/xaml
xmlns:shinyRed="clr-namespace:Microsoft.Windows.Controls.Theming;
assembly=Microsoft.Windows.Controls.Theming.ShinyRed"
Width="800" Height="600">
Step 3. Apply the Theme to a Control
Declare the ShinyRed theme around any control you want to apply the them to like this:
<Canvas>
<shinyRed:ShinyRedTheme>
<Button Content="Save Map" Click="Button_Click_Save_Map" Width="80"></Button>
</shinyRed:ShinyRedTheme>
</Canvas>
Result:
As you can see in the image below, the theme is directly applied to the button.
Thank you,
--Mike Snow
Subscribe in a reader