10 Replies Latest reply on May 13, 2009 8:50 PM by DigitalSpeciaist

    Dynamically resizing TextArea without scrollbars

    DigitalSpeciaist

      There is an example of a dynamically resizing TextArea without scrollbars on the link below, but it does not work with htmlText, only regular text.

       

      Any suggestions on what changes to make to the code to get this to work with htmlText?

       

      This is link with the example:

      http://www.adobe.com/cfusion/communityengine/index.cfm?event=showdetails&postId=13628&prod uctId=2

       

      thanks.

        • 1. Re: Dynamically resizing TextArea without scrollbars
          Gregory Lafrance Level 6
          Maybe this:
          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 htmlText(val:String):void{
                textField.text = 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 htmlText():String{
                  return textField.text;
              }
              override public function set maxHeight(value:Number):void{
                super.maxHeight = value;
              }
            }
          }
          • 2. Re: Dynamically resizing TextArea without scrollbars
            DigitalSpeciaist Level 1

            Thanks, Greg. That's it, quick and easy.

            • 3. Re: Dynamically resizing TextArea without scrollbars
              DigitalSpeciaist Level 1

              A little pronlem: now it not rendering my HTML text as HTML, it is rendering my htmlText as text.

              • 6. Re: Dynamically resizing TextArea without scrollbars
                DigitalSpeciaist Level 1

                I change the two lines below:
                1. This: textField.text = val        to this:  textField.htmlText = val;

                2.  This: return textField.text;     to this:  return textField.htmlText;

                 

                 

                Here we go:

                 

                import flash.events.Event;

                import flash.text.StyleSheet;

                 

                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 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 htmlText():String{

                        return textField.htmlText;

                    }

                    override public function set maxHeight(value:Number):void{

                      super.maxHeight = value;

                    }

                 

                 

                }

                • 7. Re: Dynamically resizing TextArea without scrollbars
                  Gregory Lafrance Level 6

                  Great, thanks. I wrote the original Cookbook entry, so I'll update it now.

                  • 8. Re: Dynamically resizing TextArea without scrollbars
                    Gregory Lafrance Level 6

                    If my posts answered your question, or helped, please mark it as such.

                    • 9. Re: Dynamically resizing TextArea without scrollbars
                      DigitalSpeciaist Level 1

                      Thanks very much, Greg. I forgot signoff your answer as correct, but i just did.

                       

                      By the way, that was an excellent example on the Flex Cookbook site, did you write many of the articles there. I love that site.

                      • 10. Re: Dynamically resizing TextArea without scrollbars
                        Gregory Lafrance Level 6

                        I don't write as many articles as I could/should, but it is a great site. Sometimes I just go there and examine the latest posts. People put some wild code examples up there.