There are various times where you often find yourself needing to change styles and then the key problem here is that you can’t grab hold of the styles. A classic example is that of trying to style things in the Silverlight Toolkit.
To get around this problem I use 2 great tools. One is called Silverlight Spy and the other Reflector.
Silverlight Spy allows you to take a sneak peak at what’s going on under the hood. Reflector is a .NET disassemble tool.
In this example I’m going to show you how to style a Calendar control from the Silverlight (System.Windows.Controls). In this example I’m going to change the backgrounds for the various day types (normal, selected, today).
So I have created a basic Calendar control on screen:
I then load up Reflector and I get it to load the DLL of the Silverlight Controls. I then disassemble the DLL and load up the contents
I then right click the themes/generic.xaml in the right pane and then Save As. I then open the saved file to find loads of styles for all the various components in the DLL. Now to get a greater understanding of what Style I want I use Silverlight Spy.
So I’ve decided that I’m going to change the background colours of the all the days so according to the Silverlight Spy I should be looking at CalendarDayButton, which just so happens to have a Style attached to it, which can be seen in the generic.xaml we downloaded. I need to change the Fill property of 3 Rectangles called TodayBackground, SelectedBackground and Background.
All I need to do it copy and paste the Style into my resources so it’s available to my Calendar control and hunt down those rectangles.
A few changes to the fill properties.
Now you need to make sure you do this checklist:
- Ensure you have the ResourceDictionary from the generic.xaml also pasted otherwise you will get loads of vsm errors. - Name the Style so in this case I set the Key of the Style to myCalendarStyle. - Don’t forget to apply the style to your control
- Ensure you have the ResourceDictionary from the generic.xaml also pasted otherwise you will get loads of vsm errors.
- Name the Style so in this case I set the Key of the Style to myCalendarStyle.
- Don’t forget to apply the style to your control
<controls:Calendar CalendarDayButtonStyle="{StaticResource myCalendarStyle}" />
Load the page up again and:
Granted the colours aren’t great but you get the gist. :)