How to change the foreground color of all command buttons in MahApps

Question

Is there a way to change buttons foreground in MetroWindow? I have even tried to override the IronicallyNamedChromelessButtonStyle but the foreground color was still the same.

Edit: The buttons are in the Window Bar (e.g Close, Minimize, Maximize).

Noctambulism

Is those buttons are applied with any style (with Key)? – Francesfrancesca

Answer 1

After a deep dive into the MahApps codе... Here is the source which is responsible for the buttons: https://github.com/MahApps/MahApps.Metro/blob/master/MahApps.Metro/Themes/MetroWindow.xaml If you look carefully, you will notice that every style has triggers that override the style foreground with hard-coded "White":

<Style.Triggers>
        <DataTrigger Binding="{Binding ShowTitleBar, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Controls:MetroWindow}}}"
                     Value="True">
            <Setter Property="Foreground"
                    Value="White" />
        </DataTrigger>
        <DataTrigger Binding="{Binding ShowTitleBar, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Controls:MetroWindow}}}"
                     Value="False">
            <Setter Property="Background"
                    Value="Transparent" />
        </DataTrigger>
    </Style.Triggers>

My solution was to override all necessary style triggers:

<Style TargetType="{x:Type MahControls:WindowButtonCommands}">
    <Style.Triggers>
        <DataTrigger Binding="{Binding ShowTitleBar, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type MahControls:MetroWindow}}}"
                     Value="True">
            <Setter Property="Foreground"
                    Value="{StaticResource IdealForegroundColorBrush}" />
        </DataTrigger>
    </Style.Triggers>
</Style>

Hope this will help anyone in my case. Special thanks to @Rui and @Sankarann for the ideas and help. If anyone have a better solution, please share it.

Noctambulism

Answer 2

You can use an implicit style. An implicit style is a style that does not have a "key", for example, if you add this style in Application.Resources it will affect all buttons in your application:

<Application.Resources>
  <Style TargetType="Button">
    <Setter Property="Foreground" Value="Blue"/>
  </Style>
</Application.Resources>

You can set it in, for example, a Grid's Resources and it will affect only the Buttons inside that Grid.

Skiles

thanks but that doesn't work either. I just edit the question for clarification because these buttons are somehow "special". – Noctambulism

@Noctambulism What is the type of those "buttons"? – Skiles

Are those AppBarButton? If so set the TargetType="AppBarButton" and set the style in Page.Resources – Skiles

As far as I think I'm right it should be this file: github.com/MahApps/MahApps.Metro/blob/master/MahApps.Metro/… and the style is called "IronicallyNamedChromelessButtonStyle" and yes TargetType is Button. – Noctambulism

That style has a key (it's not implicit): "IronicallyNamedChromelessButtonStyle". To use that style in your button you'd have to do it explicitly, i.e.: <Button Style={StaticResource IronicallyNamedChromelessButtonStyle}>. – Skiles

Also, if you define the Foreground in the button itself that has precedence over the style – Skiles

these buttons and styles are not defined by me, they comes with the nuget package (MahApps.Metro). Unfortunately, maybe these buttons do not use the foreground property that comes with the styles. – Noctambulism

Answer 3

Yes your right the colours are applied in appbar_ canvas via

Fill="{DynamicResource BlackBrush}"

So as your not in control of BlackBrush you cant really apply a SolidColorBrush to it as some other control in the MahApps Library will overwite your setting.

You need to point NuGet to the Loose resources file (so you get an Icons.xaml file to play with locally)

Copy the appbar icons you want to change color (maybe create a resource dictionary called MyIcons.xaml and save them in there, adding MyIcons.xaml to your App.xaml MergedDictionaries)

Then in MyIcons.xaml define your icon (with its new colour too) :

<SolidColorBrush x:Key="IconBrushOrange" Color="Orange" />

<Canvas  x:Key="my_connecting" All other fields...>
    <Path Stretch="Fill" Fill="{StaticResource IconBrushOrange}" All other fields....  />
</Canvas>

Then in your UI :

<Rectangle Width="20" Height="20">
   <Rectangle.Fill>
       <VisualBrush Stretch="Fill" Visual="{StaticResource my_connecting}"  />
   </Rectangle.Fill>
</Rectangle>

Boardwalk

Answer 4

Just redefine the Brush in window resources:

<SolidColorBrush x:Key="MahApps.Brushes.IdealForeground"  Color="WhateverColor" />

Manuelmanuela