Ease of Motion, Programming Tweening, c++

955 views Asked by At

Tweening is a video editing term used to describe ease of motion. For example, with an elevator the lift does not go full speed and dead stop when it reaches it's desired floor. It knows what floor its on, what floor it is going to, and how long it will take to get there. Then it uses that data to smooth its motion.

I would like to be able to program this smooth motion for my projects by using tweening.

The method for how to do this is layed out in http://robertpenner.com/easing/penner_chapter7_tweening.pdf

Specifically looking at pg207-211

This guide explains what tweening is and then shows code in Action Script. To be honest I feel kind of stupid becuase I've tried to use the examples provided but I can't seem to replicate it in another language such as c++, java, javascript, or lua.

I do not wish to use a package or plugin to code tweening, I want to learn how to actually code a tweening function. So if anyone with better comprehension skills, or programming skills, thinks they understand then I would very much appreciate an explanation.

Sample Action script functions...

Math.easeInQuad = function (t, b, c, d) {
    return c*(t/=d)*t + b;
};

Math.easeOutQuad = function (t, b, c, d) {
    return -c * (t/=d)*(t-2) + b;
};

Math.easeInOutQuad = function (t, b, c, d) {
    if ((t/=d/2) < 1) 
        return c/2*t*t + b;
    return -c/2 * ((--t)*(t-2) - 1) + b;
};
1

There are 1 answers

0
Vesper On BEST ANSWER

A proper tweening function in AS3 accepts 6 parameters of Number with last two parameters defaulting at 0. It should interpret the parameters as follows:

  • First parameter is the primary, it's filled with a value from 0 to tween duration;
  • Second parameter is the value of the parameter you try to tween when first parameter is zero;
  • Third parameter is the size of the interval of values the tweening parameter is expected to be assigned;
  • Fourth parameter is the duration in whatever units the user would supply, hence a Number and not an int;
  • Fifth and sixth parameters are optional and are not used in the AS3 built-in tweening library, but they can be used to modify the interpolation that's done inside the function if it's customly used elsewhere.

The expected result is a value between second and (second+third) parameters, or with their canonical names of t, b, c, d, a, p between b and b+c.

You can plot a function's graph using a simple algorithm like this:

function graph(f:Function,w:Number,h:Number):Shape {
    // returns a shape with black on white graph drawn within a rectangle of given dimensions
    var s:Shape=new Shape();
    s.graphics.lineStyle(0); // black
    s.graphics.moveTo(0,h); // lower left corner
    for (var i:int=0;i<w;i++) {
         s.graphics.lineTo(i,f(i,h,-1*h,w));
    }
    return s;
}

Speaking of C++, for example an easeInQuad should be programmed like this (if I didn't mess up C++ syntax):

double easeInQuad(double t, double b, double c, double d) {
    double td=t/d;
    return b+c*td*td;
}