Are you searching for professional looking free themes but haven’t found anything useful yet?
Do you want to concentrate on business logic of your application without worrying about the aesthetics?
Do you want to add theming infrastructure to your application enabling the users to switch themes at runtime?
Any one yes for the above questions has lead you to the right place. In my previous post, I shared two themes, dark and light, which can be directly used in an application. Today I am going to share an infrastructure which enables users to switch your configured themes at runtime. Before going forward I wanted to show you how my sample application looks after configuring the infrastructure. You don’t necessarily have to use the provided themes. You can use any theme of your choice.
As you can see from the screenshot, user has the option to switch between the themes. Now let us see how you can achieve the same in your application (It is very easy):
Download the project: (link is at the end of article). We live in a world full of open source projects. I love the idea of sharing and learning from each other. You are free to use and modify the code to your wish like but as a disclaimer, I also have to say that how you use it is totally your responsibility. Now coming back, I have shared my whole solution which contains some additional utility projects as well, feel free to use them or just ignore if you like. The project we are interested in is Common.Themes which contains all the infrastructure (and themes) we need.
Getting started: The first thing you need to do is to initialize the infrastructure with the following line:
ThemesManager.Instance.Init(ThemeMode.Application);
Basically there are two modes, Application and Window. If you want to use the themes application-wide, use the application mode and call the init method once per application creation (probably at startup). If for some reasons, you don’t want every view of your application to follow a particular theme or want to have more control, you can use the window mode and call the init method once per window creation. Note that the two modes are mutually exclusive.
Next, depending on the mode you have chosen, it is time to register the application/window to the theming infrastructure. For application mode call this once per application startup:
ThemesManager.Instance.RegisterApplication(Current);
For window mode, you need to call the following API every time a window is created:
ThemesManager.Instance.RegisterElement(window);
Changing themes at runtime: This is very simple too. You just need to tell the infrastructure which theme you’d like to use and voila, magic will be done.
ThemesManager.Instance.CurrentTheme = ThemeNames.MauryaDark;
You can easily bind a property with the user view which sets the corresponding theme selected by the user.
Special case of WPF windows: Since every window you create in wpf derives from Window class and is not exactly a direct instantiation, it is not possible to write a generic style for window unless. So, to make your window compatible with the theme, you need to set the background of your window yourself:
Background="{DynamicResource WindowBrush}"
Pretty easy, right? That’s all you need to do to get started with the code. For additional usage, follow along the article.
I don’t want to use the provided themes: Sure why not, you have a different need and would like to use custom or third party theme(s) rather than the ones provided. You just need to implement IThemesInitializer interface (and use your custom theme resource dictionaries inside), and finally pass the object in the Init method overload which takes an additional IThemesInitializer agument. To get an idea of how to implement this interface, have a look at DefaultThemesInitializer class. You’ll also need to modify the ThemeNames enum.
I want to style a custom control / third party control: Whether you want to style a custom control you created, or would like to override an existing style, it is a breeze to add the style in the infrastructure. Just create a resource dictionary with generic styles (without key attributes) and add this resource dictionary to participate in theming:
ThemesManager.Instance.AddDictionary(new ResourceDictionary { Source = new Uri("CustomStyles.xaml", UriKind.Relative) });
Call the above API to add styles defined in CustomStyles.xaml to every theme. If you’d like to have different styles for different themes, call the following instead:
ThemesManager.Instance.AddDictionaryToTheme(new ResourceDictionary { Source = new Uri("CustomStyles.xaml", UriKind.Relative) }, ThemeNames.MauryaDark);
That pretty much covers it all. You can explore some more methods for advance usage. Hope you find this useful/interesting. Here is the download link, which also contains a sample project demonstrating how to use the API.
[ddownload id=”2523″ style=”button” button=”black” text=”Download Theming API”]
Total downloads: [ddownload_count id=”2523″]
File size: [ddownload_filesize id=”2523″]