WPF + Mahapps Metro: Why is the ClearTextButton icon showing as a letter r when defining TextBlock style

Question

Using Visual Studio 2022, .NET Core6, WPF (with MVVM), Mahapps Metro (+IconPacks), C#

I'm using Mahapps Metro and I defined a style for the ComboBox so that it shows a clear text button.

<Style TargetType="ComboBox" x:Key="{x:Type ComboBox}"
           BasedOn="{StaticResource MahApps.Styles.ComboBox}">
        <Setter Property="FontFamily" Value="Segoe UI"/>
        <Setter Property="FontSize" Value="9"/>
        <Setter Property="mah:TextBoxHelper.ClearTextButton" Value="True"/>
    </Style>

This seems to work perfectly...

However... When I also define a style for TextBlock then the X icon is suddenly shown as the letter 'r'

<Style x:Key="{x:Type TextBlock}" TargetType="TextBlock"
           BasedOn="{StaticResource MahApps.Styles.TextBlock}">
        <Setter Property="FontFamily" Value="Segoe UI"/>
        <Setter Property="FontSize" Value="9"/>
    </Style>

The xaml for my combobox is quite simple...

<ComboBox x:Name="CustomerCustomerCategoryComboBox"
                                  Grid.Column="2" Grid.Row="2"
                                  MinWidth="100"
                                  Grid.ColumnSpan="3"

I'm completely baffled to be honest. I have no clue whatsoever as to what causes this behaviour. Has someone else experienced this or, better even, know what I can do to solve this ?

I've tried all sorts of things... removing the Texblock style solves it obviously but that way I lose the style for all my other textblocks. Tried playing around with the Style settings, googled my problem with several keywords and phrases but I seem to be the only one???

Answer 1

As you can see from the default style for the clear button here , it uses:

• TextBoxHelper.ButtonContent as Content, which provides the string "r".
• TextBoxHelper.ButtonFontFamily as FontFamily, which provides the font Marlett.

In other words, a special font is used that has symbols instead of letters and r is the cross symbol.

Your style is a so-calledimplicitstyle, meaning it specifies the control type itself as x:Key. Therefore it will apply toallTextBlocks in scope that do not explicitly set a different style. This also applies to the TextBlocks that displays the cross symbol for the clear button. You effectively override the default font family.

Overriding control styles globally is not favorable, especially if you use external libraries that depend on default framework styles. You should either create an explicit TextBlock style and apply it where youreallyneed it or create an implicit style in a limited local scope (Resources of a view or control) where you can be sure that it does not intefere with other styles. Doing it the other way around - creating a local implicit style that reverts the global style might be brittle as you cannot be sure how a TextBlock nested deep inside a control template is actually defined and it might change in the future, too. Plus, keeping track of these implementation details is hard.