开发者

Silverlight: repeat storyboard shape animation

I'm creating Silverlight application. I need to make some shape blinking few times.

Here what I have now (simplified code):

<UserControl>
    <UserControl.Resources>
        <Storyboard x:Name="Storyboard">
            <ColorAnimationUsingKeyFrames
                    Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" 
                    Storyboard.TargetName="ellipse">
                <EasingColorKeyFrame KeyTime="0" Value="Black"/>
                <EasingColorKeyFrame KeyTime="0:0:1" Value="White"/>
                <EasingColorKeyFrame KeyTime="0:0:2" Value="Black"/>
            </ColorAnimationUsingKe开发者_JAVA技巧yFrames>
        </Storyboard>
    </UserControl.Resources>
    <Grid x:Name="LayoutRoot" Background="White">
        <Ellipse x:Name="ellipse" Fill="Black" Width="100" Height="100" />
    </Grid>
</UserControl>

I set animation of blinking for 1 time (black color of circle -> white -> black again) in storyboard. Tell me please, how can I make it repeat, say 5 times more? Do I need to copy-paste tag EasingColorKeyFrame or there more smart way exist?

Thanks.


Add a RepeatBehavior attribute to your <ColorAnimationUsingKeyFrames> element. @MSDN


Put RepeatBehavior="6x" on your ColorAnimationUsingKeyFrames as follows:

<UserControl>
    <UserControl.Resources>
        <Storyboard x:Name="Storyboard">
            <ColorAnimationUsingKeyFrames RepeatBehavior="6x" 
                    Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" 
                    Storyboard.TargetName="ellipse">
                <EasingColorKeyFrame KeyTime="0" Value="Black"/>
                <EasingColorKeyFrame KeyTime="0:0:1" Value="White"/>
                <EasingColorKeyFrame KeyTime="0:0:2" Value="Black"/>
            </ColorAnimationUsingKeyFrames>
        </Storyboard>
    </UserControl.Resources>
    <Grid x:Name="LayoutRoot" Background="White">
        <Ellipse x:Name="ellipse" Fill="Black" Width="100" Height="100" />
    </Grid>
</UserControl>
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