How to add a line break in a flex TextArea

To add a line break inside the text of a TextArea component in flex we cannot use \n, but instead use ‘
’ (without the quotes).

For example:

<s:TextArea text=”this text will be on the first line&#13;and this one on the second” …/>

will produce a text box with this text:

this text will be on the first line

and this one on the second

Automatic scroll to the bottom of a TextArea

On my current project, i have a debug TextArea that continuously lists some var values and traces. This way i can keep track of whats going on without stopping execution to debug in Flex.

As the list fills, the Text starts going off the screen, downwards. I needed to keep the scroll on the TextArea always on the last piece of text. I googled and i found a solution by Joan Lafferty, from the blog “flex butterflies and bugs”, so all credit goes to where its due. I leave a link to the original post at the end of this one.

Anyway, the solution is as follows:

<mx:TextArea
valueCommit=”txtl.verticalScrollPosition=txtl.maxVerticalScrollPosition”
id=”txtl”
x=”202″
y=”10″
height=”206″
width=”122″
text=”{log}”
editable=”false”
enabled=”true”
wordWrap=”true”
textAlign=”right”/>

Save for the usual dimension/position properties, what you should look at is the valueCommit method, which will simply keep the scroll at the last bit of content in the TextArea.

Joan’s post is far better explained than this, and has an example. I am just posting this here as a reminder to myself and to other forgetful geeks out there.

Heres the link to Joan’s blog post about this subject:

http://butterfliesandbugs.wordpress.com/2007/08/20/scrolling-to-the-bottom-of-a-container-or-textarea-automatically/

%d bloggers like this: