Ndtyjky

I'm attempting to create an animation for a GradientBrush that will animate each gradient to cycle through all of the colors contained within the gradient indefinitely.

Because of the complex nature of this task, I've taken to handling everything in the code behind, rather than in XAML.

Fortunately, I'm getting no errors or exceptions with my code.

Unfortunately, it's also doing absolutely nothing.

In compliance with the minimal, complete and verifiable example requirements:

using System;

using System.Collections.Generic;

using System.Linq;

using System.Windows;

using System.Windows.Media;

using System.Windows.Media.Animation;



namespace MCVE {

    /// <summary>

    /// Interaction logic for App.xaml

    /// </summary>

    public partial class Program {

        private static  LinearGradientBrush TestBrush { get; } =

            new LinearGradientBrush(

                new GradientStopCollection( new[ ]{

                    new GradientStop( Colors.Black, 0 / 1.0D ),

                    new GradientStop( Colors.White, 1 / 1.0D )

                } ), new Point( 0.0D, 0.0D ), new Point( 1.0D, 1.0D ) );

        [STAThread]

        public static int Main( ) {

            Storyboard board = CreateStoryboard( TestBrush );

            Window w = new Window( ){

                Background = TestBrush

            };



            w.Loaded += new RoutedEventHandler(

                ( S, E ) => board.Begin( w, true ) );

            Program program = new Program( );

            program.InitializeComponent( );

            return program.Run( w );

        }



        public static Storyboard CreateStoryboard( GradientBrush brush ) {

            Storyboard board = new Storyboard( ){

                Duration = new Duration( TimeSpan.FromSeconds( 1.0D ) ),

                RepeatBehavior = RepeatBehavior.Forever

            };



            foreach (

                var animation

                in brush.GradientStops.Select(

                    GS => _CreateGradientStopAnimation(

                        GS, brush.GradientStops.SkipWhile( G => G != GS

                        ).Concat( brush.GradientStops.TakeWhile( G => G != GS )

                        ).Concat( new[ ] { GS } ).Select( G => G.Color ) ) ) )

                board.Children.Add( animation );



            return board;



            ColorAnimationUsingKeyFrames _CreateGradientStopAnimation(

                GradientStop stop, IEnumerable<Color> colors ) {

                ColorAnimationUsingKeyFrames animation =

                    new ColorAnimationUsingKeyFrames( );

                Storyboard.SetTarget( animation, stop );

                Storyboard.SetTargetProperty(

                    animation, new PropertyPath(

                        GradientStop.ColorProperty ) );



                foreach ( var keyFrame in colors.Select(

                    C => new EasingColorKeyFrame( C ) ) )

                    animation.KeyFrames.Add( keyFrame );



                return animation;

            }

        }

    }

}

I've tried using just the ColorAnimationUsingKeyFrames for each gradient within the brush, and that DOES work, but I would prefer to use a Storyboard ( if possible ) so that all of the animations can be started together.

Is what I am trying to do possible? If so, what am I doing wrong?

If not, what can I do to accomplish what I am trying to get done here ( starting up many different animations simultaneously )?

Not sure what exactly the problem is, but it seems sufficient to freeze the Storyboard:

var storyboard = CreateStoryboard(TestBrush);

storyboard.Freeze();



Loaded += (s, e) => storyboard.Begin();

I'm attempting to create an animation for a GradientBrush that will animate each gradient to cycle through all of the colors contained within the gradient indefinitely.

I would love to use XAML but the requirements are too complex for me to implement in XAML, mostly because I don't know how to make it work in XAML.

I could give you a leads how to do this with XAML. As far as i understood your Storyboard, a Color moves slowly through the Background with gradients to the foregoing and following Color.

Concept

Fotunately only the Colors with an Offset between 0 and 1are visible, therefore we can use this like a limiter on a Cologradient with mutliple Colors (see left figure).

If we now move the Offsets of the GradientStops from n to -1, it looks like the Color wanders across the Window. To do this in a loop, we need to put the first two Colors at the end of the gradient to start anew properly (see right figure).

XAML

This XAML animates the Background of a Grid:

<Grid >

    <!-- Set Background (this is similar to your TestBrush, only the Offsets will be set later) -->

    <Grid.Background>

        <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">

            <GradientStop Color="Red"/>

            <GradientStop Color="Blue"/>

            <GradientStop Color="Yellow"/>

        </LinearGradientBrush>

    </Grid.Background>

    <!-- Start Storyboard when Element is loaded -->

    <Grid.Triggers>

        <EventTrigger RoutedEvent="Grid.Loaded">

            <BeginStoryboard>

                <!-- Ensure the Storyboard is repeated forever -->

                <Storyboard RepeatBehavior="Forever">

                <!-- Set Offsets of the Colors and animate them to move slowly (Linear) or be set immediately (Discrete) -->

                    <!-- Red (needs to be placed at the 'end' of the gradientbrush for a neat loop -->

                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Background).(LinearGradientBrush.GradientStops)[0].(GradientStop.Offset)">

                        <DiscreteDoubleKeyFrame Value="0" KeyTime="00:00:00"/>

                        <LinearDoubleKeyFrame Value="-1" KeyTime="00:00:03"/>

                        <DiscreteDoubleKeyFrame Value="2" KeyTime="00:00:03"/> <!-- Move (jump) to end (n) when -1 is reached -->

                        <LinearDoubleKeyFrame Value="0" KeyTime="00:00:09"/>

                    </DoubleAnimationUsingKeyFrames>

                    <!-- Blue (needs to be placed at the 'end' of the gradientbrush for a neat loop -->

                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Background).(LinearGradientBrush.GradientStops)[1].(GradientStop.Offset)">

                        <DiscreteDoubleKeyFrame Value="1" KeyTime="00:00:00"/>

                        <LinearDoubleKeyFrame Value="-1" KeyTime="00:00:06"/>

                        <DiscreteDoubleKeyFrame Value="2" KeyTime="00:00:06"/> <!-- Move (jump) to end (n) when -1 is reached -->

                        <LinearDoubleKeyFrame Value="1" KeyTime="00:00:09"/>

                    </DoubleAnimationUsingKeyFrames>

                    <!-- Yellow (just moves through once) -->

                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Background).(LinearGradientBrush.GradientStops)[2].(GradientStop.Offset)">

                        <DiscreteDoubleKeyFrame Value="2" KeyTime="00:00:00"/>

                        <LinearDoubleKeyFrame Value="-1" KeyTime="00:00:09"/>

                    </DoubleAnimationUsingKeyFrames>

                </Storyboard>

            </BeginStoryboard>

        </EventTrigger>

    </Grid.Triggers>

</Grid>

In this example we have 3 Colors and every Color moves across the Gridin 3 Seconds