2012-03-28 11 views
1

Ich habe Probleme herauszufinden, wie man die Füllfarbe einer Ellipse entlang des sichtbaren Farbspektrums mit ColorAnimation ändert. ColorAnimation mischt die Farben zusammen, anstatt sich im Farbspektrum zu bewegen, also habe ich folgendes gefunden.Silverlight Storyboard mit mehreren ColorAnimations

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

Welche funktioniert nicht! Daraus ergibt sich die folgende Fehler ...

Mehrere Animationen in derselben enthalten Storyboard nicht die gleiche Eigenschaft auf einem einzigen Element ausrichten können.

Wer hat Ideen, wie dies zu erreichen ist?

+0

Ich erstellte mehrere Storyboards und fügte für jedes Storyboard einen Completed-Handler hinzu, um von einer Transition zur nächsten zu wechseln, aber das kann unmöglich die beste Lösung sein. – antwarpes

Antwort

5

ColorAnimationUsingKeyFrames wird Ihr Problem lösen:

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

ich auch einen Versuch geben Expression Blend würde sugest, macht es mit Animationen ziemlich viel einfacher zu arbeiten.

+0

argh! Wie habe ich ColorAnimationUsingKeyFrames übersehen ?! ty! – antwarpes