Text disappears from dynamic textfields

[drkb]

I am making some progress with an interactive poetry project I requested help on earlier. Unfortunately I have another problem which I can't seem to solve. In the project I create 49 textfields in a 7x7 grid. The properties are stored in an array. The code I have to do this works as intended.

var instances:Array = [];
for (var i:int = 0; i < 49; i++) {
var j_inst:TextField = new TextField();
j_inst.text = "s";
j_inst.width =50;
j_inst.x = (i % 7)*40+550;
j_inst.y = Math.floor(i/7)*25+100;
j_inst.selectable = false;
j_inst.border = false;
j_inst.autoSize = TextFieldAutoSize.CENTER;
var myFormat:TextFormat = new TextFormat();
myFormat.font = "Arial";
myFormat.color = 0xFFFFFF;
myFormat.size = 24;
j_inst.setTextFormat(myFormat);
addChild(j_inst);
instances.push(j_inst);
}


The problem occurs when I try and change the text - in this case to the letter "O". The textfield simply is cleared with nothing displayed. Here is the code for that -

function tickTock(e:TimerEvent):void {
for (var j:int = 0; j < 49; j++) {
instances[j].text="O";
}
}

If I trace the .text contents of the array it has been changed correctly to "O". It just doesn't display properly. Changing other properties such as x, y works as expected. I've tried with embedded and non-embedded fonts. Doesn't make a difference. I've tried some different blend modes and still no success. I suspect it's some kind of rendering issue but I'm totally stuck.

Any suggestions??

Thanks,

drkb

[Shaedo]

change the colour of your background to a grey colour. then see if that makes a difference.... got it ?


EDIT:
if that is a pain then here is your code and you can just copy it into a new .fla file (with a grey background) and then comment and uncomment as described below
(oh and there is nothing wrong with your x and y I just did that for my own viewing!)


var instances:Array = [];

for (var i:int = 0; i < 5; i++)
{
trace('yey');
var j_inst:TextField = new TextField();
j_inst.text = "1234";
j_inst.width =50;
j_inst.x = i *10;//(i % 7)*40+550;
j_inst.y = i *10////Math.floor(i/7)*25+100;
j_inst.selectable = false;
j_inst.border = true;
j_inst.autoSize = TextFieldAutoSize.CENTER;
var myFormat:TextFormat = new TextFormat();
myFormat.font = "Arial";
myFormat.color = 0xFFFFFF;
myFormat.size = 24;
j_inst.setTextFormat(myFormat);
addChild(j_inst);
instances.push(j_inst);
}

tickTock(null);//comment me out

function tickTock(e:TimerEvent):void
{
for (var j:int = 0; j < instances.length; j++)
{
instances[j].text="O";
}
}

[drkb]

Okay. So I already had a grey background. The text in the new code changes to "O". Great. I'm not quite sure why - simply by changing the loop length to the array length? Could you explain?

Also, the new text is no longer white but is rendered black. Why would this text property change?

[drkb]

Just realized that the background where the textfields were being placed was in fact black. So I only noticed the change in font colour when the rendering was happening on a grey section. It appears then the real issue is why the font colour changes. I don't think anything is disappearing.

[drkb]

I have figured this out. I'm not sure why this is the case but the solution is to reinstate the text format in the function where the text is changed. So instead of -

function ChangeText(e:TimerEvent):void {
for (var j:int = 0; j < 49; j++) {
instances[j].text = "X";
}
}

which doesn't preserve the text format you need to do this -

function ChangeText(e:TimerEvent):void {
for (var j:int = 0; j < instances.length; j++) {
instances[j].text="X";
instances[j].setTextFormat(myFormat);
}
}


Hope this helps someone. It's taken a long time to figure out.

dkb