AS3 Tween class and pan effects

Question

I'm trying to make a "pan" effect (I'm not sure if this is pan) in flash (as3) where you have an image bigger than the mask where it is displayed (just horizontally). It´sa very simple effect, but I'm having trouble with the tweens.

First, I tried with the tween class. But it ended up a mess with the speed of the tween (the parameter where you set the frames or seconds of the tween). The "begin" parameter is easy, is the x value of the object, no matters where is it. The "end" parameter is easy too, is 0 or the end of the image, depending if you are on the left or right button (the tween begins when you are over those buttons and end with a stopTween when you are out of them or when the tween is over). The problem I'm facing it's the "duration" parameter: I want the same speed in all the tweens, no matters where it begins. Obviously, if I put a static value, if I'm in the middle of the image, the speed reduces to half.

So I'm trying to figure out how to create an algorithm to do this. I first tried something like calculating which percent of the image is the current "x" value:

If I am at 50%, make the tween in 50 frames.

If I am at 90%, make the tween in 10 frames.

If I am at 20%, make the tween in 80 frames.

But I think there should be a way to make it easier. Maybe I'm getting it wrong, and the tween class is not what I need... I'm just trying to make an displacement effect, always at the same speed (although an ease in and out until the speed is reached would be greater).

Any idea or useful link about this? I saw a lot of tutorials but with different behaviour, mostly related with mouse position.

thanks in advance!

Answer 1

你要：

duration = (end - begin) / pixels_per_ms

Answer 2

Why not use the ease property of a tween class? Take a look at http://www.greensock.com

There is a useful example widget you can experiment with on the TweenMax page.

Answer 3

The betterway to Achieve this effect is to measure speed/over/distance this formula will be easier and a lot less code.Doing it this way you wouldnt need any tween library's.

 var MaskCenter=100;
 var speed=1/10;
 var distance=boxdummy.mouseX-MaskCenter;


if(mouseX<250){
box.x-=(distance*speed);
}
if (mouseX>250)
{
 box.x -= speed + accel;
}

Something like that!

If you cant work it, let me know i will make up a (fla) file for you