GTween Tweening and Animation Library for ActionScript 3

+ Latest.

Feb 2, 2009: GTween beta 5 has been released. GTween beta 5 is a major rewrite of the full library. It adds GTweeny (a 3kb version of the library), and GTweenTimeline (a powerful virtual timeline). It also incorporates a lot of API modifications.

+ About.

• GTween (4.5kb). A robust tweening engine, packed full of innovative features.
• GTweenTimeline (1kb). A powerful virtual timeline that extends GTween to enable you to sequence tweens and actions.
• GTweenFilter (0.5kb). An extension to GTween for tweening filters.
• GTweeny (3kb). The ultra light-weight little sibling to GTween. Trades some features for smaller file size

+ Features.

Developer Oriented

gTween is built for ActionScript 3 developers from the ground up. It uses a more conventional instance-oriented model, rather than a static interface. It also leverages the AS3 event model instead of callbacks for init, change, and complete events. This provides a familiar, consistent experience for AS3 developers.

Flexible

gTween works with any numeric property of any object. You can use it to tween the volume of a sound, the size of an AIR window, 3D properties in PaperVision or Flash player 10, or the value of "foo" on a custom object type, as easily as you would tween the x property of a Sprite.

You can set up a tween in a single line of code, or stick to using strictly typed properties. You can maintain references to your tweens, or create them and forget them - gTween intelligently manages tweens to prevent them from being garbage collected while they are active.

// unreferenced tween, in one line:
new GTween(myTarget, 2, {x:50, alpha:1}, {ease:Sine.easeInOut});

// referenced tween, typed properties:
var myTween:GTween = new GTween(myTarget, 2);
myTween.setProperty("x",50);
myTween.setProperty("alpha",1);
myTween.ease = Sine.easeInOut;

// you can also do referenced tweens in one line.

Proxy

gTween provides a unique proxy property that allows you to work with tween destination values the same way you would work with them on the target object. The proxy object effectively "stands in" for your target object.

This simple example shows how you can use the proxy to tween the target object 100 pixels to the right of its current position.

myTween.proxy.x += 100;

Sequencing

gTweenTimeline lets you set up complex animations or transitions on a virtual timeline. In addition to tweens, you can add actions and labels at specified positions. Pause, reverse, and jump to the start or end of the full timeline as easily as you would with a single tween. You can even nest timelines in each other, just like you can do on the Flash timeline.

gTween even lets you synchronize frame based animations to time based programmatic tweens. Even if you pause the tween, or change the framerate, your awesome animated effects will stay perfectly timed.

var myTween:GTween = new GTween(myTarget, 2, {x:50, alpha:1}, {ease:Sine.easeInOut});
myTimeline.addTween(1, myTween);
myTimeline.addCallback(3, myCallback, [param1, param2]);

Interrupt

Modify your tween while it is playing, and it will attempt to accommodate those changes.

Control

gTween offers an unprecedented level of control over your tweens. You can pause one or all tweens. You can specify how many times a tween repeats, and whether it should reflect on each repeat (play backwards). You can jump to any position in your tween at any time. You even have full read/write access to all start and end property values.

Timing

gTween supports 3 timing modes. FRAME based uses enterframe for updates, and lets you specify all positions in frames. TIME uses a configurable interval and uses seconds for positions. HYBRID updates on enterframe, but all calculations and position values are in seconds.

Etcetera

Here's a quick list of a few more features you might find interesting:

• autoVisible sets visible to false when the tweened alpha is 0.
• autoRotate rotates in shortest direction (even in 3D).
• support for updating properties like matrix and colorTransform automatically during a tween.
• simple sequencing with nextTween.
• delay the start of your tween with the delay property.
• determine the state of a tween with the state and paused properties.
• snapping makes a tween round specific properties before setting them on the target.
• associate arbitrary data with your tween (handy for storing temporary transition related values).
• reverse your tween without affecting its values.
• calculate the optimal duration for a timeline based on the tweens and callbacks in it.
• change event fires every update when the tween changes properties.

The best place to learn about these and other features is by checking out the included demos, and flipping through the API documentation.

+ Demos.

+ Download.

+ Feedback.