Getting Started

Re: Creating a storyboard from c# not working ...

kakoskin — Thu, 10 Jul 2008 15:18:09 GMT

I was able to animate Line using the help provided the thread starter.

Here's some sample code:

private Storyboard AddLineAnimation(Line line) {Storyboard sb = new Storyboard();

// Create a DoubleAnimation to animate the width of the button.

DoubleAnimation myDoubleAnimation = new DoubleAnimation();

myDoubleAnimation.From = line.X1;

myDoubleAnimation.To = line.X2;

myDoubleAnimation.Duration = new Duration(TimeSpan.FromMilliseconds(500));DoubleAnimation myDoubleAnimation2 = new DoubleAnimation();

myDoubleAnimation2.From = line.Y1;

myDoubleAnimation2.To = line.Y2;

myDoubleAnimation2.Duration = new Duration(TimeSpan.FromMilliseconds(500));

// Configure the animation to target the button's Width property.

Storyboard.SetTarget(myDoubleAnimation,line); Storyboard.SetTargetProperty(myDoubleAnimation, new PropertyPath("(UIElement.X2)", new object[0]));

sb.Children.Add(myDoubleAnimation);

Storyboard.SetTarget(myDoubleAnimation2, line);Storyboard.SetTargetProperty(myDoubleAnimation2, new PropertyPath("(UIElement.Y2)", new object[0]));

sb.Children.Add(myDoubleAnimation2);

return sb;

}

Re: Creating a storyboard from c# not working ...

BlueAquarius — Tue, 01 Jul 2008 14:42:57 GMT

Ibrahim,

one additional comment to my previous response: I suggest to convert the method-level valiable 'storyboard' into a class-level valiable. Once your method execution is completed, all method-level variables will be recycled. I assume that this is true for the storyboard as well.

BlueAquarius

Re: Creating a storyboard from c# not working ...

sladapter — Tue, 01 Jul 2008 13:55:41 GMT

I don't what you are trying to do. You have a line object, you want to animate the Width of the line?

Width/Height in line does no have any meaning. If you want animate the action of drawing a line you need to set the animation target to the line end position which is (X2, Y2).

Or if you want to change width of the line you need to set the target to the StrokeThickness not the Width property.

By the way, if your "surface" canvas has white background, you need to set the line stroke color to something else than white (you have Color = Colors.White;)

If you take off those two lines, and make sure your the line stroke color is different than the background color of your canvas, the line should appear.

horline1.Width = 150;
horline1.Height = 1;

Re: Creating a storyboard from c# not working ...

BlueAquarius — Tue, 01 Jul 2008 13:40:30 GMT

Ibrahim,

I hope this helps:

private void DrawLine(double x1, double x2, double y1, double y2)

{

Line horline1 = new Line();

//horline1.Width = 150;

//horline1.Height = 1;

horline1.X1 = x1;

horline1.X2 = x2;

horline1.Y1 = y1;

horline1.Y2 = y2;

SolidColorBrush stroke = new SolidColorBrush();stroke.Color = Colors.White;

horline1.Stroke = stroke;

horline1.StrokeThickness = 1;

//surface is my convas name

surface.Children.Add(horline1);

Duration duration = new Duration(TimeSpan.FromSeconds(10));DoubleAnimation doubleAnimation = new DoubleAnimation();

doubleAnimation.From = 10;

doubleAnimation.To = 100;

doubleAnimation.RepeatBehavior = RepeatBehavior.Forever;doubleAnimation.AutoReverse = true;

doubleAnimation.Duration = duration;

Storyboard.SetTarget(doubleAnimation, horline1);

Storyboard.SetTargetProperty(doubleAnimation, new PropertyPath("(Line.X2)"));Storyboard storyboard = new Storyboard();

storyboard.Duration = duration;

storyboard.RepeatBehavior = RepeatBehavior.Forever;

storyboard.AutoReverse = true;

storyboard.Children.Add(doubleAnimation);

storyboard.Begin();

}

Re: Creating a storyboard from c# not working ...

ibrahimCool — Tue, 01 Jul 2008 11:47:59 GMT

Hi, My name is Ibrahim working as SE in Hyd,India. Well I am new to Silverlight

I have created a line dynamically on canvas with position (x1,x2,y1,y2)=(80,230,50,50). and added to the canvas successfully at runtime.

i have written the code for animating a Line which was created dynamically. I want to deacrease/increase width From 10 To 100. For this Scenario I have written the Code

as shown below.

