In a project, I’m using a TextArea control because it’s better at displaying images inline using the htmlText property — the Text control completely failed. But once I did this, I kept finding the text getting clipped.

TextArea controls expect that they’ll have a fixed or percentage width and height. Most of the suggestions I’ve seen require the use of getTextMetrics() for the mx_internal textField control of the TextArea. This fails miserably if there is any font sizing or inlined images in the html.

This (placed in creationComplete) works nearly perfectly:

protected function onCreationComplete(event:Event):void
{
	//textAreaControl is the id of the control you want to resize to contain it's text.
	textAreaControl.validateNow() ;
	textAreaControl.mx_internal::getTextField().autoSize = TextFieldAutoSize.LEFT ;
	textAreaControl.mx_internal::getTextField().validateNow();
	textAreaControl.height = textAreaControl.mx_internal::getTextField().height ;
}

It would be just as easy to subclass the TextArea control and apply this on set htmlText().

One minor error with this is that before creationComplete is run, the text is briefly visible in it’s unsized state. If you’re using this in a subclassing situation, no worries, but if you’re applying this from a parent->child situation, you’re going to have to handle the appearance changes (but that’s fairly obvious — just felt it needed qualifying).

Hope that helps someone out.

Update:

Created the class in the comments below, figured I’d update the article:

package us.aut0poietic.controls.text
{
	import flash.text.TextFieldAutoSize;
	import mx.core.mx_internal;
	import mx.controls.TextArea;
;

	public class AutoSizeTextArea extends TextArea
	{
		public function AutoSizeTextArea()
		{
			super();
		}
		override public function set text(value:String):void
		{
			super.text = value ;
			updateSize() ;
		}
		override public function set htmlText(value:String):void
		{
			super.data = value ;
			updateSize() ;
		}
		override protected function commitProperties():void
		{
			super.commitProperties() ;
			updateSize() ;
		}
		protected function updateSize():void
		{
			if(mx_internal::getTextField() != null)
			{
				validateNow() ;
				mx_internal::getTextField().autoSize = TextFieldAutoSize.LEFT ;
				mx_internal::getTextField().validateNow();
				this.height = mx_internal::getTextField().height ;
			}
		}
	}
}

I sub classed AdvancedDataGrid, but came up with all sorts of problems that made it unfeasible. Then on another post telling me how to sub class DataGrid (not even ADG), I saw a simple little bit of code that did nearly exactly what I wanted:

private var previousIndex:int = -1;
private function confirmEdit(event:AdvancedDataGridEvent):void
{
	if (previousIndex != event.rowIndex)
	{
    	previousIndex = event.rowIndex;
    	event.preventDefault();
	}
}

PAINFULLY easy. The poster didn’t link to their site, or I’d cite the source here, but wherever you are “pinto” I owe you one.