Creating a dynamically resizing TextArea without scrollbars

------------------------------------- DynamicTextArea.as -------------------------------------

package components {
  import flash.events.Event;
  import mx.controls.TextArea;
 
  public class DynamicTextArea extends TextArea{
    public function DynamicTextArea(){
      super();
      super.horizontalScrollPolicy = "off";
      super.verticalScrollPolicy = "off";
      this.addEventListener(Event.CHANGE, adjustHeightHandler);
    }
    private function adjustHeightHandler(event:Event):void{
      trace("textField.getLineMetrics(0).height: " + textField.getLineMetrics(0).height);
      if(height <= textField.textHeight + textField.getLineMetrics(0).height){
        height = textField.textHeight;     
        validateNow();
      }
    }
    override public function set text(val:String):void{
      textField.text = val;
      validateNow();
      height = textField.textHeight;
      validateNow();
    }
    override public function set htmlText(val:String):void{
      textField.htmlText = val;
      validateNow();
      height = textField.textHeight;
      validateNow();
    }

    override public function set height(value:Number):void{
      if(textField == null){
        if(height <= value){
          super.height = value;
        }
      }else{       
        var currentHeight:uint = textField.textHeight + textField.getLineMetrics(0).height;
        if (currentHeight<= super.maxHeight){
          if(textField.textHeight != textField.getLineMetrics(0).height){
            super.height = currentHeight;
          }        
        }else{
            super.height = super.maxHeight;         
        }  
      }
    }
    override public function get text():String{
        return textField.text;
    }

    override public function get htmlText():String{
        return textField.htmlText;
    }
   

    override public function set maxHeight(value:Number):void{
      super.maxHeight = value;
    }
  }
}
 

 

-------------------------------------------- Test.mxml ----------------------------------

<?xml version="1.0" encoding="utf-8" ?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
  xmlns:comp="components.*" creationComplete="init();">
  <mx:Script>
    <![CDATA[
      import mx.controls.Alert;
      import components.*;
     
      private var str:String = "This text will be long enough to trigger " +
        "the TextArea to increase its height.";

      private var htmlStr:String = "This <b>text</b> will be <font color='#00FF00'>long enough</font> to trigger " +
        "the TextArea to increase its height.";

      private function setLargeText():void{
        txt1.text = str;
        txt2.text = str;
        txt3.text = str;
        txt4.text = str;
        txt5.htmlText = htmlStr;
        txt6.htmlText = htmlStr;
        txt7.htmlText = htmlStr;
        txt8.htmlText = htmlStr;
      }
    ]]>
  </mx:Script>
  <comp:DynamicTextArea id="txt1" width="300" height="14"/>
  <comp:DynamicTextArea id="txt2" width="300" height="20"/>
  <comp:DynamicTextArea id="txt3" width="300" height="28"/>
  <comp:DynamicTextArea id="txt4" width="300" height="50"/>
  <comp:DynamicTextArea id="txt5" width="300" height="14"/>
  <comp:DynamicTextArea id="txt6" width="300" height="20"/>
  <comp:DynamicTextArea id="txt7" width="300" height="28"/>
  <comp:DynamicTextArea id="txt8" width="300" height="50"/>
  <mx:Button label="Set Large Text" click="setLargeText();"/>
</mx:Application>