private void DrawLine(double x1,double x2,double y1,double y2)
        {
            Line horline1 = new Line();
            horline1.Width = 150;
            horline1.Height = 1;
            horline1.X1 = x1;
            horline1.X2 = x2;
            horline1.Y1 = y1;
            horline1.Y2 = y2;
            SolidColorBrush stroke = new SolidColorBrush();
            stroke.Color = Colors.White;
            horline1.Stroke = stroke;
            horline1.StrokeThickness = 1;
            //surface is my convas name
            surface.Children.Add(horline1);
            Duration duration = new Duration(TimeSpan.FromSeconds(10));
            DoubleAnimation doubleAnimation = new DoubleAnimation();
            doubleAnimation.From = 10;
            doubleAnimation.To = 100;
            doubleAnimation.RepeatBehavior = RepeatBehavior.Forever;
            doubleAnimation.AutoReverse = true;
            doubleAnimation.Duration = duration;
            Line line = new Line();
            Storyboard.SetTarget(doubleAnimation, horline1);//if i created this line as Storyboard.SetTarget(doubleAnimation, new Line()); then line appears
            //but not animating...
            //Storyboard.SetTargetProperty(doubleAnimation, new PropertyPath("(horline1.Width)"));

            Storyboard.SetTargetProperty(doubleAnimation, new PropertyPath("Width"));
           Storyboard storyboard = new Storyboard();
            storyboard.Duration = duration;
            storyboard.RepeatBehavior = RepeatBehavior.Forever;
            storyboard.AutoReverse = true;
            storyboard.Children.Add(doubleAnimation);
            storyboard.Begin();
        }

After i call this method in my surface_loaded(canvas loaded) what i see is the line is not appearing.

any help will be appretiated...

Thanks in Advance

Ibrahim.

Re: Creating a storyboard from c# not working ...

Wolf Schmidt (MSFT) — Mon, 16 Jun 2008 22:44:14 GMT

The sublety is the "params" keyword that lets this syntax work without explicitly setting the second parameter, and yeah the docs did miss that. (In fact, the stuff that suggests setting explicit to null will get you into trouble.) Sorry ... will fix the doc for RTM.

Re: Creating a storyboard from c# not working ...

sladapter — Mon, 16 Jun 2008 14:16:51 GMT

Storyboard.SetTargetProperty(timeline, new PropertyPath("(Canvas.Left)")) is correct syntax in SL 2 beta 2. The documentation probably missed that.

Re: Creating a storyboard from c# not working ...

BlueAquarius — Mon, 16 Jun 2008 12:40:53 GMT

Jim Mangaly,

interestingly, the "breaking changes" page which you are referring to suggests the following line of code for Silverlight 2.0 Beta 2:

Storyboard.SetTargetProperty(timeline, new PropertyPath("(Canvas.Left)"));

I believe that this is incorrect, too. I do not think that there is a contructor for PropertyPath which takes one argument. See http://msdn.microsoft.com/en-us/library/ms587924(VS.95).aspx

Re: Creating a storyboard from c# not working ...

Jim Mangaly — Mon, 16 Jun 2008 04:45:06 GMT

BlueAquarius:
After some more try-and-error, I finally found the above solution.

Well, this was documented in the breaking changes doc: http://msdn.microsoft.com/en-us/library/cc645049(VS.95).aspx#SetTargetProperty_and_GetTargetProperty

