Automatic scroll to the bottom of a TextArea

By | 18 February, 2009

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/