Continuous rotation in either direction

[tlpann 0 Likes (Newbie)]

Hello,

 

I have tried and failed to figure out how to do this: I have an arrow (Sprite) that I want to rotate right continuously when I press the right arrow, and likewise left for the left arrow, and stop when I release the key.

 

Here is my code:

private var arrowRight:TweenMax;
private var arrowLeft:TweenMax;

// ...

arrowRight = new TweenMax(arrow, 3, {rotation:360, repeat:-1, ease:Linear.easeNone, paused:true});
arrowLeft = new TweenMax(arrow, 3, {rotation:-360, repeat:-1, ease:Linear.easeNone, paused:true});

stage.addEventListener(KeyboardEvent.KEY_DOWN, keyPressed);
stage.addEventListener(KeyboardEvent.KEY_UP, keyReleased);

private function keyPressed(k:KeyboardEvent):void {
	if (k.keyCode == 39) {
		arrowRight.play();
	} else if (k.keyCode == 37) {
		arrowLeft.play();
	}
}
private function keyReleased(k:KeyboardEvent):void {
	if (k.keyCode == 39) {
		arrowRight.pause();
	} else if (k.keyCode == 37) {
		arrowLeft.pause();
	}
}

The problem with this (as you probably would guess) is that if I first press RIGHT, then when I release and press LEFT, the arrow rotates left until it gets to rotation=0, then jumps to the rotation value that it was at when I released RIGHT. If I hold LEFT down, it does the jump every time it hits rotation=0.

 

How do I fix this so that rotation starts and continues seamlessly in either direction?

 

Thanks!

Tim

[tlpann 0 Likes (Newbie)]

P.S. I considered using a single tween and just reversing it, but it stops when it gets to 0. If it's better to use reverse() then I would love advice about how to make it continue beyond 0.

[Carl 9,066 Likes (Superhero)]

You're on the right path and I think this can be a fairly simple solution. 

 

Create a tween that repeats infinitely with a Linear ease.

 

As soon as it is created jump it's total progress 10 hours ahead just to make sure that you will never hit 0 when reversed.

myTween.time(36000).pause()

then your buttons can just play() and reverse() as planned.

[tlpann 0 Likes (Newbie)]

This allows exactly one additional rotation in the left direction. Then it stops again.

 

I changed it to myTween.time(3600000).pause() and have the same outcome.

[Carl 9,066 Likes (Superhero)]

Hmm. Please post a simple Fla and I will take a look.

Zip it and attach via the "more reply options" button.

Be sure yor tween is a TweenMax tween.

[tlpann 0 Likes (Newbie)]

Here is the .fla file. Thank you!

gsap_forum_example.zip

[Carl 9,066 Likes (Superhero)]

Thanks for the file. My mistake it should have been totalTime()

 

please try

 

import com.greensock.*;
import com.greensock.easing.*;


stage.addEventListener(KeyboardEvent.KEY_DOWN, keyPressed);
stage.addEventListener(KeyboardEvent.KEY_UP, keyReleased);


var myTween:TweenMax = TweenMax.to(arrow, 1, {rotation:360, repeat:-1, ease:Linear.easeNone});
myTween.totalTime(360000).pause();




trace(myTween.totalTime()); 


//left and right arrows




function keyPressed(k:KeyboardEvent):void {
if (k.keyCode == 39) {
myTween.play();
} else if (k.keyCode == 37) {
myTween.reverse();
}
}
function keyReleased(k:KeyboardEvent):void {
myTween.pause();
}

[tlpann 0 Likes (Newbie)]

That works! Thank you!