Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
CarlosCC

Help making text appear and dissappear

Recommended Posts

Hello everyone,

 

I need to achieve an effect but literally, I don't even know where to start, hope someone can lend me a hand, here's the effect that I'm trying to achieve:

 

Let's say my banner starts and ends at the *** and the / it's just a line, literally, in the middle of it:

 

*** ***

T/

TE/

TEX/

TEXT/

TEXT /

TEXT/

TEX/

TE/

T/

 

I don't know if that was clear enough, but what I'm trying to do it's to make text pop in the middle of the banner, and then hide... but I can't seem to find anything related in Google and been searching for hours, any kind of help will be greatly appreciated.

 

PD. I know how to tween :D

Link to comment
Share on other sites

If you're trying to break a TextField apart by character, you could consider using SplitTextField and then animate the TextFields with TweenMax.allFrom() or TweenMax.allTo() like:

 

var stf:SplitTextField = new SplitTextField(myTextField);

TweenMax.allFrom(stf.textFields, 0.01, {autoAlpha:0}, 0.5);

 

That code would make each character pop on one-after-the-other in 0.5-second increments. If this is for a banner, though, you may not have enough room file-size-wise for TweenMax and SplitTextField (which is a membership benefit of Club GreenSock by the way). In that case, it wouldn't be too difficult to build a simple class that acts as a wrapper of sorts for a TextField and has a "progress" and/or "character" getter/setter that could be tweened. Those properties would control how many of the original characters are shown. If we named our class "TextTyper", the animation code would look like:

 

var typer:TextTyper = new TextTyper(myTextField);
typer.progress = 0; //hides all the characters. Internally, TextRevealer would set the TextField's "text" property to ""
TweenLite.to(typer, 5, {progress:1});

 

This would look like the characters are typed in over the course of 5 seconds.

 

So every time the progress property is set, the TextTyper instance figures out the corresponding number of characters that should be shown in the "text" property.

 

Just a few ideas. If ActionScript is kinda scary for you, though, this won't be a simple task. I'm short on time right now, but if you get totally stuck I might be able to find time to whip together that TextTyper class (no promises) :) SplitTextField definitely gives you more flexibility though. http://www.greensock.com/splittextfield/

Link to comment
Share on other sites

Hi,

 

I tried but getting the following error:

 

1) 1046: Type was not found or was not a compile-time constant: TextTyper.

2) 1180: Call to a possibly undefined method TextTyper.

 

Textbox property name is "myTextField". The code used is...

 

import com.greensock.*;

import com.greensock.easing.*;

 

var typer:TextTyper = new TextTyper(myTextField);

typer.progress = 0; //hides all the characters. Internally, TextRevealer would set the TextField's "text" property to ""

TweenLite.to(typer, 5, {progress:1});

 

What is wrong?

Link to comment
Share on other sites

No no, TextTyper was a completely hypothetical class - it was an arbitrary name I chose to demonstrate a general concept. It sounds like that's not something you'd be comfortable building, though. And I don't have time to build it for you (as I mentioned) so maybe SplitTextField is your best shot. Are you a "Shockingly Green" or corporate Club GreenSock member yet?

Link to comment
Share on other sites

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 account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×