Image tag
The <img> tag lets you embed external image files (JPEG, GIF, PNG), SWF files, and movie clips inside text fields and TextArea component instances. Text automatically flows around images you embed in text fields or components. To use this tag, you must set your dynamic or input text field to be multiline and to wrap text.
The <img> tag has one required attribute, src, which specifies the path to an image file, a SWF file, or the linkage identifier of a movie clip symbol in the library. All other attributes are optional.
The <img> tag supports the following attributes:
src Specifies the URL to an image 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, GIF, PNG, and SWF files) do not show until they are downloaded completely.
id Specifies the name for the movie clip instance (created by Flash Player) that contains the embedded image 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 values are left and 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.
Italic tag
The <i> tag displays the tagged text in italics
List item tag
The <li> tag places a bullet in front of the text that it encloses
Paragraph tag
The <p> tag creates a new paragraph. You must set the text field to be a multiline text field to use this tag.
The <p> tag supports the following attributes:
align Specifies alignment of text within the paragraph; valid values are left, right, justify, and center.
class Specifies a CSS style class defined by a TextField.StyleSheet object.
Span tag
The <span> tag is available only for use with CSS text styles. It supports the following attribute:
class Specifies a CSS style class defined by a TextField.StyleSheet object.
After these considerations let's go back to our tutorial
4. Create a text file using notepad
copy and paste the following code into notepad
myHTMLdata=<p><b>This is a bold text</b></p><p><i>And this text is in Italic</i></p>This is a <a href="http://www.bbc.co.uk"><u>link</u></a> to the bbc website.<br>Here is a little list of colors :<br><li><font color="#FF0000">Red</font></li><li><font color="#009900">Green</font></li><li><font color="#0000FF">Blue</font></li>Here is a little image that links to the bbc site<a href="http://www.bbc.co.uk"><img src="bird.jpg"></a>
You will notice that the code starts with myHTMLdata=; This variable will be used to retrieve the data once it has loaded in the myLoadVars object (see code below).
Save your file as myHTML.txt
Then on the first frame of the main timeline write the following code :
myLoadVars = new LoadVars();
myLoadVars.onLoad = function() { // the data is loaded in the myLoadVars object as a property of the object
myText.htmlText = myLoadVars.myHTMLdata;
}
myLoadVars.load("myHTML.txt");
We are using the LoadVars class instead of LoadVariables because it is more flexible. We can use the onLoad method of the class to know when the data has finished loading and then populate the text field with the HTML.
If you are not too sure on how to use the LoadVars class check our tutorial here.
