PowerShell and WPF: Dynamically change theme of a GUI


In this post I will show you how to change the main theme and accent from a PowerShell and WPF application with MahApps directly from a button in the GUI.

When I build my previous tool, I first build two versions, one for Light theme and one for dark theme.
A colleague told me why not including the change from the tool ?
I said, oh boy I'm a lazy man, I don't want to search in the main MahApps DLL 😂
Finally I did it.
I look into the Mahapps.metro.dll with the great tool dnspy.
Now let's see how to do this.

How to get the sample

Theme and accent
Before to start, here is a quick reminder about Mahapps Theme and Accent.
The theme is the main design of the GUI. It will work like Windows 10 with two themes:
- BaseDark: Dark theme, meaning black
- BaseLight: Light theme, meaning white
The Accent will be used to change all colors of you Controls in one click.

How to proceed ?
To change the theme we will use the class [MahApps.Metro.ThemeManager].
In this one we will use two methods:
- DetectAppStyle: To detect the current theme or accent
- ChangeAppStyle: To change the current theme or accent

Working with theme
Detects the current theme
As mentioned above, to detect the current theme or accent used in an application we will use the DetectAppStyle method, as below:
In this line, $form is the name of my GUI in the PS1 file.
The $Theme variable will returned the below part.

We can see that two item are available:
- item1: MahApps.Metro.AppTheme
- item2: MahApps.Metro.Accent

It means to detect the theme or accent we will use one of the two item.
Now if we check values for item1 we have the below thing:

We can see that the theme can be retrieved using the name property.
See below how to detect easily, the current theme used in your application:

Changes the theme dynamically
As mentioned before to change the current theme we will use both methods DetectAppStyle and ChangeAppStyle.
As before we will use the DetectAppStyle to detect the current theme, as below:
Then we will apply a new theme using the method GetAppTheme with the theme to set,as below:
In this line, $form is the name of my GUI in the PS1 file.
See below how to apply BaseDark or BaseLight theme.
In the below code, I used a button in the titlebar to change the theme. 
This will change the theme depending of the current theme of the GUI:
- If the current theme is Light, after clicking on the button it will be Dark
- If the current theme is Dark, after clicking on the button it will be Light


Working with accent
Detects the current accent
As mentioned before the DetectAppStyle method will return two items, as below:

To detect the theme we have use the item1 property.
As you can see on the picture, to get the current accent you will have to use item2.
This will return the below accent:

Now we can see, as for the theme, that we will have to use the name property to get the accent, as below:

Changes the accent dynamically
To change the current accent we will use both methods DetectAppStyle and ChangeAppStyle.
As before we will use the DetectAppStyle to detect the current accent, as below:
Then we will apply a new theme accent  using the method GetAccent with the accent to set,as below:
See below how to apply a new accent, in my case, red, Cobalt or pink:
In the below code, I used a combobox to change the theme. 
This will change the accent depending of the selected value:

Dynamic change in action
In the below sample I created a button in the title bar.
When I click on it this will change the main theme as below:
- If the current theme is Light, the theme will be Dark
- If the current theme is Dark, the theme will be Light

I also created twow ComboBox:
- Change accent
- Change theme

See the result below:

Share this

Related Posts

Previous
Next Post »