Animation without XAML

Question

I'm creating Paths (Shapes) at run time and I want to animate their fill color.  In XAML I see it would be this:
Storyboard.TargetProperty="Fill.Color"

But how do I do this with C#?

The closest I have gotten with my color animation is:
ca.SetValue(Storyboard.TargetPropertyProperty,
                        new PropertyPath(Path.FillProperty));
but that's a brush. 

Answer 1

This should show you how to animate without using any xaml for the storyboard:
http://msdn.microsoft.com/en-us/library/system.windows.media.animation.coloranimation.aspx


Here I just created a very simple example taken from the msdn's more extensive examples.

1	<Window x:Class="ItemsControlMSDN.Window1"
2	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
3	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
4	Title="Window1" Height="500" Width="500">
5	<Grid>
6	<Canvas>
7	<Polygon Points="300,200 400,125 400,275 300,200" Stroke="Purple" StrokeThickness="2" x:Name="poly">
8	</Polygon>
9	</Canvas>
10	</Grid>
11	</Window>

1	using System;
2	using System.Windows;
3	using System.Windows.Media;
4	using System.Windows.Media.Animation;
5
6	namespace ItemsControlMSDN
7	{
8	/// <summary>
9	/// Interaction logic for Window1.xaml
10	/// </summary>
11	public partial class Window1 : Window
12	{
13	public Window1()
14	{
15	InitializeComponent();
16	SolidColorBrush brush = new SolidColorBrush();
17	brush.Color = Colors.Red;
18	poly.Fill = brush;
19
20	this.RegisterName("AnimatedBrush", brush);
21	ColorAnimation loopAnimation = new ColorAnimation();
22	loopAnimation.To = Colors.Green;
23	loopAnimation.Duration = TimeSpan.FromSeconds(5);
24	loopAnimation.AutoReverse = true;
25
26
27	Storyboard.SetTargetName(loopAnimation,  "AnimatedBrush");
28	Storyboard.SetTargetProperty(loopAnimation, new PropertyPath(SolidColorBrush.ColorProperty));
29
30	Storyboard sboard = new Storyboard();
31	sboard.Children.Add(loopAnimation);
32	sboard.Begin(this);
33
34	}
35	}
36	}

---

This posting is provided "AS IS" with no warranties, and confers no rights.

Answer 2

Ah I think I got it:

PropertyPathConverter ppc;
ppc = new PropertyPathConverter();
ca.SetValue( Storyboard.TargetPropertyProperty,
   ppc.ConvertFromString("(Path.Fill).(SolidColorBrush.Color)"));

It runs and I see animation.  It's not what I expect but that's the next issue for me. 

Answer 3

I have a canvas that I'm adding paths to at run time.  So only the canvas is defined in XAML.  It looks like the animation is changing the fill of the canvas instead of the fill of the polygons. 

I want the animation of all of the paths in one storyboard so their animations occur at the same time.  I'm looking at this sample from the book for an idea of how to do it. 
http://www.charlespetzold.com/blog/2006/04/220232.html
Where he's animating multiple points at once. 

Here's my code if I cut out the pertinent pieces:

//in the class are these two:

Storyboard ZoneStoryboard;

static int ZoneNumber = 1;

//in a function I do something like this:

ZoneStoryboard =  new System.Windows.Media.Animation.Storyboard();

ZoneStoryboard.FillBehavior = FillBehavior.HoldEnd;

ZoneStoryboard.SetValue(Storyboard.TargetNameProperty, "ZoneCanvas");

//ZoneCanvas is the name of my canvas

ZoneStoryboard.Duration = new Duration(new TimeSpan(0, 0, 0, 0, 800));

for each path to add

{

Path pth = new Path();

//setup path taken out

pth.Name = "Zone" + ZoneNumber.ToString();

ZoneCanvas.RegisterName(pth.Name, pth);

ZoneNumber++;

ColorAnimation ca = new ColorAnimation();

ca.SetValue(Storyboard.TargetNameProperty, pth.Name);

PropertyPathConverter ppc;

ppc = new PropertyPathConverter();

ca.SetValue( Storyboard.TargetPropertyProperty,

ppc.ConvertFromString("(Path.Fill).(SolidColorBrush.Color)"));

ZoneStoryboard.Children.Add(ca);

}

later in another function

for each path

{

//set the To color for each color animation that goes with the path

}

ZoneStoryboard.Begin(ZoneCanvas);

Answer 4

I'm just stumped with this one.  I thought the animation was affecting the canvas.  Nope it's affecting more than that.  This canvas is in my UserControl.  And the animation is even affecting things outside of the user control!  I've even moved my Storyboard to XAML using a trigger in the canvas but still it affects everything.  The animations are still created at run time and added to the storyboard. 

Answer 5

I think the piece of the picture that I was missing was the brush itself.  before delving into animation I had profiled the program for memory use and found I was using many many many brushes.  So since I use a set of colors I used one brush for each color and reused the brush.  See where I'm going now. :)   So since I'm animating the brush I'm animating anywhere it's used.  So it looks like it's back to using a ton of brushes.  Ugh!