Tutorial details: Loading Images Via XML into Flash MX 2004
Difficulty Level: Intermediate
Requirements: Flash MX 2004
Assumed Knowledge: Having read the associated CSS in Flash & Flash/XML tutorials
File(s) to Download: imagesxml1.zip
Online Example: None (example is embedded in tutorial)
Loading Images Via XML into Flash MX 2004
In my previous tutorial (the one catchily titled "Loading External XML formatted Content [into Flash MX 2004]") I mentioned that I would be covering
how to load images into Flash via XML and so I'm here to make good on that promise.
If you spend 99% of your free time infront of the computer as I do, then your social life will invariably suffer, and don't fool yourself -
SexyGurl_1979 who you've been chatting to on ICQ for the last two months is really a balding middle-aged male janitor from Basingstoke - and you
were foolish enough to give out your address? Ha ha! So, with this in mind what better use could there possibly be for loading images in flash than
trying to find yourself a 'real' girlfriend or boyfriend?
Loading a picture in to Flash
In Flash Player 7 and later you can use the <img> tag to embed JPEG files, SWF files, and movie clips inside dynamic and input text fields.
This tag is supported only in dynamic and input text fields that are multiline and wrap their text. The Flash Player does not support progressive
JPEG files. If you have problems loading a jpeg it may possibly be because it's been saved in a progressive format, so use a another random test-image to
work out whether this is the issue or not.
If we were keeping all of our code inside of Flash then to load a simple image into a textfield we would do something like this:
myTextBox.htmlText = "This is a picture of my best feature: ";
myTextBox.htmlText += "<img src='backofhead.jpg'>";
This assumes you've got an html-enabled dynamic textbox and you're loading an image called "backofhead.jpg" in to Flash.
If you're loading the image into a TextArea component of the same name you would use myTextBox.text and not myTextBox.htmlText
Pictures can only be aligned left or right of the textbox. The default value is left, and if you have a fair bit of text then it should automatically wrap around the image. What you may find however,
is that when you test your movie on the web you experience problems. This is because pictures don't load instantaneously, and so what happens is that the text loads,
doesn't wrap (because it has nothing to wrap around), and then the picture loads over the text, and it all looks a horrible mess.
Never fear, you can reserve the space that the image will take up by specifying the width and height attributes for your image tag, just like you do in HTML. You will see this in the example.
Something to note about the above code is the use of quotation marks. The whole line is enclosed in double quotes, so for the SRC attribute I used single quotes, so as not to confuse the Flash parser.
If you like you could use the escape charater (\) instead like this:
"This is a picture of my best feature:
<img src=\"backofhead.jpg\">";
|
