What is the correct way to change the Value of multiple Styles?

Question

I am currently trying to implement a Dark Mode to my application. I have multiple ResourceDictionaries , one Window and multiple UserControls . In my MainWindow I've created a Command that is supposed to change the Design during runtime.

One of my ResourceDictionaries looks like this:

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
 
   <Style x:Key="SecondaryBorder" TargetType="Border">
       <Style.Setters>
           <Setter Property="Background" Value="#272726"/>
       </Style.Setters>
   </Style>

   <Style x:Key="WindowTheme" TargetType="Window">
       <Style.Setters>
           <Setter Property="Background" Value="#3c3c3b"/>
       </Style.Setters>
   </Style>

   <Style x:Key="HeadlineReports" TargetType="TextBlock">
       <Style.Setters>
           <Setter Property="Foreground" Value="White"/>
           <Setter Property="FontSize" Value="20"/>
           <Setter Property="FontFamily" Value="Rubik Light"/>
           <Setter Property="HorizontalAlignment" Value="Left"/>
       </Style.Setters>
   </Style>

</ResourceDictionary>

Here I would like to change the following values: #272726 → #55ffff and #3c3c3b → #FFFFFF .

At first, I thought that I could create a global value for each colour and simply change the value with code-behind, however, I now learned that you are not supposed to do that with ResourceDictionaries .

What would be the correct way to change the colour throughout the whole application?

Answer 1

Create a copy of the existing ResourceDictionary and edit the values in this copy.

When you want to switch theme, you then remove the existing resource dictionary and merge the new one. Something like this:

App.Current.Resources.MergedDictionaries.Clear();
App.Current.Resources.MergedDictionaries.Add(new ResourceDictionary()
{
    Source = new Uri("dark.xaml") 
});