AS3 — Creating TextFields in a loop. Also with dynamic variable names

Actionscript 3

Judging by the amount of keywords my other AS3 post picked up like “Creating a new text loop in AS3”, I was obliged to answer.

Well, creating textfields in a loop is quite simple. Lets define a bare-minimum TextFormat outside of our loop (unless it needs to change per iteration).

var textFormat:TextFormat = new TextFormat("verdana", 11)

By the way, lets use our little trick we learned about assigning dynamic variable names to movieclips here because the same issue applies: we want access to our textfields in case we want to modify them later. The problem is that after this loop, we have no way of accessing them!

Let’s create an array to store our textfield and create a loop to generate our text fields.

var textFormat:TextFormat = new TextFormat("verdana", 11)

// lets create an array to store all of our textfield references.
var textArray:Array = new Arrray()

// and now the loop
for (var i:int; i < 3; i++) {
    var textField:TextField = new TextField()
    textField.defaultTextFormat = textFormat
    textField.text = 'This is my TextField' + i
    textField.x = 50*i

This would create 3 textFields with text: “This is my TextField0”, 1, 2.

We can now access those textfields (say the x position was too arbitrary) with our textArray.

textArray[0] = our first textField, textArray[1] = our second one, etc.
textArray[0].x = 500 // to access each object

Here’s a tip for having more useable text in the textFields. After all, the same thing plus a number is quite boring.

We can make another Array that holds the text each textField is supposed to have.

How about:

var text:Array = new Array('First TextField','TextField Two', 'Anything, really')

Now we can run through our loop again according to how many things are defined in our Array called text.

for (var i:int; i < text.length; i++) {
    var textField:TextField = new TextField()
    textField.defaultTextFormat = textFormat
    textField.text = text[i]
    textField.x = 50*i

This time, our loop will conveniently create as many textFields as you put in the “text” array. In retrospect, naming the textfield reference array textArray was a bad idea, as it forced me to use an uninformative name for the second array. It probably should have been something like: tfReferenceArray, and tfTextArray.

Hope something was useful. There are endless applications for this stuff.


28 thoughts on “AS3 — Creating TextFields in a loop. Also with dynamic variable names

  1. Seems like I may have been able to figure out myself but you just saved me the hours of trial and error that it would have taken me. ¡Muchas Gracias Amigo!

  2. So there is no way to use:
    addChild (this[“textField”] + i); //or something similar to omit the arrays, and afterwards reference to the textField or MovieClip by variable name.
    Great job with both tutorials, I see that AS3 needs often more typing then AS1, but AVM2 must compensate me that. Thanx for help!

  3. Hey Johnny,

    I don’t know much about AS3 myself, but from looking around google for a long time, it doesn’t seem like you can dynamically create variable names for them.

    Please let me know if you find out otherwise!


  4. Awesome dood. I was diggin around trying to do this but i didnt know about the push method or whatever. Thanks for saving me unknown hours of messing with code. Now I just need to fit everything in a dynamic scroll bar. Thanks.

  5. Alpesh Vaghasiya: Thanks for the comment. If you want to do something to those fields, work on the TextField Array (textArray in the example).

    textArray[0] = first TF, textArray[1] = second TF, etc.

  6. just to let you know that this echo flash cs3 errors all the way :

    for (var i:int; i < 3; i++) {
    var textField:TextField = new TextField()
    textField.DefaultTextFormat = textFormat
    textField.text = ‘This is my TextField’ + i
    textField.x = 50*i

  7. Hi Jerome, you are right. DefaultTextFormat should be defaultTextFormat, and the reason it won’t work if you copy and paste is because autoformats ‘ to `

  8. Hello.

    I’m doing a game in AS3 and by coincidence I make the text fields in the same way as you. However, I have a problem. When I make the trace, returns me “[object TextField]. ” How do I distinguish a box from one position to another position in another?


    1. By index – [0] is your first dynamically created box, [1] your second, etc.

      You could also trace the X or Y position of that box if you’d like!

      1. How do you trace the X or Y position of each text box? It looks like the text in the array is all added to one textbox, which is textField.

  9. Thank you so much Yuji for your great site and useful tuts, always loved you man 🙂

    I also got a news here that I thought would be so useful for all of us as Flash devs, Now that we are talking about TextField thought to let you know about a class that is so powerful and is extended from the Adobe TextField class itself.

    It’s named TextArea which allows you every possible tags even your own custom tag and has much more abilities too.

    Check out for more information.

    It not only allows you to load different SWF files by calling different tags in line of your text but also you have much more control over your Text blocks and its contents… such as calling your custom functions right from your text blocks and passing multiple and different arguments through them; loading talking avatars, video players, buttons, slideshows and more… by calling their own tags and having full interaction between all of the loaded SWF modules and your text block. Check out the site for more information, downloading the platform is also free of charge 🙂

  10. Just desire to say your article is as astonishing. The clarity in your submit is simply nice and that i could suppose you are an expert on this subject. Well along with your permission let me to snatch your RSS feed to stay updated with impending post. Thank you a million and please carry on the rewarding work.

  11. Your code getting erorr on line 3 textField.defaultTextFormat = textFormat
    it should be textField.defaultTextFormat = TextFormat(); but it isn`t working this way.

  12. Thanks, Yuji! Your code helped me to finally figure out something I’ve been trying to fix for a while.

  13. An impressive share! I’ve just forwarded this onto a friend who was conducting a little homework on this. And he actually bought me breakfast due to the fact that I discovered it for him… lol. So allow me to reword this…. Thank YOU for the meal!! But yeah, thanks for spending the time to talk about this matter here on your blog.

  14. Your style is really unique in comparison to other folks I have
    read stuff from. Many thanks for posting when
    you’ve got the opportunity, Guess I’ll just book mark this blog.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s