Can you see what’s wrong with this Storyboard XAML fragment?
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="Electron"> <EasingColorKeyFrame KeyTime="0" Value="#FFFAFFA1"/> </ColorAnimationUsingKeyFrames>
“Electron” is just an everyday Ellipse:
<Ellipse x:Name="Electron" Fill="#FFA1A1A1"/>
The Storyboard Animation is only trying to change the Fill of the Ellipse. Don’t feel bad if you can’t see what’s wrong with this XAML because I don’t see anything wrong with it either.
And it works in Blend.
And it compiles.
And it works at runtime.
So is this a trick question? Not according to Visual Studio, which says there is something very wrong with that XAML:
After an hour of rolling the refactor dice trying to somehow obfuscate this problem away, I found a post suggesting that the Visual Studio designer does not like the TargetProperty of ColorAnimationUsingKeyFrames (e.g, Fill, Stroke, Background, Foreground) to be prefaced with its parent.
In other words, don’t use “(Shape.Fill)”… just use “(Fill)”:
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Fill).(SolidColorBrush.Color)" Storyboard.TargetName="Electron"> <EasingColorKeyFrame KeyTime="0" Value="#FFFAFFA1"/> </ColorAnimationUsingKeyFrames>
Sure enough, the Visual Studio designer now renders the control without a problem: