Не могу сделать анимацию

Question

Я хочу, чтобы изменить размер кнопки от 70 до 90, когда курсор мыши находится над:

<Style TargetType="Button" 
     x:Key="RadialButton"> 
    <Setter Property="Width" 
      Value="70"></Setter> 
    <Setter Property="Height" 
      Value="85"></Setter> 
    <Setter Property="Template"> 
    <Setter.Value> 
     <ControlTemplate> 
     <ControlTemplate.Resources> 
      <Storyboard x:Key="Storyboard1"> 
      <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Width)" 
              Storyboard.TargetName="ExtEllipse"> 
       <EasingDoubleKeyFrame KeyTime="0:0:1" 
            Value="90" /> 
      </DoubleAnimationUsingKeyFrames> 
      </Storyboard> 
     </ControlTemplate.Resources> 
     <Grid Name="MainGrid"> 
      <Grid.RowDefinitions> 
      <RowDefinition Height="70"></RowDefinition> 
      <RowDefinition Height="15"></RowDefinition> 
      </Grid.RowDefinitions> 
      <Ellipse Width="70" 
        Height="70" 
        Stroke="Gray" 
        Grid.Row="0" 
        Name="ExtEllipse" 
        Fill="{x:Null}" /> 
      <Ellipse Width="50" 
        Height="50" 
        Stroke="Gray" 
        Grid.Row="0"></Ellipse> 
      <TextBlock Grid.Row="1" 
        FontSize="13" 
        FontWeight="Bold" 
        TextAlignment="Center" 
        Foreground="Green"> 
         <ContentPresenter RecognizesAccessKey="True" 
              Content="{TemplateBinding Button.Content}" /> 
      </TextBlock> 
     </Grid> 
     <ControlTemplate.Triggers> 
      <EventTrigger RoutedEvent="FrameworkElement.Loaded" /> 
     </ControlTemplate.Triggers> 
     </ControlTemplate> 
    </Setter.Value> 
    </Setter> 
</Style> 

с помощью:

<Button Content="Button" 
     HorizontalAlignment="Left" 
     Margin="36,140,0,147" 
     Width="151" 
     Style="{DynamicResource RadialButton}" /> 

, но он не работает. Ничего не произошло. Почему и как решить эту проблему?

Answer 1

Это потому, что у вас есть раскадровка, но вы ее не играете.

Попробуйте добавить триггер, чтобы играть в эту раскадровку. Что-то вроде этого:

<Trigger Property="IsMouseOver" Value="True"> 
    <Trigger.EnterActions> 
     <BeginStoryboard Storyboard="{StaticResource Storyboard1}" /> 
    </Trigger.EnterActions> 
</Trigger> 

Btw это результат вашей анимации:

Answer 2

Вы должны начать свой Storyboard. Ваш EventTrigger ничего не делает.

<EventTrigger RoutedEvent="MouseEnter"> 
    <BeginStoryboard Storyboard="{StaticResource Storyboard1}" /> 
</EventTrigger>