I cannot resolve the path from Storyboard.TargetProperty in my WPF app

Question

In my WPF application I have an animation of a certain element. The element to be animated looks like this.

    <Path x:Name="theX" StrokeThickness="7" StrokeStartLineCap="Round" StrokeEndLineCap="Round">
        <Path.Data>
            <GeometryGroup>
                <LineGeometry StartPoint="4, 4" EndPoint="60, 60"/>
                <LineGeometry StartPoint="4, 60" EndPoint="60, 4"/>
            </GeometryGroup>
        </Path.Data>
    </Path>

The color of the LineGeometry elements should be animated, but I don't know how the Storyboard.TargetProperty path is resolved. In this case the GeometryGroup element causes problems. How is the GeometryGroup element accommodated in the path of the Storyboard.TargetProperty , see the three "???".

I've already tried the following: ...).GeometryGroup.(... ...).(GeometryGroup.Children).(... ...).GeometryCollection.(... ... also i've tried that (Path.Stroke).(SolidColorBrush.Color)

    <ColorAnimationUsingKeyFrames BeginTime="0:0:1" Duration="0:0:1"
                                                              Storyboard.TargetName="theX"
                                                              Storyboard.TargetProperty="(Path.Stroke).???.(SolidColorBrush.Color)"
                                                              FillBehavior="Stop">
                <DiscreteColorKeyFrame Value="#333333" KeyTime="0:0:0"/>
                <LinearColorKeyFrame Value="#6AFF00" KeyTime="0:0:0.2"/>
                <DiscreteColorKeyFrame Value="#6AFF00" KeyTime="0:0:0.5"/>
                <LinearColorKeyFrame Value="#333333" KeyTime="0:0:0.9"/>
     </ColorAnimationUsingKeyFrames>

The Geometry-elements are part of a DataTemplat of an ItemsControl with data binding. And I get an exception on the .NET property linked via data binding.

The translation of the exception:

System.InvalidOperationException: "Not all property references in property path" (0).GeometryGroup. (1) "can be resolved. Make sure that suitable objects support the properties."

In the application there is a similar element, an EllipseGeometry , in which the animation works in this way. The difference is the GeometryGroup element.

<Path x:Name="theO" StrokeThickness="6" Stroke="Transparent">
    <Path.Data>
        <EllipseGeometry Center="25, 25" RadiusX="22" RadiusY="22"/>
    </Path.Data>
</Path>


<ColorAnimationUsingKeyFrames BeginTime="0:0:1" Duration="0:0:1"
                                                              Storyboard.TargetName="theO"
                                                              Storyboard.TargetProperty="(Path.Stroke).(SolidColorBrush.Color)"
                                                              FillBehavior="Stop">
                <DiscreteColorKeyFrame Value="#333333" KeyTime="0:0:0"/>
                <LinearColorKeyFrame Value="#FF4F00" KeyTime="0:0:0.2"/>
                <DiscreteColorKeyFrame Value="#FF4F00" KeyTime="0:0:0.5"/>
                <LinearColorKeyFrame Value="#333333" KeyTime="0:0:0.9"/>
</ColorAnimationUsingKeyFrames>

Many thanks for the help.

Answer 1

Notice in the working example you have a transparent brush set to the Stroke property.
But in the first example, nothing is set to this property.
Hence it is null.
And null has no properties to animate them.

You can explicitly set SolidColorBrush instance in this property, give this instance a name, and access its Color property directly.
It will be much easier than all these casts.

Example:

        <Path x:Name="theX" StrokeThickness="7" StrokeStartLineCap="Round" StrokeEndLineCap="Round">
            <Path.Stroke>
                <SolidColorBrush x:Name="PathStroke" Color="Transparent"/>
            </Path.Stroke>
            <Path.Data>
                <GeometryGroup>
                    <LineGeometry StartPoint="4, 4" EndPoint="60, 60"/>
                    <LineGeometry StartPoint="4, 60" EndPoint="60, 4"/>
                </GeometryGroup>
            </Path.Data>
        </Path>

        <ColorAnimationUsingKeyFrames BeginTime="0:0:1"
                                      Duration="0:0:1"
                                      Storyboard.TargetName="PathStroke"
                                      Storyboard.TargetProperty="Color"
                                      FillBehavior="Stop">
            <DiscreteColorKeyFrame Value="#333333" KeyTime="0:0:0"/>
            <LinearColorKeyFrame Value="#6AFF00" KeyTime="0:0:0.2"/>
            <DiscreteColorKeyFrame Value="#6AFF00" KeyTime="0:0:0.5"/>
            <LinearColorKeyFrame Value="#333333" KeyTime="0:0:0.9"/>
        </ColorAnimationUsingKeyFrames>