CODEWITHSUNDEEP
c#wpfanimation
edgarmtze
edgarmtze

Reputation: 25038

immediate translate animation in WPF in code behind

I want to make an animation that involves translating a circle _fixedCircle on x-axis from starting point (5,0) to end point (200,0) and then from (200,0) to (5,0) In a forever loop but not following a path, but "jumping", in other words, immediate translation from point to point.

To animate this circle doing a linear interpolation there is this:

Storyboard sb = new Storyboard();
DoubleAnimation anim = new DoubleAnimation();
sb.Children.Add(anim);
Storyboard.SetTarget(anim, _fixedCircle);
Storyboard.SetTargetProperty(anim, new PropertyPath("(Canvas.Left)"));
anim.From = 5;
anim.To = 200;
anim.RepeatBehavior = RepeatBehavior.Forever;
anim.AutoReverse = true;
MYCANVAS.Resources.Add("CIRCLE_ID", sb);
Duration duration = new Duration(TimeSpan.FromSeconds(2));
anim.Duration = duration;
anim.Begin();

But how to create "jumping" effect?

Upvotes: 0

Views: 1652

Answers (3)

Roel van Westerop
Roel van Westerop

Reputation: 1430

Try using a DoubleAnimationUsingKeyFrames, adding a DiscreteDoubleKeyFrame for each jump you want, e.g. (calculation of jump values has a lot of room for improvement ;)):

DoubleAnimationUsingKeyFrames anim = new DoubleAnimationUsingKeyFrames();

int maxNrOfJumps = 10;
for (int jump = 0; jump < maxNrOfJumps; jump++) {
    double value = ((200 - 5) / maxNrOfJumps) * jump;
    anim.KeyFrames.Add(new DiscreteDoubleKeyFrame(value, KeyTime.FromPercent(jump / (double)maxNrOfJumps)));
}

Discrete key frames like DiscreteDoubleKeyFrame create sudden "jumps" between values (no Interpolation). In other words, the animated property does not change until the key frame's key time is reached at which point the animated property goes suddenly to the target value.

https://msdn.microsoft.com/en-us/library/system.windows.media.animation.discretedoublekeyframe%28v=vs.110%29.aspx

Edit:

Running it can be done without a Storyboard, this is how I tested it:

_fixedCircle.BeginAnimation(Canvas.LeftProperty, anim);

Edit2:

You'd still need to set these properties to keep the animation running:

anim.RepeatBehavior = RepeatBehavior.Forever;
anim.AutoReverse = true;

Also, don't forget to set the Duration...

Upvotes: 3

Gino
Gino

Reputation: 176

Why not use skipToFill property? just add it to your storyboard.

Upvotes: 0

aloisdg
aloisdg

Reputation: 23511

immediate translation from point to point

Are you looking for a kind of instant teleportation from the first point to the last one ?

If so :

Storyboard sb = new Storyboard();
DoubleAnimation anim = new DoubleAnimation();
sb.Children.Add(anim);
Storyboard.SetTarget(anim, _fixedCircle);
Storyboard.SetTargetProperty(anim, new PropertyPath("(Canvas.Left)"));
anim.From = 5;
anim.To = 200;
// anim.RepeatBehavior = RepeatBehavior.Forever; // nope
anim.AutoReverse = false; // well
MYCANVAS.Resources.Add("CIRCLE_ID", sb);
Duration duration = new Duration(TimeSpan.FromSeconds(0)); // here we go
anim.Duration = duration;
anim.Begin();

Upvotes: 0

Related Questions