RadControls for Silverlight

Note

This topic will present you with the simple way of creating a theme. It's suitable for themes which contain less XAML. The advanced approach is more performant, especially when creating themes for the larger controls. To learn more about the advanced approach read the Creating a Custom Theme topic in the common section.

The RadRibbonBar supports themes. This allows you to apply a style to all controls of the same type, without having to set it explicitly thus easily maintaining and changing the look of your RadRibbonBar.

Note

By applying a theme, the style for a particular control will be set to all of the controls of this type.

Creating the Theme

Before theming the RadRibbonBar controls, you have to create a ResourceDictionary that will represent your theme. For example, create the following structure in your project.

In the RadRibbonBarTheme.xaml you will place the styles and the resources for your theme.

Adding Styles to the Theme

Copy the created style with all of the resources it uses and place it in the ResourceDictionary that represents the theme for your RadRibbonBar control. For example:

CopyXAML
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <!--Paste the style and all of the resources it uses here. --> 
    <Style x:Key="RadRibbonButtonStyle" TargetType="telerik:RadRibbonButton">
        ...
    </Style>
</ResourceDictionary>

The next step is to declare the required namespaces in the ResourceDictionary.

CopyXAML
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation">
      ...
</ResourceDictionary>

Finally in order to make the style default for all instances of the RadRibbonButton control you have to leave it without a key. Remove the key from the style.

CopyXAML
<Style TargetType="telerik:RadRibbonButton">
        ...
</Style>

Applying a Theme

The theme can be easily set to your RadRibbonBar control in the following way.

CopyXAML
<UserControl.Resources>
    <telerik:Theme x:Key="MyTheme"
                   Source="/RadRibbonBarSample;component/Themes/RadRibbonBarTheme.xaml" />
</UserControl.Resources>
...
<telerik:RadRibbonBar telerik:StyleManager.Theme="{StaticResource MyTheme}" />
CopyC#
public MainPage()
{
    InitializeComponent();
    StyleManager.SetTheme( this.radRibbonBar, new Theme( new Uri( "/RadRibbonBarSample;component/Themes/RadRibbonBarTheme.xaml", UriKind.Relative ) ) );
}
CopyVB.NET
Public Sub New()
    InitializeComponent()
    StyleManager.SetTheme(Me.radRibbonBar, New Theme(New Uri("/RadRibbonBarSample;component/Themes/RadRibbonBarTheme.xaml", UriKind.Relative)))
End Sub

See Also