Pipsisewah

Hello, I am having a little trouble with finding a good equation for animating text with a fixed play length. A user needs to be able to tell me: "I want this animation to play for [x] amount of seconds" I am using TimelineMax.staggerFrom with a SplitTextField to make this happen. I first need to ensure my understanding of StaggerFrom is correct. In this case, lets say we are doing a fade in by character. Here is my understanding of how this should work: T = total time (2 seconds in this case) C = total number of characters (let' use the word "Hello", so this is 5) A = time for each character to fade in S = stagger time (time between letters starting to fade in) I inferred from the documentation that the total time of a StaggerFrom could be calculated by the following equation: T = (S * (C-1) + A) example: "Hello" in 2 seconds 2 = (.35 * (5-1) + .6) This is saying that the total time equals the total of all the stagger times plus the time it takes for 1 character fade in. The difficult part, which I am having trouble with, is using different numbers for the stagger time and fade time, as I want the characters to overlap on the fade in. I believe my equation for how the StaggerFrom is working is incorrect, since my simulations in Excel all work but when I port it over to actionscript (and yes I checked the variables at runtime and they are matching my simulation), it only plays for around 1 second. If anyone could help correct my understanding of how StaggerFrom works, I would greatly appreciate it! Thank you!

Hello Carl, Thank you very much for taking the time to explain that to me. I think I understand what you are saying and it just may have worked (more testing will tell). It looks like the solution may be as follows: 1. Create a SplitTextField before anything else (which references the textField) 2. Instead of passing the textField to each function and having the function create new SplitTextFields, now I pass the SplitTextField I created at the start 3. Do all the animations I want 4. Cleanup the whole thing (probably call the onComplete of the masterTimeline to now do the cleanup function instead of each individual animation timeline) The only real change in functionality for me would be that users will have to pick how the text will split for all animations. They cannot have one animation split by word and another split by letter on the same text field. Honestly, I think people can live with that Things seem to be clicking better now and reacting more as expected (the FromTo is working with alpha as expected). If I run into any bumps, I will respond here, but for anyone else looking to do this, I think doing all your work off of 1 SplitTextField seems to be the trick. Thanks again Carl, this kind of support is rarely seen and greatly appreciated.

Hello Carl, After further research, I'm finding that I cannot have more than one splittextfield on a textfield in a timeline. My goal is to be able to animate the same object multiple times within a timeline. Per the docs, I should be able to call destroy() after using a splittextfield on a textfield and it should remove it from the textfield so the textfield can be resued. Unfortunately, per my previous post and my further research, I may be doing something wrong here. From what I can tell it seems like the destroy function is not working as I expect. After I call the destroy function, I am able to do operations which do not include a splittextfield( things like rotating the textfield or changing its tint). If I attempt to apply another splitextfield to that same text, it does not render the effect. My operation looks like the following: 1. create textfield 2. apply splittextfield 3. animate text (onComplete: cleanup, onCompleteParams: splittextfield) 4. cleanup function - this calls destroy() on the splittextfield 5. apply another splittextfield 6. animate text (onComplete: cleanup, onCompleteParams:splittextfield) 7. cleanup function - this again calls destroy() but to the new splittextfield I was wondering if I was missing a step in clearing the previous splittextfield or if there was something more I needed to make this work. I'm still trying things on my end. Thank you for the assistance, it is really appreciated! - Steven Lopes

Hello Carl, Thank you very much for taking the time to assist me! Unfortunately, I tried the method you suggested and it did not work. The text held an alpha of 1 (basically ignored the fadeIn), but the FadeOutByWord worked. I'm assuming this is what happened: 1. Alpha is set to 0 for FadeIn. 2. Alpha is set to 1 for FadeOutByWord 3. FadeIn runs but since alpha is already at 1, nothing happens. 4. FadeOutByWord runs and alpha for each character goes from 1 to 0 as expected. I wrote a separate program as requested detailing this issue. I have removed the SWC from the program as requested. This problem includes your suggestion for staggerFromTo. Thanks again for the help, it is really appreciated. - Steven Lopes GreensockHelpExample.zip

Hello, I am having a little trouble with the SplitTextField and need a little direction. I cant find a good way to explain this, so I'm going to describe it bluntly. Example: I have two animations in a timeline, 1 should fade text in, the next should use a splittextfield to fade out by word When I run the animation as a whole, the text appears after the entire animation is complete (once the splittextfield has been disposed) My Theory: Since I am adding all the animations to a master animation at once, the splittextfield is being created right away and looking at the current state of the textfield. Since it has an alpha of 0, the splittextfield is created with an alpha of 0 and never shows on the screen. Below is my code of each item: // FADE IN /**Text Fades In From 0 to 1 (Alpha)*/ public static function FadeIn(target:Object, time:Number):TimelineMax{ var t:TimelineMax = new TimelineMax(); TweenMax.set(target,{alpha:0}); t.add(TweenMax.to(target, time, {alpha:1})); return t; } // FADE OUT BY WORD /** Text fades out by word */ public static function FadeOutByWord(target:TextField, time:Number):EnhancedTimelineMax{ var stf:SplitTextField = new SplitTextField(target, "words"); var t:EnhancedTimelineMax = new EnhancedTimelineMax({onComplete:cleanup, onCompleteParams:[stf]}); t.splitTextField = stf; t.add(TweenMax.staggerTo(stf.textFields, time / 2, {alpha:0}, (time / stf.textFields.length), cleanup, [stf])); return t; } // CLEANUP /** Cleans up the Split Text Field */ private static function cleanup(mySTF:SplitTextField):void{ mySTF.destroy(); } // TEST PROGRAM masterTimeline = new TimelineMax(); createTextField("MAKE SOME NOISE!!!!\n GO DIAMONDBACKS!"); masterTimeline.add(StandardAnimations.FadeIn(text,4)); masterTimeline.add(StandardAnimations.FadeOutByWord(text,4)); masterTimeline.play(); My Goal: I would like the text to fade in to an alpha of 1, then I want the fade out function to fade each word using alpha from 1 to 0. My Question: If my theory is correct, how do I keep the splittextfield from being created right away? Please let me know if there is a correct method which I am missing. Thank you very much!

Hello Carl, Thank you very much for the help! You're answer was exactly what I needed. Just an FYI for anyone else who comes across a similar issue, my final solution was to extend the timelineMax with an object which I called enhancedTimelineMax. This object simply kept a pointer to the SplitTextField used on each animation. I replaced all my timelineMax objects within my library with this class. When the end user clicks stop, I used the getChildren() on the masterTimeline and search for any objects which were enhancedTimelineMax and stated something to the following: foundEnhancedTimelineMaxObject.pointerToSplitTextField.deactivate(); If what I said above is confusing let me know and I will post some code and further explanations. Thank you again for all the help, its a super relief to get such great support. Makes though projects move forward.

Hello, I am having a little bit of trouble finding a way to remove the split text field from a textfield once I stop the animation its in. Long story short, I made a library which creates little timelines (sub-animations) for each animation (a timelineMax for flashing text, one for bouncing text, etc.). I give the end user the ability to combine all these little tiimelines into one big timeline, so that they may do something like the following: Text fades in, text flashes, text spins, text slides off screen All is working fine until one point. If one of those sub-animations uses a Split Text Field for its operation and the end user clicks the stop button before that sub-animation completes, the Split Text Field stays on the textField and I cannot find a way to remove it (usually the textField disappears). If needed, I can provide some code but I have a sneaky suspicion that there is a very simple and already completed solution for this exact issue. I can say that I do the following whenever the "stop" button is clicked as an attempt to fix the issue: (These are applied to the 'master' timeline) timeline.stop(); timeline.seek(0); timeline.clear(true); TweenPlugin.activate([blurFilterPlugin]); TweenMax.to(target,0,{blurFilter:{remove:true}}); Thank you in advance for your assistance!

Hello again, I have been going through the various plugins and I seem to have run into a problem with the scrambleTextPlugin. I'm trying to follow the instructions in the the documentation but nothing shows in the screen when I do so. I am using a main timeline to encapsulate the scrambleText timeline // MAIN CLASS ////////////////////////////////////////////////////////////////////////////////////////////// var t:TimelineMax = new TimelineMax(); createTextField("MAKE SOME NOISE!!!!"); t.add(AdvancedTextEffects.randomCharacters(text, 3)); t.play(); //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// // SUB TIMELINE //////////////////////////////////////////////////////////////////////////////////////////// public static function randomCharacters(target:TextField, time:Number):TimelineMax{ TweenPlugin.activate([ScrambleTextPlugin]); var t:TimelineMax = new TimelineMax(); t.from(target, time, {scrambleText:{text:"THIS IS NEW TEXT"}}); return t; } ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// This method seems to work for just about everything else but this instance. Any help you could provide would be very appreciated. I am running this an Adobe AIR application. Thank you, Steven Lopes

Hello Carl, That did the trick! Thank you very much for your fast response and your detailed explanation. That is amazing customer service and it is really appreciated! Have a great day! - Steven Lopes

Hello, We purchased the Club membership and received the SplitTextField which honestly is working really really well. I'm having a little problem though. I am attempting to create a sub-timeline using TimelineMax which animates a SplitTextField. Once I create the timeline in my function, I return the TimelineMax to the parent class which adds it to the main timeline (also a timelineMax). I have been doing this for all the animations I need and its working just fine. I can sequence 10 different complex animations without a problem! Here is my issue (and I know it simple, just need a push in the right direction), once the Split Text Field is done, I need it off the screen so the other animations will render. I tried the onComplete and the onCompleteRender functions and told them to call a cleanup function (which does work), but it looks like it calls the function after the first character of my staggerFrom completes animation. Basically, what I am seeing is the first character stop, then the SplitTextField is destroyed and the other animations render. If I do not destroy the SplitTextField, nothing happens after the first animation. Below is my general code: // PARENT CLASS ////////////////////////////////////////////////////////////////////////////// var t:TimelineMax = new TimelineMax(); // Creates an flash.text.textField with general properties including embedded fonts. createTextField("MAKE SOME NOISE!!!!"); // Add the animation I need which uses the Split Text Field t.add(AdvancedTextEffects.ScaleandSpinText(text,4)); //Add more animations which do not use the Split Text Field t.add(SimpleTextEffects.Flash2(text, 1)); t.add(SimpleTextEffects.ScaleOut(text, 1)); t.add(SimpleTextEffects.Jiggle4(text, 1)); t.add(SimpleTextEffects.SpinClockwise(text, 1)); //////////////////////////////////////////////////////////////////////////////////////////////////////////////// // ADVANCED TEXT EFFECTS CLASS ///////////////////////////////////////////////////////////////// public static function ScaleandSpinText(target:TextField, time:int):TimelineMax{ // Create Sub-Timeline var t:TimelineMax = new TimelineMax(); // Activate Plugins TweenPlugin.activate([TransformAroundCenterPlugin, AutoAlphaPlugin, OnCompleteRenderPlugin]); // Create the SplitTextField var mySTF:SplitTextField = new SplitTextField(target); // Add the Tween we want t.add(TweenMax.staggerFrom(mySTF.textFields, 3, {transformAroundCenter:{scale:5, rotation:360}, alpha:0, autoAlpha:1, ease:Power4.ease-Out, onCompleteRender:cleanup, onCompleteRenderParams:[mySTF]},0.2)); // Return the Timeline return t; } private static function cleanup(mySTF:SplitTextField):void{ mySTF.destroy(); } Please let me know what you think and how to get around this. Thank you! - Steven Lopes

Hello, I am experimenting with the blitmask object and I am running into a little odd problem. When I run a very simple demo of simply scrolling a textfield using blitmask, the movement lags about every 4 seconds. The lag looks like a jitter and for maybe 1/2 a second I cannot read anything (almost like the object and the screen refresh get out of sync). When I watch and play with the demo on the website, I see a very very small amount of this lag, but its still much better than what I am seeing. I set my application to 60 fps and I am using embedded fonts. I am running an i7 with an nVidia 650M 2G graphics card on Windows 7 (all gaming is no problem for me, so this should not be a factor). Below is the code I am using. Any tips or an explanation would be great. The purpose of this code would be to display an RSS/Atom or other scrolling text feed. // Create Textfield var tf:TextField = new TextField(); // Setup Properties and Values tf.embedFonts = true; tf.autoSize = TextFieldAutoSize.LEFT; tf.text = "(Reuters) - Hurricane Odile ground its way up Mexico's Baja California peninsula on Monday, gradually losing strength after injuring dozens of people, forcing the evacuation of thousands and smashing shops open to looters in the popular tourist area. Fierce winds felled trees, buffeting homes and businesses, as one of the worst storms ever to hit the luxury retreats of Los Cabos battered Mexicos northwestern coast with heavy rains.";// The text is 3x as long but I had to cut it due to website thinking it was spam // Format the TextField var format:TextFormat = new TextFormat(); format.font = "arial"; format.size = 40; tf.setTextFormat(format); //Add it to the screen var uic:UIComponent = new UIComponent(); uic.addChild(tf); grpMain.addElement(uic); //Call the scrolling function blitmaskDemo(tf); //Scrolling Function private function blitmaskDemo(tf:TextField):void{ var bm:BlitMask = new BlitMask(tf, tf.x, tf.y, 1920, tf.height, true); bm.cacheAsBitmap = true; bm.bitmapMode = true; TweenMax.to(tf, 150, {x:-(tf.width) + tf.x, onUpdate:bm.update, ease:Linear.easeNone}); } Thank you!!