具有多个ColorAnimations的Silverlight故事板

Question

我很难弄清楚如何使用ColorAnimation沿着可见的颜色光谱更改椭圆的填充颜色.ColorAnimation将颜色混合在一起而不是沿着色谱移动,所以我想出了以下内容.

<Ellipse x:Name="indicatorEllipse" HorizontalAlignment="Right" VerticalAlignment="Center" Height="20" Width="20" Stroke="Black" Margin="0 0 5 0" >
<Ellipse.Resources>
    <Storyboard x:Name="indicatorStoryboard">
        <!-- Animate the fill color of the Ellipse from red to green over 100 seconds. -->
        <ColorAnimation BeginTime="00:00:00" Storyboard.TargetName="indicatorColorBrush" 
Storyboard.TargetProperty="Color"
From="Red" To="OrangeRed" Duration="0:00:14" />
        <ColorAnimation BeginTime="00:00:15" Storyboard.TargetName="indicatorColorBrush" 
Storyboard.TargetProperty="Color"
From="OrangeRed" To="Orange" Duration="0:00:14" />
        <ColorAnimation BeginTime="00:00:30" Storyboard.TargetName="indicatorColorBrush" 
Storyboard.TargetProperty="Color"
From="Orange" To="Yellow" Duration="0:00:30" />
        <ColorAnimation BeginTime="00:01:01" Storyboard.TargetName="indicatorColorBrush" 
Storyboard.TargetProperty="Color"
From="Yellow" To="YellowGreen" Duration="0:00:14" />
        <ColorAnimation BeginTime="00:01:16" Storyboard.TargetName="indicatorColorBrush" 
Storyboard.TargetProperty="Color"
From="YellowGreen" To="GreenYellow" Duration="0:00:14" />
        <ColorAnimation BeginTime="00:01:31" Storyboard.TargetName="indicatorColorBrush" 
Storyboard.TargetProperty="Color"
From="GreenYellow" To="Green" Duration="0:00:14" />
    </Storyboard>
</Ellipse.Resources>
<Ellipse.Fill>
    <SolidColorBrush x:Name="indicatorColorBrush" Color="Red" />
</Ellipse.Fill>

哪个不行!这导致以下错误......

同一个包含Storyboard的多个动画无法在单个元素上定位相同的属性.

任何人都有关于如何实现这一点的想法？

Answer 1

ColorAnimationUsingKeyFrames将解决您的问题:

<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="Color" Storyboard.TargetName="indicatorColorBrush">
    <SplineColorKeyFrame KeyTime="0:0:2" Value="OrangeRed"/>
    <SplineColorKeyFrame KeyTime="0:0:4" Value="Orange"/>
    <SplineColorKeyFrame KeyTime="0:0:6" Value="Yellow"/>
</ColorAnimationUsingKeyFrames>

我也会尝试使用Expression Blend,这样可以更轻松地处理动画.