Some Tips and Tricks with Tweenlite

Well partaking of some forays into AS3 I came across this sweet utility: TweenLite. I highly recommend checking it out.

Here are some cool tricks that I wish I had known earlier.

1. Tweening scrollRect

        const scroller:DisplayObject; // This is the object that we want to display a portion of via scrollRect

	const scrollRect:Rectangle; // This is the scroll rect we tween the properties of

        private function centerScroll(player:Player) {
            TweenLite.to(scrollRect, 1.2, {x:player.x, y:player.y, onUpdate:updateScroll});
        }

	private function updateScroll():void {
		scroller.scrollRect = scrollRect;
	}

It is seriously that easy. The trick is knowing to use the onUpdate parameter to get around being unable to tween scrollRect directly.

2. Random Assemblage

Say you have a logo built out of dozens of tiny stars. You want this logo to assemble from a random starting configuration, but who has the time to micro-manage a bunch of little instances? Well, now, no one needs to. Behold:

for(var i:int = 0; i < numChildren; i++) {
	star = getChildAt(i);

	TweenLite.from(star, duration, {x:String(Math.random()*800 - 400), y:String(Math.random()*800 - 400)});
}

Just place this little snippet in the actions of your MovieClip. The secret here is using the iteration over all the child elements so we don’t have to name them. Also, we can use random numbers so we don’t have to bother laying them out, they just end up in the correct layout from wherever they happen to start.

I’m sure there are many more ways to utilize TweenLite to simply accomplish many amazing things, and I’d like to hear about them!

Author: Daniel X

Heretic priest of the Machine God. I enjoy crawling around in Jeff Bezo's spaceship, bringing technology to the people, and long walks outside of time and space. View all posts by Daniel X