sondanz Posted May 17, 2013 Share Posted May 17, 2013 Is there any way I can reduce the size of TweenLite's footprint within my Flash banner? On publish, Actionscript 2.0 Classes make up 20K of my 32K banner. I'm not doing anything crazy here, just fading in/out and moving up/down. I tried using TweenNano...file size was GREAT. But I couldn't figure out how to make my banner repeat only two times, since there is no "repeat" or "restart" features like there are in TweenLite. Am I importing something that I don't need? Here's my AS2.0 TweenLite Code: // import the tween engine import com.greensock.*; import com.greensock.easing.*; ////////////////////////////////////////////////////////////////////////// // define the timeline var timeline:TimelineLite = new TimelineLite({onComplete:repeat}); // define repeat function variables var nPlays = 0; var totPlays = 2; // repeat timeline if played less than three times function repeat() { if (nPlays < totPlays) { timeline.restart(); nPlays++; } } ////////////////////////////////////////////////////////////////////////// // get your tween on timeline.appendMultiple([ TweenLite.from(text1, 1, {_alpha:0, _y:"-20", ease:Expo.easeOut, delay:.5}), TweenLite.from(text1b, 1, {_alpha:0, _y:"40", ease:Expo.easeOut, delay:.5}), TweenLite.to(text1, 1, {_alpha:0, _y:"20", ease:Expo.easeOut, delay:2.5}), TweenLite.to(bg1, 1, {_alpha:0, ease:Expo.easeOut, delay:2.5}), TweenLite.from(text2, 1, {_alpha:0, _y:"-20", ease:Expo.easeOut, delay:3}), TweenLite.to(text2, 1, {_alpha:0, _y:"20", ease:Expo.easeOut, delay:5}), TweenLite.from(text3, 1, {_alpha:0, _y:"-20", ease:Expo.easeOut, delay:5.5}), TweenLite.to(text3, 1, {_alpha:0, _y:"20", ease:Expo.easeOut, delay:7.5}), TweenLite.from(text4, 1, {_alpha:0, _y:"-20", ease:Expo.easeOut, delay:7.5}), TweenLite.from(stall, 2, {_y:"10", delay:10})]); stop(); Here's my AS2.0 TweenNano code. File size is great, but I can't figure out how to make it repeat only twice. // import the tween engine import com.greensock.*; import com.greensock.easing.*; ////////////////////////////////////////////////////////////////////////// // define repeat function variables var nPlays = 0; var totPlays = 2; // repeat timeline if played less than three times function repeat() { if (nPlays < totPlays) { //initBanner.start(); initBanner(); nPlays++; } } ////////////////////////////////////////////////////////////////////////// function initBanner({onComplete:repeat}) { //the issue is with this line TweenNano.from(text1, 1, {_alpha:0, _y:"-20", ease:Expo.easeOut, delay:.5, overwrite:0}); TweenNano.from(text1b, 1, {_alpha:0, _y:"40", ease:Expo.easeOut, delay:.5, overwrite:0}); TweenNano.to(text1, 1, {_alpha:0, _y:"20", ease:Expo.easeOut, delay:2.5, overwrite:0}); TweenNano.to(bg1, 1, {_alpha:0, ease:Expo.easeOut, delay:2.5, overwrite:0}); TweenNano.from(text2, 1, {_alpha:0, _y:"-20", ease:Expo.easeOut, delay:3, overwrite:0}); TweenNano.to(text2, 1, {_alpha:0, _y:"20", ease:Expo.easeOut, delay:5, overwrite:0}); TweenNano.from(text3, 1, {_alpha:0, _y:"-20", ease:Expo.easeOut, delay:5.5, overwrite:0}); TweenNano.to(text3, 1, {_alpha:0, _y:"20", ease:Expo.easeOut, delay:7.5, overwrite:0}); TweenNano.from(text4, 1, {_alpha:0, _y:"-20", ease:Expo.easeOut, delay:7.5, overwrite:0}); TweenNano.from(stall, 2, {_y:"10", delay:10, overwrite:0}); } initBanner(); stop(); Link to comment Share on other sites More sharing options...
Carl Posted May 17, 2013 Share Posted May 17, 2013 Yeah, if filesize is your main concern, you can't get better than TweenNano. TweenLite really can't be made much smaller, we've gone to great lengths to get it to its current size. Check out this post to see how to make TweenNano sequences play multiple times: http://forums.greensock.com/topic/6190-tween-nano-looping/#entry22082 If you need an animation to play only 2 times. You can just use a counter in your onComplete callback of your last tween var count = 0; //bunch of tweens //last tween TweenNano.to(mc, 1, {_x:200, onComplete:loop}); function loop() { count++; if (count != 2){ //code to replay } } let us know if you need more help with that. Link to comment Share on other sites More sharing options...
sondanz Posted May 17, 2013 Author Share Posted May 17, 2013 Thanks Carl for your suggestions and all the wonderful video tutorials you've shared over the years. Unfortunately, this code only seems to loop the final tween, not the entire group. (I read the other thread you linked to earlier this week. It causes a hiccup as you jump from an empty keyframe, so that creates another issue.) import com.greensock.*; import com.greensock.easing.*; function initBanner() { TweenNano.from(text1, 1, {_alpha:0, _y:"-20", ease:Expo.easeOut, delay:.5, overwrite:0}); TweenNano.from(text1b, 1, {_alpha:0, _y:"40", ease:Expo.easeOut, delay:.5, overwrite:0}); TweenNano.to(text1, 1, {_alpha:0, _y:"20", ease:Expo.easeOut, delay:2.5, overwrite:0}); TweenNano.to(bg1, 1, {_alpha:0, ease:Expo.easeOut, delay:2.5, overwrite:0}); TweenNano.from(text2, 1, {_alpha:0, _y:"-20", ease:Expo.easeOut, delay:3, overwrite:0}); TweenNano.to(text2, 1, {_alpha:0, _y:"20", ease:Expo.easeOut, delay:5, overwrite:0}); TweenNano.from(text3, 1, {_alpha:0, _y:"-20", ease:Expo.easeOut, delay:5.5, overwrite:0}); TweenNano.to(text3, 1, {_alpha:0, _y:"20", ease:Expo.easeOut, delay:7.5, overwrite:0}); TweenNano.from(text4, 1, {_alpha:0, _y:"-20", ease:Expo.easeOut, delay:7.5, overwrite:0}); TweenNano.from(stall, 2, {_y:"10", delay:10, overwrite:0, onComplete:loop}); } initBanner(); // function to repeat twice var count = 0; function loop() { count++; if (count != 2){ initBanner(); //WHAT AM I DOING WRONG HERE? trace("ahhhh"); } } Link to comment Share on other sites More sharing options...
Carl Posted May 17, 2013 Share Posted May 17, 2013 As mentioned in the other thread, you will need to reset all the values that are tweened. For instance in initBanner() you have 2 tweens that affect the alpha of text1 first you tween from _alpha:0 then you tween to _alpha:0 I'm sure that works, but the second time that function runs, the _alpha of text1 is already 0, so tweening from _alpha:0 doesn't do anything. Remember in from() tweens the ending value is the current value. On the second run of initBanner the starting alpha of text1 is the same as the ending alpha, 0. So you are going to have to have to add code that resets all the properties to what they were prior to initBanner running. Here is some code that makes it easy to record all the common transforms (_x, _y, _xscale, _yscale, etc) and re-apply them on each loop import com.greensock.*; import com.greensock.easing.*; import flash.geom.Matrix; //record original transform matrix of each mc var mc1Matrix:Matrix = mc1.transform.matrix; var mc2Matrix:Matrix = mc2.transform.matrix; stop(); function initBanner() { var delay:Number = 0; //reset transformations on both mcs mc1.transform.matrix = mc1Matrix; mc2.transform.matrix = mc2Matrix; TweenNano.to(mc1, 1, {_x:300}); delay += 1.5; TweenNano.to(mc1, 1, {_xscale:2, _yscale:2, delay:delay, overwrite:false}); delay += 1; TweenNano.to(mc2, 2, {_x:400, delay:delay, onComplete:loop}); } // function to repeat twice var count = 0; function loop() { count++; if (count != 2) { initBanner();//WHAT AM I DOING WRONG HERE? trace("ahhhh"); } } initBanner(); I have attached a cs5 fla. For alpha you will have to store those values in a separate variable or just set the _alpha of all the clips back to 1 TweenNano_recordMatrix_AS2_CS5.zip 2 Link to comment Share on other sites More sharing options...
sondanz Posted May 17, 2013 Author Share Posted May 17, 2013 Thank you so much! I will dig into this and see if I can get this bad boy working. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now