Freelance 3D Artist, Designer, Animator

How to control text boxes with Actionscript 3.0

In this tutorial I’ll explain how to put text into a textbox using Actionscript 3.0
You can jump to the different sections using the links below:
The different types of text boxes
Creating a dynamic text box
Channing a dynamic text box with actionscript 3.0
Or follow it step by step

The different types of text boxes
In flash there are three types of text box available to you. These are as follows:

1. Static
2. Dynamic
3. Input.

The text in a static textbox always the stays the same, it can’t be changed. Static text boxes are used for titles and the like.

A dynamic textbox is one who’s contents we can control using actionscript. We can chance the text in the textbox when ever we like.

An input textbox lets the user type values into the textbox such as their username and password for example.

For this tutorial we are only going to concern ourselves with dynamic textboxes.

Creating a dynamic text box
To make a dynamic textbox, draw a textbox on your stage as normal, then in the property inspector, use the drop down box to change it from a static textbox to a dynamic textbox.

As it is possible to have lots of textboxes in one flash file, we need someway to tell actionscript which one we are referring to. To do this, we must give each textbox a completely unique name. You can give it almost any name you like, although there are limitations which I won’t go into here, by typing a name for your textbox where it says <Instance Name>. Go ahead, open Flash, create a textbox, change it to a dynamic textbox, and change the Instance Name to txtMyFirstTextBox.

I like to start all my textbox names with txt, this helps me to remember what I’m referring to when I have lots of buttons and movieclips etc in my flash file.

On the stage, Double Click on the dynamic textbox and type in the value “This is dynamic text ”.

Press Ctrl+Enter on your keyboard to test the movie. Nothing much happens. Let’s change this with actionscript.

Channing a dynamic text box with actionscript 3.0
Click on frame 1 in the timeline, then open up the actions panel by clicking on Window > Actions, or pressing F9 on your keyboard.

In the actions panel, type in the following code:
txtMyFirstTextBox.text  =  "I can change it with Actionscript :)";

Press Ctrl+Enter again and your textbox will have changed. Congratulate yourself with a pat on the back.

Now, let’s have a look at the code we just typed in.

Firstly, we used the Instance Name that we gave to the textbox, if we had more than text box, we could have used other instance names too.

txtMyFirstTextBox

Secondly we used the keyword .text, The reason we do this is because we want to change the text in the textbox, not the textbox itself (The textbox will always be a textbox so it can’t be changed).

txtMyFirstTextBox.text

We then added the = operator, this tells flash that we are about to change the value of something.

txtMyFirstTextBox.text =

Next, we said what we wanted to change the value to. In this instance we wanted to change the text to "I can change it with Actionscript :)". When working with text, we always have to enclose it in quotations, this is so that flash knows that it is text. Without the quotes, flash might think that we were referring to six other text boxes called I, can, change, it, with, and Actionscript respectively.

txtMyFirstTextBox.text  =  "I can change it with Actionscript :)"

Finally, we add a semicolon to the end, this tells flash that this is the end of the command.

txtMyFirstTextBox.text  =  "I can change it with Actionscript :)";