Changing Foreground for IsMouseOver anf IsPressed is not working in custom style-CodePudding

No matter what I try I can't set get the trigger IsMouseOver and IsPressed to change the Foreground. I have been trying to alter it in the Button itself.

<Button (STUFF HERE)>
<Trigger Property="IsMouseOver" Value="true">
                        <Setter Property="Foreground" Value="#FF373737"/>
                    </Trigger>
<Trigger Property="IsPressed" Value="true">
                        <Setter Property="Foreground" Value="#FF4D4D4E"/>
                    </Trigger>
</Button>

I have been trying to look it up, but I am pretty amateur with XAML.

CodePudding user response：

You have to create a style where you put the Triggers. Add this style to any resource dictionary in scope, e.g. the Window.Resources or the application resources if you want to reuse it across the application. If you omit the x:Key, you make it implicit and therefore apply to all Buttons in scope.

<Style x:Key="MyButtonStyle" TargetType="{x:Type Button}">
   <Style.Triggers>
      <Trigger Property="IsMouseOver" Value="True">
         <Setter Property="Foreground" Value="#FF373737"/>
      </Trigger>
      <Trigger Property="IsPressed" Value="True">
         <Setter Property="Foreground" Value="#FF4D4D4E"/>
      </Trigger>
   </Style.Triggers>
</Style>

Then reference that style in the Button.

<Button Style="{StaticResource MyButtonStyle}" .../>

Alternatively, you could also directly assign the style to the Button if it is the only one.

<Button Content="Styled">
   <Button.Style>
      <Style TargetType="{x:Type Button}">
         <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
               <Setter Property="Foreground" Value="#FF373737"/>
            </Trigger>
            <Trigger Property="IsPressed" Value="True">
               <Setter Property="Foreground" Value="#FF4D4D4E"/>
            </Trigger>
         </Style.Triggers>
      </Style>
   </Button.Style>
</Button>

Note that while this works for the Foreground property, it does not for properties like Background as they are defined in the ControlTemplate triggers which take precedence over a style. In order change those, you have to copy and adapt the Button ControlTemplate.

CodePudding user response：

here the general layout for styling controls:

<Button Content="OK">
  <Button.Style>
    <Style TargetType="Button">
      <Style.Triggers >
        <Trigger Property="IsMouseOver" Value="true">
          <Setter Property="Foreground" Value="#FF373737"/>
        </Trigger>
        <Trigger Property="IsPressed" Value="true">
          <Setter Property="Foreground" Value="#FF4D4D4E"/>
        </Trigger>
      </Style.Triggers>
    </Style>
  </Button.Style>
</Button>

If you want to reuse the style, then save it to a resourcedictionary as a named style and you can refer to it on your controls