WPF, Создайте анимацию кисти в стиле. Стиль кнопки кнопки

Question

Я сейчас работаю над стилем Button, я включил шаблон управления и триггеры стиля. Теперь я хочу, чтобы фоновая кисть исчезла до определенного цвета, когда мышь вводится на кнопку. Но цветовая анимация не будет работать с кистью. и я застрял на этом со вчерашнего дня. Вот то, что я сделал до сих пор в моем стиле кнопки:

<Converters:MathConverter x:Key="MathConverter" /> 
<Converters:ColorToBrushConverter x:Key="ColorToBrushConverter" /> 
<Style TargetType="Button"> 
    <Setter Property="FontSize" 
      Value="{Binding FontSizeButton}" /> 
    <Setter Property="Margin" 
      Value="{Binding FontSizeBase, Converter={StaticResource MathConverter}, ConverterParameter=@VALUE/3}" /> 
    <Setter Property="Padding" 
      Value="{Binding FontSizeButton, Converter={StaticResource MathConverter}, ConverterParameter=@VALUE/3}" /> 
    <Setter Property="MinWidth" 
      Value="{Binding ActualHeight, RelativeSource={RelativeSource Self}}" /> 
    <Setter Property="Width" 
      Value="NaN" /> 
    <Setter Property="Background" 
      Value="{Binding BrushBackButton}" /> 
    <Setter Property="BorderBrush" 
      Value="{Binding BrushBorder}" /> 
    <Setter Property="BorderThickness" 
      Value="{Binding BorderThicknessBase}" /> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type Button}"> 
       <Border x:Name="MainBorder" BorderBrush="{TemplateBinding BorderBrush}" 
         BorderThickness="{TemplateBinding BorderThickness}" 
         Background="{TemplateBinding Background}"> 
        <ContentPresenter x:Name="Content" 
             VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
             HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
             TextElement.Foreground="{TemplateBinding Foreground}" /> 
       </Border> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
    <Style.Triggers> 
     <!-- 
     <Trigger Property="IsMouseOver" 
       Value="True"> 
      <Setter Property="Background" 
        Value="{Binding BrushBackButtonOver}" /> 
     </Trigger> 
     --> 
     <EventTrigger RoutedEvent="MouseEnter"> 
      <BeginStoryboard> 
       <Storyboard TargetProperty="Background"> 
        <ColorAnimation To="Blue" Duration="10"/> 
       </Storyboard> 
      </BeginStoryboard> 
     </EventTrigger> 
    </Style.Triggers> 
</Style> 

Answer 1

Вы должны использовать VisualStateManager для такого рода проблемы.

Это может привести вас к чему-то вроде этого:

<Style TargetType="{x:Type Button}"> 
    <Setter Property="Template"> 
     <Setter.Value> 
     <ControlTemplate TargetType="{x:Type Button}"> 
      <Border x:Name ="Border" Background="LightBlue"> 
      <VisualStateManager.VisualStateGroups> 
       <VisualStateGroup x:Name="CommonStates"> 
        <VisualStateGroup.Transitions> 
        <VisualTransition GeneratedDuration="0:0:0.2"/> 
        </VisualStateGroup.Transitions> 
        <VisualState x:Name="Normal"/> 
        <VisualState x:Name="Pressed"> 
        <Storyboard> 
         <ColorAnimation 
        Storyboard.TargetProperty="(Background).(SolidColorBrush.Color)" 
        To="Red"/> 
        </Storyboard> 
        </VisualState> 
        <VisualState x:Name="MouseOver"> 
         <Storyboard> 
         <ColorAnimation 
        Storyboard.TargetProperty="(Background).(SolidColorBrush.Color)" 
        To="Blue"/> 
         </Storyboard> 
        </VisualState> 
       </VisualStateGroup> 
      </VisualStateManager.VisualStateGroups> 
      <ContentPresenter Content="{TemplateBinding Content}"/> 
     </Border> 
[...] 

[Редактировать] Что касается вашей конкретной проблемы, вы должны поставить триггер в Триггеры ControlTemplate в.

<ControlTemplate TargetType="{x:Type Button}"> 
[...] 
    <ControlTemplate.Triggers> 
    <EventTrigger RoutedEvent="MouseEnter"> 
     <BeginStoryboard> 
      <Storyboard TargetName="Border" TargetProperty="(Background).(SolidColorBrush.Color)"> 
       <ColorAnimation To="Blue" Duration="0:0:0.2"/> 
      </Storyboard> 
     </BeginStoryboard> 
     </EventTrigger> 
    </ControlTemplate.Triggers>