Typewriter Effect in Adobe Canvas

[tjlinzy]

Hello All,

I am desperately and humbly asking for assistance on creating a typewriter effect in Adobe Animate CC.  I was able to, through a tutorial, create this effect in AS3.  However, now that I’m converting all my files to Canvas, I am stuck and it is a tremendous problem for me.

I am absolutely clueless when it comes to coding.  I’ve read an answer to this issue, and the answer was so beyond my comprehension, it was embarrassing.  I am able to do a few simple things and with the help of code snippets, I’m able to fool my friends into thinking that I’m pretty good at this stuff.

The AS3 for the typewriter effect is:

var myString:String = "I'm from Maryland.";

var myArray:Array = myString.split("");

addEventListener(Event.ENTER_FRAME, frameLooper);

function frameLooper(event:Event):void {

                if (myArray.length > 0) {

                    tf.appendText(myArray.shift());

                } else {

                    removeEventListener(Event.ENTER_FRAME, frameLooper);

                }

}

Will someone PRETTY PLEASE, with ice cream on top, translate the above AS 3.  I need this to appear in an Animate file.

Thanks in advance to the angel willing to help me.

Sincerely,

Terri

[JoãoCésar · Accepted solution]

Hi.

Are these answers helpful?

https://community.adobe.com/t5/animate-discussions/typewriter-effect-in-html-canvas-with-a-dynamic-t...

Please let us know.

Regards,

JC

[tjlinzy]

Wow...ABSOLUTELY.  

I just found them and it works.  Would you happen to know how to speed up the typing effect?  

Thanks so much for your quick response.  

[JoãoCésar · Accepted solution]

Awesome!

If you're using a setInterval approach, you can lower the execution interval.

Which suggested approach are you using?

[tjlinzy]

Hi. JC, 

I'm just seeing this.  I had to switch gears and came back to this just today. 

YYYYEEEESSSS!!!!!!  I changed the setInerval from 400 to 100 and it is absolutely perfect. I would have never thought to reduce anything (because coding is not something that I'm good at, but certainly admire those who are). 

I can't thank you enough for helping me.  I really, truly, absolutely, appreciate you. 

Thank you again, bless you, and I pray the best for you.  You are tremendous!

Terri

[tjlinzy]

JoaoCesar, would you believe it? 

1. I got the speed exactly how I wanted. 
2. Went into the document to do  my thing. 
3. When I first tested the code, I only had one question needing an answer.
4. However, there are 16 questions per document. 
5. My new problem is that the answer does not disappear for the next question. 

Can you advise me on this as well, please?  And please remember that I am basically clueless when it comes to this stuff.  I am trying my hardest to not use the masking technique because it would take a lot longer to complete this task.

Thanks in advance,

Terri

[tjlinzy]

Hi JoaoCesar, 

I found a work-around.  I just made the action codes and dynamic text boxes into movie clips.  All I have to do is duplicate the movie, change the name and instance names and then I'm good. 

The only drawback is, if that's what you want to call it, is that if I go from button 1 (frame 1)  to button 2 (frame 2), and then I hit the button 1 to take me back to frame 1, I don't get the typing effect.  I can live with that...I'm exhausted and hungry now. LOL

What am I doing?  I am making a chat site for children with pre-typed answers so that I can control the content on the site. 

Thanks again for EVERYTHING.  If you have a solution for this I would appreciate it, if not...it will do.  

Regards!