How to Migrate from StyleManager to Implicit Styles

Оur customers definitely love the whole look and feel of their enterprise business applications, using our ready-to-use built-in themes for both WPF and Silverlight platforms.

The purpose of this blog post is to describe how you can easily migrate your existing projects from using StyleManager to using the Implicit Styles theming mechanism in a few easy steps.

Why Implicit Styles?

To display a Silverlight or WPF component, you need to apply a default ControlTemplate for it. Therefore, all our components come with a default set of styles and ControlTemplates. The assemblies (located in the [install dir]\Binaries folder) that come with the suite include the implementation of the components along with these default styles. However, as our assemblies contain multiple components, they also contain all relevant styles for these components for all themes which makes the assembly size larger. Since some of our users use only a few controls in their applications with a single or several themes, we decided to give them the option to choose which style resources they want to include in their projects.

For the purpose, we have created NoXaml assemblies which do not include any XAML code - no default styles, brushes or ControlTemplates. Consequently, these assemblies do not specify a default ControlTemplate for the components, hence the RadControls have no default visualization and there is nothing displayed runtime or design-time.

To have a visual representation of a control with NoXAML binaries you would have to manually add a style with a ControlTemplate for the RadControls you are using in your application. We have provided several different options for that:

1. Use the theme assembly of the desired theme, which can be found in the [install dir]\Binaries.NoXaml folder (Telerik.Windows.Themes.Office2016.dll, Telerik.Windows.Themes.Material.dll, etc.)
2. Use the resource dictionaries by assembly name from the Themes.Implicit folder:
   …/Themes.Implicit/<platform>/Windows8/Themes/Telerik.Windows.Controls.Navigation.xaml.
3. Use the design time theme change option introduced with R2 2016.

If you go with the first option, you will include all RadControls styles for the chosen theme in your solution through the theme assembly. It contains ResourceDictionaries from which you will also have to merge the ones you need in the resources of your window or application.

If you choose the second option, you should create a Themes folder in your project and copy the corresponding XAML files from .../Themes.Implicit/../Windows8/../Themes/ folder to your project’s folder. Then you need to merge these ResourceDictionaries in the App.xaml file. This also allows you to further edit the ResourceDictionaries and remove any styles and resources that you would not need thus further reducing the size of your application.

As for the third option, when you refer the NoXAML assemblies in your project and add a control in XAML, in the designer window there should appear a theme selection button, which opens a window with the available themes. After that the configurator will add the chosen theme’s assembly and merge the needed ResourceDictionaries in your application resources (in App.xaml). You can find more information about this here. (http://docs.telerik.com/devtools/wpf/styling-and-appearance/how-to/styling-apperance-switching-themes-design-time )

To summarize all this—StyleManager uses a set of standard binaries, which contain XAML mark-up for all controls and themes included separately in each assembly. Implicit styles rely on a set of NoXAML binaries, which do not contain any mark-up within the control assembly. Each of the themes is isolated either in separate assembly or in a direct XAML file reference. Since the implicit styling approach is the most natural way of theming, we strongly encourage our clients to use it. We will not get in details about the other great advantages it has compared to StyleManager, but one significant advantage is that it is much easier to create custom theme with it and themes are easily changed at runtime. If you want to read more about the pros and cons of these approaches, you may take a look at the following blog post "XAML Theming – Implicit Styles versus StyleManager" .

How to Migrate?

Our customers often ask how to migrate their existing projects from StyleManager to Implicit Styles. Here I will explain how to easily migrate existing projects in just a few steps. Let’s say that you already have RadGridView control styled with our Windows8 theme, being set either as instance-specific built-in theme or as an application specific theme.

1. Remove all RadGridView related assemblies from your project.

• Telerik.Windows.Controls.dll
• Telerik.Windows.Data.dll
• Telerik.Windows.Controls.Input.dll
• Telerik.Windows.Controls.GridView.dll

*For Silverlight you should also remove theme reference to Telerik.Windows.Themes.Windows8 assembly

2. Remove any existing StyleManager related settings from your project:

3. Add references to the following Telerik UI for WPF NoXAML assemblies.

They are usually located in NoXAML folder with the following path C:\Program Files (x86)\Telerik\UI for WPF[version]\Binaries.NoXaml *

Path for XAML binaries in .NET 4.5 environment

Path for NoXAML binaries in .NET 4.5 environment

*Respectively for Silverlight the NoXAML binaries are located in C:\Program Files (x86)\Telerik\UI for Silverlight[version]\Binaries.NoXaml) .

• Telerik.Windows.Controls.dll
• Telerik.Windows.Data.dll
• Telerik.Windows.Controls.Input.dll
• Telerik.Windows.Controls.GridView.dll
• Telerik.Windows.Themes.Windows8.dll

You can easily check if you are using NoXAML binaries from the Details Info Tab of the corresponding assembly:

4. Merge needed .xaml files for RadGridView in your application’s global resources (App.xaml):

Please note that the order of merging the resources matters.

You can find more info on this in our online documentation by following this link.

5. (optional) Add a BasedOn reference in any custom style you have in your application. The general convention for the naming of the styles that we provide is <control>Style – e.g. RadGridViewStyle, RadTabControlStyle. This is necessary if you have a custom style where you have changed only a few properties and rely on the others (such as ControlTemplate, borders etc.) to be “inherited” from the default style for the controls.

6. Build and run the project.

Give it a Try

As you will see there are no custom styles or templates applied to the RadGridView as we don’t want to complicate the desired scenario. Feel free to modify the provided sample project as you wish and don’t hesitate to contact us with any feedback that you might have. Happy coding!

Try the Sample Project

[Editor’s Note: This blog post originally appeared in September 2014. It has since been updated for accuracy and comprehensiveness.]