Проблема с анимацией кнопки WPF

Question

У меня есть кнопка, это уникальная кнопка, и его стиль не должен соответствовать стилю всех остальных. Поэтому, когда вы наводите указатель мыши на эту кнопку, она должна изменить изображение. Но это не работает, вот код ... Я начинаю в WPF, так что если вы можете указать мне, что я делаю неправильно было бы действительно оценили

<Button Name="RemoveButton" ClickMode="Press" BorderThickness="0" Background="Transparent" Style="{StaticResource ButtonStyle1}"> 
     <Button.Content> 
      <Grid> 
       <Image x:Name="CloseActive" x:FieldModifier="public" Height="12" VerticalAlignment="Center" Source="/HTFS.Atlas.Portfolio.PortfolioClient.WCF.Controls;component/Images/tab-close.png" Visibility="Hidden" /> 
       <Image x:Name="CloseInactive" x:FieldModifier="public" Height="12" VerticalAlignment="Center" Source="/HTFS.Atlas.Portfolio.PortfolioClient.WCF.Controls;component/Images/tab-close-inactive.png" /> 
      </Grid> 
     </Button.Content> 
     <Button.Resources> 
      <Storyboard x:Key="MouseOverAnimation"> 
       <DoubleAnimation Storyboard.TargetName="CloseActive" Storyboard.TargetProperty="Opacity" From="0" To="1" Duration="0:0:0.5" /> 
       <DoubleAnimation Storyboard.TargetName="CloseInactive" Storyboard.TargetProperty="Opacity" From="1" To="0" Duration="0:0:0.5" /> 
      </Storyboard> 
      <Storyboard x:Key="MouseOutAnimation"> 
       <DoubleAnimation Storyboard.TargetName="CloseInactive" Storyboard.TargetProperty="Opacity" From="0" To="1" Duration="0:0:0.5" /> 
       <DoubleAnimation Storyboard.TargetName="CloseActive" Storyboard.TargetProperty="Opacity" From="1" To="0" Duration="0:0:0.5" /> 
      </Storyboard> 
      <Style x:Key="CloseButtonStyle" TargetType="{x:Type Control}"> 
       <Style.Triggers> 
        <Trigger Property="IsMouseOver" Value="True"> 
         <Trigger.EnterActions> 
          <BeginStoryboard Storyboard="{StaticResource MouseOverAnimation}" /> 
         </Trigger.EnterActions> 
         <Trigger.ExitActions> 
          <BeginStoryboard Storyboard="{StaticResource MouseOutAnimation}" /> 
         </Trigger.ExitActions> 
        </Trigger> 
       </Style.Triggers> 
      </Style> 
     </Button.Resources> 
    </Button> 

Answer 1

Для CloseActive изображения, вместо того, чтобы использовать Visibility="Hidden" попробуйте Opacity="0". В вашей анимации вы настраиваете непрозрачность изображения, но оно по-прежнему скрыто.

В дополнении к удалению атрибута видимости, попытайтесь поместить анимацию триггера непосредственно в Button.Triggers

 <Button.Triggers> 
      <EventTrigger RoutedEvent="Button.MouseEnter"> 
       <BeginStoryboard Storyboard="{StaticResource MouseOverAnimation}" /> 
      </EventTrigger> 
      <EventTrigger RoutedEvent="Button.MouseLeave"> 
       <BeginStoryboard Storyboard="{StaticResource MouseOutAnimation}" /> 
      </EventTrigger> 
     </Button.Triggers> 

, так как вы не можете использовать Storyboard.TargetName в раскадровке, вызываемой из стиля. Вам также придется использовать триггеры событий вместо обычных триггеров. Вы также можете удалить CloseButtonStyle, так как он не будет использоваться.