What if you could take the existing text in a TextField and dynamically break it apart into individual TextFields for each character, word, or line so that you could animate them separately? Maybe your goal is to explode the characters apart or have words fall into place while fading in or blur sequentially. There are lots of great tools out there for creating interesting text effects but maybe you don’t want an all-in-one solution with a new interface or API to learn. Maybe you’re comfortable with the GreenSock Tweening Platform and you want to control all the animation yourself and minimize file size. That was the idea behind SplitTextField. It isn’t meant to be a text effects engine – it simply breaks apart a TextField instance and swaps itself (a Sprite) into place where the original TextField was in the display list, retaining the same scale/position/rotation so things appear relatively seamless. The SplitTextField has a “textFields” property which is an Array containing all the child TextFields it created (one for each character, word, or line based on the splitType property). Then you can animate to your heart’s content.
RoughEase and Ease Visualizer
Ever wanted a more “gritty” transition like an alpha fade that flickers a bit or a position tween that jerks around before reaching its destination? Ever thought to yourself “smooth eases are for sissies”? If so, you’re gonna like RoughEase. You can define an ease that it will use as a template (like a general guide – Linear.easeNone is the default) and then it will randomly plot points that wander from that template. The strength parameter controls how far from the template ease the points are allowed to go (a small number like 0.1 keeps it very close to the template ease whereas a larger number like 2 creates much larger jumps). You can also control the number of points in the ease, making it jerk more or less frequently. And lastly, you can associate a name with each RoughEase instance and retrieve it later like RoughEase.byName(“myEaseName”). RoughEase is included in all the tweening platform downloads and is available in AS2 and AS3.
Video Lesson: TimelineLite/Max Basics
If you’re familiar with TweenLite and/or TweenMax but haven’t tried the new TimelineLite or TimelineMax classes yet, don’t missing out. They make sequencing and managing groups of tweens fun. Get acquainted with the basics by watching this 16 minute video:
Getting Started Tweening
This article will help you get up and running with the GreenSock Tweening Platform. It covers installation, importing, basic tweening, special properties, plugins, choosing which engine to use (TweenLite/Max/Nano), sequencing with TimelineLite, and some tips and tricks. If your new to the GreenSock Tweening Platform, this is the place to start.
TweenNano – 1.6k TweenLite with Some Sacrifices
TweenNano is a super-lightweight (1.6k in AS3 and 2k in AS2) version of TweenLite and is only recommended for situations where you absolutely cannot afford the extra 3.1k (4.7k total) that the normal TweenLite engine would cost and your project doesn’t require any plugins. Normally, it is much better to use TweenLite because of the additional flexibility it provides via plugins and its compatibility with TimelineLite and TimelineMax.
TimelineMax – Sequence/Group Multiple Tweens, Control Them as a Whole
TimelineMax extends TimelineLite, offering exactly the same functionality plus useful (but non-essential) features like AS3 event dispatching, repeat, repeatDelay, yoyo, currentLabel, addCallback(), removeCallback(), tweenTo(), tweenFromTo(), getLabelAfter(), getLabelBefore(), and getActive() (and probably more in the future). It is the ultimate sequencing tool. Think of a TimelineMax instance like a virtual MovieClip timeline or a container where you position tweens (or other timelines) over the course of time.
TimelineLite – Sequence/Group Multiple Tweens, Control Them as a Whole
TimelineLite is a lightweight, intuitive timeline class for building and managing sequences of TweenLite, TweenMax, TimelineLite, and/or TimelineMax instances. You can think of a TimelineLite instance like a virtual MovieClip timeline or a container where you place tweens (or other timelines) over the course of time.
OverwriteManager – control how (and if and when) tweens get overwritten
OverwriteManager resolves conflicts between tweens and controls if (and how) existing tweens of the same target are overwritten. Think of it as a referee or traffic cop for tweens. For example, let’s say you have a button with ROLL_OVER and ROLL_OUT handlers that tween an object’s alpha and the user rolls their mouse over/out/over/out quickly. Most likely, you’d want each new tween to overwrite the other immediately so that you don’t end up with multiple tweens vying for control of the alpha property. That describes the ALL_IMMEDIATE mode which is the default mode of TweenLite when it is not used in conjunction with TweenMax, TimelineLite, or TimelineMax. This keeps things small and fast. However, it isn’t ideal for setting up sequences because as soon as you create subsequent tweens of the same target in the sequence, the previous one gets overwritten.
Custom Ease Builder – Easing Made Easy
Sometimes the standard easing equations (Elastic, Strong, etc.) don’t give you quite what you want. This tool allows you to interactively draw a curve for your own custom easing equation and it even writes the code for you. Just copy and paste it into your AS3 or AS2 application. The code it writes requires the gs.easing.CustomEase class which is a membership benefit of Club GreenSock.
Utilities for Code Hinting and Strict Typing in TweenLite/Filter/Max
I created some AS3 utility classes that can (optionally) be used with TweenLite or TweenMax that address two requests:
- Code hinting – Sometimes it’s hard to remember all the special properties that are available in the tweening classes, so code hinting would be very useful. In most decent code editors like Flex Builder, FDT, etc. (NOT the Flash Authoring tool), these classes will trigger code hinting (see screen capture below).
- Strict datatyping – Some developers are extremely passionate about strict datatyping and they’re scared away by TweenLite/Max’s “loosey-goosey” treatment of the vars Object. Many others love the flexibility, efficiency, and readability of that same feature. This utility should make it easier on the strict datatyping folks.
