Bugshake

I recently needed a tween that is different from the ones you see on the cheat sheet. All tweens you’ll find there have the property that the movement hardly goes outside the bounds of begin-to-endpoint (0…1). What I needed, was a tween that swings completely beyond its target, almost as far as the begin point (0…-1…1).

So what you do is use a custom function, here’s how:

Tweener.addTween(mc,
   {rotation: 100, time:1, transition:myFunc});

The tweener documentation will tell you this function needs 4 params, it actually needs 5, like this:

var easeOutSwing:Function = function(
      t:Number, b:Number, c:Number, d:Number,
      p_params:Object = null):Number
   {
      ...
   };

Where

• t = time from 0…1
• b = begin value
• c = change to value (delta)
• d = total duration (ms)
• not used

To make one yourself, you can use the tool the tweener documentation suggests, the easing generator. A quintic bezier is not the only option, but its handy for most purposes I imagine.

For my purpose i entered the values 7, -9, 7 and -.17 for P1,2,3,4, resulting in a function like this (with extra param):

var myFunc:Function = function(
      t:Number, b:Number, c:Number, d:Number,
      p_params:Object = null):Number
   {
      var ts:Number=(t/=d)*t;
      var tc:Number=ts*t;
      return b+c*(175.7*tc*ts + -499.7*ts*ts + 510*tc + -220*ts + 35*t);
   };

Tags: actionscript, tutorial, tweener

This entry was posted on Tuesday, August 18th, 2009 at 12:40 pm and is filed under Programming. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.