Working with Text and HTML in Flash

The following is the list of supported HTML tags in Flash:

Anchor tag (<a>) The <a>tag creates a hypertext link and supports the following attributes: href and target. sample_txt.htmlText= “<a href='http://www.devarticles.com' target='_blank'>Visit Dev Articles</a>”; Bold tag (<b>)

The
<b>tag renders text as bold.

sample_txt.htmlText = “<b>Bold Text</b>”;
 

A bold typeface must be available for the font used to display the text.

The <br>tag creates a line break in the text field.

sample_txt.htmlText = "First Line of text. <br>Second Line";

The closing </br>tag is optional, but it is good practice to include it.

The <font>tag specifies a font or list of fonts to display the text and supports the attributes color, face and size.

sample_txt.htmlText = "<font size=’24’ color=’#0000FF’ face=’Arial Black’>This is blue, 24-point text with Arial Black font</font>";

  Image tag (<img>)

The <img>tag lets you embed external JPEG files, SWF files, and movie clips inside text fields and TextArea component instances. Text automatically flows around images you embed in text fields or components. This tag is supported only in dynamic and input text fields that are multiline and wrap their text.

The <img>tags supports the following attributes:

src Specifies the URL to a JPEG or SWF file, or the linkage identifier for a movie clip symbol in the library. This attribute is required; all other attributes are optional. External files (JPEG and SWF files) do not show until they have downloaded completely.

id Specifies the name for the movie clip instance (created by Flash Player) that contains the embedded JPEG file, SWF file, or movie clip. This is useful if you want to control the embedded content with ActionScript.

width The width of the image, SWF file, or movie clip being inserted, in pixels.

height The height of the image, SWF file, or movie clip being inserted, in pixels.

align Specifies the horizontal alignment of the embedded image within the text field. Valid value are leftand right. The default value is left.

hspace Specifies the amount of horizontal space that surrounds the image where no text appears. The default value is 8.

vspace Specifies the amount of vertical space that surrounds the image where no text appears. The default value is 8. 

The <i>tag displays the tagged text in italics.

sample_txt.htmlText = “<i>Italic Text</i>”;

An italic typeface must be available for the font used.

The <li>tag places a bullet in front of the text that it encloses.

<li>One</li>

<li>Two</li>

<li>Three</li>
 

Paragraph tag (<p>)

The <p>tag creates a new paragraph. It supports the following attributes: align and class.

The <span>tag is available only for use with CSS text styles. It supports the attribute class.

The <textformat>tag lets you use a subset of paragraph formatting properties of the TextFormat class within HTML text fields. It supports the attributes blockindent, indent, leading, leftmargin, rightmargin and tabstops.

Using the Text tool, create a dynamic text field that’s approximately 300 pixels wide and 100 pixels high.

1. In the Property inspector, name the instance table_txt, select Multiline from the Line Type pop-up menu, and select the Render Text as HTML option.

2. In the Timeline, select the first frame on Layer 1.

3. Open the Actions panel (Window > Development Panels > Actions), and enter the following code in the Actions panel:

4. //Creates column headers, formatted in bold, separated by tabs

5. var rowHeaders = "<b>Name\tAge\tDepartment</b>";

6.  

7. //Creates rows with data

8. var row_1 = "Tim\t32\tFinance";

9. var row_2 = "Edwin\t46\tMarketing";

10.  

11. //Sets two tabstops, to 50 and 100 points

12. table_txt.htmlText = "<textformat tabstops='[50,100]'>";

13. table_txt.htmlText += rowHeaders;

14. table_txt.htmlText += row_1;

15. table_txt.htmlText += row_2 ;

16. table_txt.htmlText += "</textformat>";

The use of the tab character escape sequence ( \t) adds tabs between each column in the table.

17. Select Control > Test Movie to view the formatted table.

Underline tag (<u>)

The <u> tag underlines the tagged text.

sample_txt.htmlText = “<u>Underlined Text</u>”;