How to programmatically scroll to the end of Flex Spark Textarea when adding a new line?

Question

The old method for mx: TextArea no longer works. In particular:

myMxTextArea.verticalScrollPosition = myMxTextArea.maxVerticalScrollPosition; 

I found this method for Spark, but it seems a bit kludgy:

 mySparkTA.scrollToRange(mySparkTA.text.length-1, mySparkTA.text.length); 

Is there an easier way to do this?

Answer 1

Assuming you have

 <s:TextArea id="ta" width="100%" height="100%" /> 

The following will work:

 ta.scroller.verticalScrollBar.value = ta.scroller.verticalScrollBar.maximum; 

There is no need to wrap TextArea in a Scroller component.

Answer 2

This is how you handle a spark text field, but you can always try to wrap it in a Scroller component and not have the scroll text field itself:

 <s:Scroller id="scroller"> <s:TextArea id="ta" width="100%" height="100%" /> </s:Scroller> 

Then do it in AS:

 scroller.verticalScrollBar.value = scroller.verticalScrollBar.maximum; 

There is no other easy way to do this.

Answer 3

The TextArea spark has an appendText method. This adds text and automatically scrolls to the added line.

Answer 4

 <s:TextArea id="consoleTextArea" change="consoleTextArea_changeHandler(event)" valueCommit="consoleTextArea_valueCommitHandler(event)" updateComplete="scrollToTheBottom()" /> 

And then in ActionScript:

  protected function consoleTextArea_valueCommitHandler(event:FlexEvent):void { scrollToTheBottom(); } protected function consoleTextArea_changeHandler(event:TextOperationEvent):void { scrollToTheBottom() } public function scrollToTheBottom():void { var scrollBar:VScrollBar = consoleTextArea.scroller.verticalScrollBar; scrollBar.value = scrollBar.maximum; consoleTextArea.validateNow(); if (scrollBar.value != scrollBar.maximum) { scrollBar.value = scrollBar.maximum; consoleTextArea.validateNow(); } } 

You may need to put the if statement in a loop for several iterations or until the value matches or is close to the maximum.

Update : Added a listener for the updateComplete event. This may prevent someone from typing, but may work fine for this use case.