Auto-scrolling a Spark TextArea control in Flex 4

6 Responses to Auto-scrolling a Spark TextArea control in Flex 4

1. Brian says:

   November 30, 2009 at 7:14 am

   This works for TextArea, but how do you handle manual scrolling? How do you find the vertical scroll position and max scroll position values?

   Reply
2. myIP says:

   December 14, 2009 at 12:46 pm

   Have you noticed that this example accumulates memory? It crashes Firefox after a few minutes of running.

   Reply
   • Peter deHaan says:

     December 14, 2009 at 4:15 pm

     @myIP,

     I tried running the SWF above in my IE8 and FF3.5.5 on Windows XP and I couldn’t reproduce any crashing in either browser.
     I see some very minor memory accumulation, but that may be explained away by the fact I’m adding new text to the TextArea control 2x/second.

     Peter

     Reply
3. Anonymous says:

   February 18, 2010 at 7:13 am

   All this demonstrates is that the spark control appends text and automatically keeps the last line in view.
   The title is a little misleading – I was expecting examples of programmatic control.

   Reply
   • Peter deHaan says:

     February 18, 2010 at 12:00 pm

     @Anonymous,

     Yeah, I’ll buy that — looking back it was a poor blog title. And to make it up to you, I’ll post an example of programmatically changing the horizontal and vetical scroll position on the Spark TextArea control. In fact, here’s a preview:

     <?xml version="1.0" encoding="utf-8"?>
     <s:Application name="Spark_TextArea_verticalScrollBar_value_test"
             xmlns:fx="http://ns.adobe.com/mxml/2009"
             xmlns:s="library://ns.adobe.com/flex/spark"
             xmlns:mx="library://ns.adobe.com/flex/mx">
         <s:controlBarContent>
             <mx:Form>
                 <mx:FormItem label="scroll horizontally:">
                     <s:HSlider id="hSl" minimum="0" change="hSl_changeHandler(event);" />
                 </mx:FormItem>
                 <mx:FormItem label="scroll vertically:">
                     <s:HSlider id="vSl" minimum="0" change="vSl_changeHandler(event);" />
                 </mx:FormItem>
             </mx:Form>
         </s:controlBarContent>
      
         <fx:Script>
             <![CDATA[
                 import mx.events.FlexEvent;
      
                 protected function ta_updateCompleteHandler(evt:FlexEvent):void {
                     hSl.maximum = ta.scroller.horizontalScrollBar.maximum;
                     vSl.maximum = ta.scroller.verticalScrollBar.maximum;
                 }
      
                 protected function hSl_changeHandler(evt:Event):void {
                     ta.scroller.horizontalScrollBar.value = hSl.value;
                 }
      
                 protected function vSl_changeHandler(evt:Event):void {
                     ta.scroller.verticalScrollBar.value = vSl.value;
                 }
             ]]>
         </fx:Script>
      
         <s:TextArea id="ta"
                     widthInChars="20" heightInLines="5"
                     lineBreak="explicit"
                     horizontalCenter="0" verticalCenter="0"
                     updateComplete="ta_updateCompleteHandler(event)">
             <s:textFlow>
                 <s:TextFlow>
                     <s:p>1234567890123456789012345678901234567890</s:p>
                     <s:p>2345678901234567890123456789012345678901</s:p>
                     <s:p>3456789012345678901234567890123456789012</s:p>
                     <s:p>4567890123456789012345678901234567890123</s:p>
                     <s:p>5678901234567890123456789012345678901234</s:p>
                     <s:p>6789012345678901234567890123456789012345</s:p>
                     <s:p>7890123456789012345678901234567890123456</s:p>
                     <s:p>8901234567890123456789012345678901234567</s:p>
                     <s:p>9012345678901234567890123456789012345678</s:p>
                     <s:p>0123456789012345678901234567890123456789</s:p>
                 </s:TextFlow>
             </s:textFlow>
         </s:TextArea>
      
     </s:Application>

     Peter

     Reply
     • Anonymous says:

       February 27, 2011 at 12:55 pm

       you’re the best.