Silverlight以style.xaml向图像添加动画

Question

I got a button, that display an image. I want to add, to this image, an animation, so that it will blink (so the user can't ignore it).

So I tried this in the style.xaml :

<Style x:Key="WarningIcon" TargetType="Button">
        <Setter Property="Height" Value="30"/>
        <Setter Property="Width" Value="30"/>
        <Setter Property="VerticalAlignment" Value="Center"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ContentControl">
                    <Grid>
                        <Image Source="../images/im_warning.png" />
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="Visibility">
            <Setter.Value>
                <Storyboard>
                    <ObjectAnimationUsingKeyFrames
                        Storyboard.TargetProperty="(Button.Visibility)"
                          Duration="5:0:0.5"
                          RepeatBehavior="Forever"/>
                </Storyboard>
            </Setter.Value>
        </Setter>
    </Style>

But it doesn't work.

What kind of animation, and setter should I add to make the image blinking, so basically, appear and desappear?

I do not find any example that match with my research.

Thank you.

Answer 1

You should start animation after defining it. Another thing is that probably Opacity will look better:

<Style 
    ...
    <Style.Triggers>
      <EventTrigger RoutedEvent="Image.Loaded">
        <BeginStoryboard>
          <Storyboard>
            <DoubleAnimation Storyboard.TargetProperty="(Image.Opacity)"
                             BeginTime="0:0:0" Duration="0:0:0.5"
                             From="1.0" To="0.0" RepeatBehavior="Forever" AutoReverse="True"/>

          </Storyboard>
        </BeginStoryboard>
      </EventTrigger>
    </Style.Triggers>
    ...
</Style>