CODEWITHSUNDEEP
wpfanimationresources
Oleg Sh
Oleg Sh

Reputation: 9013

Can't do animation

I want to change size of button from 70 till 90 when mouse is over:

<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>

using:

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

but it does not work. Nothing happened. Why and how to solve this problem?

Upvotes: 0

Views: 39

Answers (2)

Kapit&#225;n Ml&#237;ko
Kapit&#225;n Ml&#237;ko

Reputation: 4538

That's because you have Storyboard, but you don't play it.

Try add trigger to play that storyboard. Something like this:

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

Btw this is result of your animation:

enter image description here

Upvotes: 1

LPL
LPL

Reputation: 17063

You have to start your Storyboard. Your EventTrigger does nothing.

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

Upvotes: 1

Related Questions