Jim (http://jimmangaly.blogspot.com/)

Please MARK the replies as answers if they answered your question

Re: Re: Creating a storyboard from c# not working ...

SteveWong — Mon, 16 Jun 2008 04:39:14 GMT

And also by the release of Beta 2, there are breaking changes between Beta 1 and Beta 2

The SetTargetProperty and GetTargetProperty Changes have included in the documentation.

Re: Creating a storyboard from c# not working ...

SteveWong — Mon, 16 Jun 2008 04:37:36 GMT

Sorry for my mistake

It should be something like this

Creating a new Storyboard should be like this

                    Storyboard Reflection_Story1 = new Storyboard();
                    DoubleAnimation Reflection_fades = new DoubleAnimation();
                    Reflection_fades.From = 100;
                    Reflection_fades.To = 300;
                    Reflection_fades.RepeatBehavior = RepeatBehavior.Forever;
                    Reflection_fades.Duration = new Duration(TimeSpan.Parse("0:0:1"));
                    Storyboard.SetTarget(Reflection_fades, LayoutRoot);
                    Storyboard.SetTargetProperty(Reflection_fades, new PropertyPath("(LayoutRoot.Width)"));
                    Reflection_Story1.Children.Add(Reflection_fades);
                    LayoutRoot.Resources.Add(Reflection_Story1);
                    Reflection_Story1.Begin();

Please make sure you have the width in your LayoutRoot
It doesnt require you to set the null for it

Re: Creating a storyboard from c# not working ...

BlueAquarius — Mon, 16 Jun 2008 01:30:41 GMT

Steve,

your approach is identical to my approach with the only exception of the following line:

Storyboard.SetTargetProperty(Reflection_fades, new Property("(LayoutRoot.Width)"));

You use Property, I use PropertyPath. The class Property does not seem to exist in Silverlight 2.0 Beta 2; or atleast I am not able to find it.

Regards

Andreas

Re: Creating a storyboard from c# not working ...

SteveWong — Sun, 15 Jun 2008 23:22:04 GMT

Creating a new Storyboard should be like this

                    Storyboard Reflection_Story1 = new Storyboard();
                    DoubleAnimation Reflection_fades = new DoubleAnimation();
                    Reflection_fades.From = 100;
                    Reflection_fades.To = 300;
                    Reflection_fades.RepeatBehavior = RepeatBehavior.Forever;
                    Reflection_fades.Duration = new Duration(TimeSpan.Parse("0:0:1"));
                    Storyboard.SetTarget(Reflection_fades, LayoutRoot);
                    Storyboard.SetTargetProperty(Reflection_fades, new Property("(LayoutRoot.Width)"));
                    Reflection_Story1.Children.Add(Reflection_fades);
                    LayoutRoot.Resources.Add(Reflection_Story1);
                    Reflection_Story1.Begin();

Please make sure you have the width in your LayoutRoot

Creating a storyboard from c# not working ...

BlueAquarius — Sun, 15 Jun 2008 22:20:51 GMT

Hi there.

I just spent several hours figuring out how to make a simple Storyboard work in C# (using Silverlight 2.0 Beta 2). I want to share my experience here, as some other folks may encounter the same problems. Drop me a line if you find this useful.

For those of you who are impatient (that's probably most of us), here is the solution which DOES work well:

using System;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Media.Animation;

namespace POCSilverlight2Animation

{

public partial class Page : UserControl

{

Storyboard storyboard;
TextBlock debugMessage;
public Page()
{

InitializeComponent();

// Create a text box for debug messages
debugMessage = new TextBlock();
debugMessage.FontSize = 9;
((Grid)Content).Children.Add(debugMessage);try
{
    Duration d = new Duration(TimeSpan.FromSeconds(1));

    DoubleAnimation doubleAnimation = new DoubleAnimation();
    doubleAnimation.From = 100;
    doubleAnimation.To = 300;
    doubleAnimation.RepeatBehavior = RepeatBehavior.Forever;
    doubleAnimation.AutoReverse = true;
    doubleAnimation.Duration = d;

    Storyboard.SetTarget(doubleAnimation, LayoutRoot);
    Storyboard.SetTargetProperty(doubleAnimation, new PropertyPath("(UIElement.Width)", new object[0]));

    storyboard = new Storyboard();
    storyboard.Duration = d;
    storyboard.RepeatBehavior = RepeatBehavior.Forever;
    storyboard.AutoReverse = true;
    storyboard.Children.Add(doubleAnimation);
    storyboard.Begin();
}
catch (Exception ex)
{

debugMessage.Text = ex.Message + "\n" + ex.StackTrace;

}

}

}

}

Where I had trouble was the line where I set the TargetProperty. The documentation on the Microsoft Website seems to be a bit outdated and maybe a bit inaccurate. For example, at http://msdn.microsoft.com/en-us/library/cc190707(VS.95).aspx, it was suggested not to create a new PropertyPath, but to simply use a String instead. I assume that this worked fine for an older version of Silverlight.

Storyboard.SetTargetProperty(doubleAnimation, "(UIElement.Width)"); DOES NOT WORK

Next, I found this article: http://msdn.microsoft.com/en-us/library/ms587924(VS.95).aspx. Hereis was suggested: "Always use the path parameter to specify a path string as documented in the topic Property Path Syntax (Silverlight 2.0), and always leave pathParameters as nullNothingnullptra null reference (Nothing in Visual Basic)." So, I thought that the following line should work (bu it does not work):

Storyboard.SetTargetProperty(doubleAnimation, new PropertyPath("(UIElement.Width)", null)); DOES NOT WORK

After some more try-and-error, I finally found the above solution.