Skip to main content
Participant
June 17, 2011
Question

Unusual problem setting newline character in textarea

  • June 17, 2011
  • 1 reply
  • 607 views

I have Spark text area which contains the following text:

"text1\ntext2\text3"

Text above is showing as 3 words each on separate line.

text1

text2

text3

Ok

Now i want to stylize text and add background color:

var tmp:String = textArea.text.replace("\n", '</span><br/><span backgroundColor="#B22300">');

textArea.textFlow = spark.utils.TextFlowUtil.importFromString('<span backgroundColor="#B22300">'+tmp+'</span>');

result: it's not working.

So my question is: what am i doing wrong ?

This topic has been closed for replies.

1 reply

Participating Frequently
June 17, 2011

Hi:

I am not sure if you must use the import way to do the replacement work. If yes, please export the whole markup first and do the string replacement operation based on the exported one.

BTW, if you don't have to use the import way, you can just use the TLF way to set the properties. It's much easier and accurate. The following is my code scrap for your scenario:

<?xml version="1.0" encoding="utf-8"?>

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

   xmlns:s="library://ns.adobe.com/flex/spark"

   xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">

<fx:Declarations>

<!-- Place non-visual elements (e.g., services, value objects) here -->

</fx:Declarations>

<fx:Script>

<![CDATA[

private function click():void

{

var tf:TextFlow = myRich.textFlow;

var cSpan:SpanElement = tf.getFirstLeaf() as SpanElement;

var found:Boolean = false;

while(cSpan!=null)

{

if( cSpan.text == "Text2" )

{

found = true;

break;

}

cSpan = cSpan.getNextSibling() as SpanElement;

}

if(found)

{

cSpan.backgroundColor = "#B22300";

cSpan.text = "xxxx";

}

}

]]>

</fx:Script>

<s:layout>

<s:HorizontalLayout />

</s:layout>

<s:TextArea id="myRich" width="300" height="300">

<s:textFlow>

<s:TextFlow>

<s:p>

<s:span>Text1</s:span>

<s:span>Text2</s:span>

<s:span>Text3</s:span>

</s:p>

</s:TextFlow>

</s:textFlow>

</s:TextArea>

<s:Button click="click()"/>

</s:Application>