How to set the theme at design time

Hi Mike,

There is an attached property ThemeManager.Theme that you can apply to any object and that should put the theme on it and its children. Normally you only use this for testing and instead use the ThemeManager.CurrentTheme static property to control the app-wide theme at run-time.

There is one caveat to the ThemeManager.Theme property in the designer. You would think that you could put it on a Window and have it work, but I think since VS doesn't show the Window normally (it's rendered as faded out), setting it on the Window doesn't have an effect. Our guess is that they don't actually load the Window in the designer.

However if you put the attached property on the root child control in the Window, it does seem to work. So say you had a Grid as the root child of a Window. You'd do this: That should apply the style to the Window. Just be sure to remove it after testing so that your app-wide ThemeManager.CurrentTheme setting takes effect at run-time and isn't overridden by this setting.

Hope that helps!

Quote:
That should apply the style to the Window. Just be sure to remove it after testing so that your app-wide ThemeManager.CurrentTheme setting takes effect at run-time and isn't overridden by this setting.

Thats unfortunate... As you might imagine that seems a bit error prone. Is there a way to remove this programatically at application start up?

The only other thing I could think of would be to possibly in code check whether you are in the designer and if so, programmatically set the attached theme property to the root control as mentioned above (after calling InitializeComponent in the constructor first of course).

I haven't tested that but if it did work at least it wouldn't affect run-time, even if you forgot to take it out.

You can use System.ComponentModel.DesignerProperties.GetIsInDesignMode to determine in code if you are in the designer.

So if I understand correctly, if I do this: Then there is no way to override the theme at run time?

Correct, setting that property will load the theme resources at that point, thus overriding global app-wide resources. The property setting must be removed in order to inherit global resources.

This is why I said maybe you could do the attached property in code based on whether you are in design mode.

Well, I could not get this to work : This code never seemed to be called when editing the xaml in design mode.





However, I was able to sort of combine the solutions:

As was suggested, I added this to my dock panel xaml: Then in my constructor I added this: Note that the call is after initialize component and I set the theme on the dock panel. Using the `this` keyword instead of DockPanel does not change the appearance. For that reason, you cannot call set theme prior to InitializeComponent: that fails because the DockPanel is not yet instantiated.

You need to change your SetTheme call code after InitializeComponent to set it to null, not "Office2007Blue". By setting to "Office2007Blue" you will prevent the global theme from being used. Setting it back to null will allow the global theme.