Flash: How to change a text fields' textFormat on the fly/per action in AS3?

Question

Hi :) my question today is how to change a textFormat on a textfield.

I have a textFormat that has white text and one that has green text, on a button rollover I need to swap that textFormat on my textField to one that has green text. The textFields are getting their .text data from an Array to complicate things...

---

Arrays, Text Formats, Buttons, TextField Creation code:

var cataText:Array = [] //My text array

// Text Formats
var a12 = new TextFormat();
    a12.font = "Arial";
    a12.size = 12;
    a12.color = 0xFFFFFF;

var a12Green = new TextFormat();
    a12Green.font ="Arial";
    a12Green.size = 12;
    a12Green.color = 0xA7D23F;


// Create the Nav Buttons -----------------------------------
function createNav()
{
     for (var i:Number = 0; i < myXMLArray.lenght; i++)
         navButton = new NavButton();
         navButton.name = "button" +i;
         navButton.x = i * (SIZE + SPACING);
         navButton.y = buttonY;
         thumbsMov.addChild(navButton);

         buttons.push(navButton)
         buttons[i].addEventListener(MouseEvent.MOUSE_UP, handleButtonClick);
         buttons[i].addEventListener(MouseEvent.ROLL_OVER, handleButtonOver);
         buttons[i].addEventListener)MouseEvent.ROLL_OUT, handleButtonOff);
         buttons[i].useHandCursor = true;

     var traceText:TextField = new TextField();
         traceText.defaultTextFormat = a12;
         traceText.selectable = false;
         traceText.mouseEnabled = false;
         traceText.x = i * (SIZE + SPACING);
         traceText.y = 186;
         traceText.width = 116;
         traceText.height = 20;
         traceText.text = myXMLArray[i].id; // <setting the text
         thumbsMov.addChild(traceText);

         cataText.push(traceText);  // <The array my text is getting placed in

}

}

---

Button Listener Code and where I'm trying to change textFormat

// Button Listener  -----------------------------------
function handleButtonOver(event:MouseEvent):void
{
    var button:NavButton = event.target as NavButton;
    if(button)
       button.nextFrame()
       thumbsMov.traceText.defaultTextFormat = a12Green;  //< trying to assign new textFormat
       thumbsMov.traceText.text = cataText[0].text; // < figured this is how I would set the text again...
       trace(cataText[0].text);
}

trace(cataText[0].text); //< this will trace out only if I comment out the 2 lines above it :( because I get the error below on rollover if the 2 lines above are not commented out:

*My error: TypeError: Error #1010: A term is undefined and has no properties. at test2_fla::MainTimeline/handleButtonOver()*

I'm guessing that I need some sort of listenerEvent perhaps? To listen for some kind of variable change and then swaps out the textFormat, but I'm not sure about how to proceed that way.

Answer 1

What happens if you change

thumbsMov.traceText.defaultTextFormat = a12Green;

to

thumbsMov.traceText.setTextFormat(a12Green);

Answer 2

Try this for your handleButtonOver function:

function handleButtonOver(event:MouseEvent):void
{
    var button:NavButton = event.target as NavButton;
    var id:Number = Number(button.name.split("button")[1]);
    if(button)
        button.nextFrame();
        cataText[id].defaultTextFormat = a12Green; 
        cataText[id].text = myXMLArray[id].id;
        trace(cataText[id].text); 
}