Skip to content

Overriding Material Design Styles

Tyson Williams edited this page Dec 18, 2020 · 3 revisions

If you are not happy with the styles provided by this library, then you can easily override them. Just create a resource dictionary with a new style using the same key as the style you want to override (or omit the key if you want to override the default style for the target type). Make sure you put the original style in the BasedOn attribute.

Example of MaterialDesignThemes.Overrides.xaml:

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"                                     
                    xmlns:materialDesign="clr-namespace:MaterialDesignThemes.Wpf;assembly=MaterialDesignThemes.Wpf">
    
    <Style x:Key="MaterialDesignFloatingHintTextBox" BasedOn="{StaticResource MaterialDesignFloatingHintTextBox}" TargetType="{x:Type TextBox}">
        <Setter Property="FontSize" Value="24" />
        <Setter Property="materialDesign:HintAssist.FloatingScale" Value="0.6" />
        <Setter Property="materialDesign:HintAssist.FloatingOffset" Value="1,-20" />
    </Style>

    <Style BasedOn="{StaticResource MaterialDesignButtonTextBlock}" TargetType="{x:Type TextBlock}">
        <Setter Property="FontSize" Value="24" />
    </Style>

</ResourceDictionary>     

As you are overriding default styles you probably want to merge your new default styles into your App.xaml resources. That would look something like this:

<Application x:Class="MaterialTest.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:local="clr-namespace:MaterialTest"
             StartupUri="MainWindow.xaml">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Light.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Defaults.xaml" /> 

                <ResourceDictionary Source="Your/Path/To/MaterialDesignThemes.Overrides.xaml" />
                <!-- 
                    If you overrides XAML is in a separate assembly you will need to reference it like this:
                    <ResourceDictionary Source="pack://application:,,,/Your.Assembly;component/Themes/MaterialDesignThemes.Overrides.xaml" />
                -->
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</Application>
Clone this wiki locally