ColorAnimation Gradient On WPF - wpf

Question

<LinearGradientBrush x:Key="BrushPrincipalBorderBlue" EndPoint="1.3,1" StartPoint="-0.2,0">
<GradientStop Color="#FF030637" Offset="1"/>
<GradientStop Color="#FF0E0F31" Offset="0.166"/>
<GradientStop Color="#FF2E2F70" Offset="0.629"/>
<GradientStop Color="#FF030637" Offset="0.63"/>
</LinearGradientBrush>
<Storyboard x:Key="GoToBlue">
<ColorAnimation Storyboard.TargetName="border" Storyboard.TargetProperty="Background.GradientStops[3].Color" Duration="0:0:0.5"
To="{DynamicResource BrushPrincipalBorderBlue.GradientStops[3].Color}" />
</Storyboard>
How i can Set in the 'To' property to an GradientStop Color of my brush? because calling the way im calling it doesnt work.

Answer 1

The BrushPrincipalBorderBlue name is just a key it is not an actual LinearGradientBrush therefore it does not have any Propertys. I was able to get the error to go away by adding a name to the Brush. See if that works for you.
<Window.Resources>
<LinearGradientBrush x:Name="myBrush" x:Key="BrushPrincipalBorderBlue" EndPoint="1.3,1" StartPoint="-0.2,0">
<GradientStop Color="#FF030637" Offset="1"/>
<GradientStop Color="#FF0E0F31" Offset="0.166"/>
<GradientStop Color="#FF2E2F70" Offset="0.629"/>
<GradientStop Color="#FF030637" Offset="0.63"/>
</LinearGradientBrush>
<Storyboard x:Key="GoToBlue">
<ColorAnimation Storyboard.TargetName="border" Storyboard.TargetProperty="Background.GradientStops[3].Color" Duration="0:0:0.5" To="{DynamicResource myBrush.GradientStops[3].Color}" />
</Storyboard>
The only way I was able to access the colors was to define them seperatly i.e.
<Window.Resources>
<Color x:Key="BrushPrincipalBorderBlue.Color1">
<Color.A>#FF</Color.A>
<Color.B>#03</Color.B>
<Color.R>#06</Color.R>
<Color.G>#37</Color.G>
</Color>
<Color x:Key="BrushPrincipalBorderBlue.Color2">
<Color.A>#FF</Color.A>
<Color.B>#0E</Color.B>
<Color.R>#0F</Color.R>
<Color.G>#31</Color.G>
</Color>
<Color x:Key="BrushPrincipalBorderBlue.Color3">
<Color.A>#FF</Color.A>
<Color.B>#2E</Color.B>
<Color.R>#2F</Color.R>
<Color.G>#70</Color.G>
</Color>
<Color x:Key="BrushPrincipalBorderBlue.Color4">
<Color.A>#FF</Color.A>
<Color.B>#03</Color.B>
<Color.R>#06</Color.R>
<Color.G>#37</Color.G>
</Color>
<LinearGradientBrush x:Key="BrushPrincipalBorderBlue" EndPoint="1.3,1" StartPoint="-0.2,0">
<GradientStop Color="{DynamicResource BrushPrincipalBorderBlue.Color1}" Offset="1"/>
<GradientStop Color="{DynamicResource BrushPrincipalBorderBlue.Color2}" Offset="0.166"/>
<GradientStop Color="{DynamicResource BrushPrincipalBorderBlue.Color3}" Offset="0.629"/>
<GradientStop Color="{DynamicResource BrushPrincipalBorderBlue.Color4}" Offset="0.63"/>
</LinearGradientBrush>
<LinearGradientBrush x:Key="BrushPrincipalBorderOriginal" EndPoint="1.3,1" StartPoint="-0.2,0">
<GradientStop Color="#FFFFFFFF" Offset="1"/>
<GradientStop Color="#FFFFFFFF" Offset="0.166"/>
<GradientStop Color="#FFFFFFFF" Offset="0.629"/>
<GradientStop Color="#FFFFFFFF" Offset="0.63"/>
</LinearGradientBrush>
</Window.Resources>
<Grid Name="myGrid" Background="{DynamicResource BrushPrincipalBorderOriginal}" >
<Grid.Triggers>
<EventTrigger RoutedEvent="Canvas.Loaded">
<BeginStoryboard>
<Storyboard>
<ColorAnimation Storyboard.TargetName="myGrid" Storyboard.TargetProperty="Background.GradientStops[3].Color" Duration="0:0:2" To="{DynamicResource BrushPrincipalBorderBlue.Color3}" AutoReverse="True" RepeatBehavior="Forever"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Grid.Triggers>
</Grid>

Answer 2

Not sure what you want to do but Offset is a double number, hence you need to use DoubleAnimation like this one:
<Canvas.Triggers>
<EventTrigger RoutedEvent="Canvas.Loaded">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation
Storyboard.TargetName="BlackCanvasGradient"
Storyboard.TargetProperty="Offset"
From="0" To="0.8" Duration="0:0:2" >
</DoubleAnimation>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Canvas.Triggers>