ActionScript Development
animateWithStack method. We’ve updated the handleFrameLabel method to do just this. animateWithStack will then check if the current MovieClip corresponds to the current animation on the stack, and if it is a match, and it’s current label matches that of the animations endLabel property, then it will stop the current clip, increment the stack pointer to the next animation and begin anew with those properties. If, for any reason, the current clip and frame label do not match, then the animation will proceed as normal until the next frame label is detected. If the _animStack array is empty, then no animations will be triggered beyond what is being controlled outside of the class. The TimelineManager will still be dispatching events when frame labels are detected, just as it always has. (Listing 7) provides a new document class. Here, I’m using two MovieClip instances so as to properly demonstrate this new feature Dynamic Animation Stacks So, that covers animations produced by a designer, but the likelihood is that you’ll reach a point where dynamic animation is package { import flash.display.MovieClip; import TimelineManager; import FrameEvent; public class Main4 extends MovieClip { public function Main4() {
also required when responding to a frame label event. This is especially likely if the animation were to respond to user input. We can cater for this by providing scope for custom animation properties, which we can then proxy to a dedicated tween framework, such as TweenLite. This way, if custom values are added with animation data on the stack, then we can let the tween framework handle the animation, and if not, handle the animation the old fashioned way. As before, we’ll update the TimelineManager class to handle this functionality. (Listing 8) provides the new code. We now have two new methods, handle TweenliteAnimCompleted and getFrame- NumberFromLabel, and the class variable _dynAnimating . However, the main changes to the class are contained in the addAnimationToStack and animateWithStack methods. We now have provision to pass animation properties and a duration value with the objects we place on the stack, so that we can pass these to TweenLite when we wish our animation to run. I’ve chosen TweenLite , but you’re free to choose any tweening framework you like.
In the animateWithStack method, we’re now checking if the current animation on the stack has animation properties. If it does, then we set the flag _dynAnimating to true. This is to ensure that frame labels for this clip aren’t acted upon until TweenLite has finished its task. Then, we set TweenLite about its business, but ensure that handleTweenliteAnimComple ted is fired once it is done, so that we can pass control back to the TimelineManager class and ensure our clip is resting on the end label. The method getFrameNumberFromLabel is a helper class, which helps TweenLite animate to the end frame via it’s frame number. (Listing 9) provides a new document class demonstrating the use of our completed TimelineManager class. Conclusion We’ve only scratched the surface of what’s possible with animating the timeline in ActionScript 3.0, and I expect people to take what is printed here and make something better. An obvious upgrade to the TimelineManager class would be to provide support for multiple simultaneous MovieClip animations, perhaps using branched linked list trees, or a simple multi-dimensional array animation stack. The possibilities are truly endless. The point to note here, however, is that you need not waste time re-working an FLA when time is money. If it can be animated successfully in ActionScript, then it might be quicker and more cost effective to simply leave it alone, but to cater for such within your code in a clean fashion. LEE MCCOLL SYLVESTER Lee McColl Sylvester is a haXe and Neko evangelist and author of the Professional haXe and Neko book, published by Wiley and Sons. He is an expert ActionScript developer as well as a seasoned master in systems integration. A student in Visual Communications, he evolved his career specializing in advanced animation and graphical interface development, as well as games development, information management systems, database architecture and hardware communications implementation, producing applications for organisations all over the world. Lee currently works for Bluetube Interactive (www.bluetubei.com) producing Enterprise and RIA applications in Flex, Flash and haXe, while spending much of his free time promoting haXe at conferences and work environments, as well as contributing where possible to the multitude of haXe libraries. The most successful of these include the haXe ODBC and PostgreSQL drivers, the NME platform (Neko Media Library), and the nMagick ImageMagick bindings library.
Listing 9. Document class using dynamic animation features
_ballAnimation1.addEventListener( FrameEvent.LABEL, handleFrameLabel ); _ballAnimation2.addEventListener( FrameEvent.LABEL, handleFrameLabel ); TimelineManager.addAnimationToStack( _ballAnimation1, "fGrow", "fMoveForward", { alpha : .2 }, .5 ); TimelineManager.addAnimationToStack( _ballAnimation2, "fGrow", "fMoveForward", { alpha : .2 }, .5 ); TimelineManager.addAnimationToStack( _ballAnimation1, "fMoveForward", "fMoveBackward", { alpha : 1 }, .5 ); TimelineManager.addAnimationToStack( _ballAnimation2, "fMoveForward", "fMoveBackward", { alpha : 1 }, .5 ); TimelineManager.addAnimationToStack( _ballAnimation1, "fMoveBackward", "fShrink", { alpha : .2 }, .5 ); TimelineManager.addAnimationToStack( _ballAnimation2, "fMoveBackward", "fShrink", { alpha : .2 }, .5 ); TimelineManager.addAnimationToStack( _ballAnimation1, "fShrink", "fEnd", { alpha : 1 }, .5 ); TimelineManager.addAnimationToStack( _ballAnimation2, "fShrink", "fEnd", { alpha : 1 }, .5 ); } private function handleFrameLabel( event : FrameEvent ) : void {
_flText1.text = _ballAnimation1.currentLabel; _flText2.text = _ballAnimation2.currentLabel; } } }
03/2009 (5)
24
Made with FlippingBook HTML5