The Text control displays multiline, noneditable text. The control has the following characteristics:

• The user cannot change the text, but the application can modify it.
• The control does not support scroll bars. If the text exceeds the control size, users can use keys to scroll the text.
• The control is transparent so that the background of the component's container shows through.
• The control has no borders, so the label appears as text written directly on its background.
• The control supports HTML text and a variety of text and font styles.
• The text always word-wraps at the control boundaries, and is always aligned to the top of the control.

For complete reference information, see the Adobe Flex Language Reference.

To create a single-line, noneditable text field, use the Label control. For more information, see Label control. To create user-editable text fields, use the TextInput or TextArea controls. For more information, see TextInput control and TextArea control.

The following image shows an example of a Text control with a width of 175 pixels:

Creating a Text control

You define a Text control in MXML by using the <mx:Text> tag, as the following example shows. Specify an id value if you intend to refer to a component elsewhere in your MXML, either in another tag or in an ActionScript block.

<?xml version="1.0"?>
<!-- textcontrols/TextControl.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
  <mx:Text width="175" text="This is an example of a multiline text string in a Text control."/>
</mx:Application>
The executing SWF file for the previous example is shown below:

You use the text property to specify a string of raw text, and the htmlText property to specify an HTML-formatted string. For more information, see Using the text property and Using the htmlText property.

This control does not support a backgroundColor property; its background is always the background of the control's container.

Sizing a Text control

Flex sizes the Text control as follows:

• If you specify a pixel value for both the height and width properties, any text that exceeds the size of the control is clipped at the border.
• If you specify an explicit pixel width, but no height, Flex wraps the text to fit the width and calculates the height to fit the required number of lines.
• If you specify a percentage-based width and no height, Flex does not wrap the text, and the height equals the number of lines as determined by the number of Return characters.
• If you specify only a height and no width, the height value does not affect the width calculation, and Flex sizes the control to fit the width of the maximum line.

As a general rule, if you have long text, you should specify a pixel-based width property. If the text might change and you want to ensure that the Text control always takes up the same space in your application, set explicit height and width properties that fit the largest expected text.