Question

Not sure how to explain this, so I’ll first post some code and then try to explain. The solution should be simple though, so I’m sure you guys know what I’m trying to do here..

public function tweenUpdate():void{
            if (_currentFrame>=358) _currentFrame -= 359;
            if (_currentFrame<0) _currentFrame += 359;
            var myBitmap:Bitmap = new Bitmap(buffer[_currentFrame+1]);
            myBitmap.smoothing = true;
            imageBuffer.data = myBitmap;
        }

And this is what triggers it:

TweenLite.to(this, 2, {_currentFrame: 50, ease:Strong.easeOut, onUpdate:tweenUpdate, onComplete:tweenComplete});

So, I’ve got 360 images (but I’m using the _currentFrame to determine which image to show. so we’ll look at _currentImage:int).

I want to tween from my current frame my target frame. This is what my code does now (thanks to shanethehat for helping me out so far).

BUT, I want to tween the shortest way around!

Example:
I’m at frame 10, and I want to go to frame 350..
Instead of going from 10-350 (skipping through 340 frames) I’d like to go the other way around, from 10 to 350 (skipping down to frame 0 and continue to skip from 359 down to 350).

I hope you get what I’m trying to say here 😛

Answer 1

Here’s one solution, although I’m not sure it’s the best one. I tested this only lightly using a 100 frame MovieClip, so I hope it works when applied to your buffer setup.

import com.greensock.TweenLite;
import com.greensock.easing.Strong;

var _currentFrame:int = 1;

function tweenTo($target:int):void
{
    if(_currentFrame - $target > buffer.length - _currentFrame + $target) {
        //quicker to loop from buffer.length to 0
        _currentFrame = $target - (buffer.length - _currentFrame + $target);
    } else if (buffer.length - $target + _currentFrame < $target - _currentFrame) {
        //quicker to loop from 0 to buffer.length
        _currentFrame = $target + (buffer.length - $target + _currentFrame);
    }
    TweenLite.to(this,2,{_currentFrame:$target,ease:Strong.easeOut,onUpdate:tweenUpdate});
}

function  tweenUpdate():void
{
    var myBitmap:Bitmap;
    if(_currentFrame < 1) {
        myBitmap = new Bitmap(buffer[buffer.length + _currentFrame]);  //_currentFrame is negative
    } else {
        myBitmap = new Bitmap(buffer[_currentFrame % buffer.length]);
    }
    myBitmap.smoothing = true;
    imageBuffer.data = myBitmap;
}

You start the tween each time by calling the tweenTo method. This checks if a shorter route to the target exists by jumping between the start and end points rather than just moving as the tween would do naturally. If it is going to be quicker, then the initial value for _currentFrame is changed.

In the tweenUpdate method the new bitmap is created by choosing either a value that is a certain number from the end of the buffer, or uses modulus to ensure values higher than the buffer length are recalculated.