AS3 Flex dynamically loading images does not allow images' id

Question

I need to load dynamically a few images (4-6) so that by clicking on particular image user would invoke particular action. Embedding images solves the problem but at the expense of file size. If I load them dynamically, they lose their ID.

<comps:ExercisesScroller id="scroller" x="300" y="100"
        ex1="@Embed(source='assets/Exerc_1.png')" 
        ex2="@Embed(source='assets/Exerc_2.png')"/>

and so forth this works. But instantiated in CDATA it does not work:

import components.ExercisesSCroller;
private var custScroller:ExercisesScroller;
private function init():void {
    custScroller = new ExercisesScroller();
    this.addElement(custScroller);
    custScroller.ex1 = "@Embed(source='assets/Exerc_1.png')";
}

I thought it should be quite a trivial task, but so far I can't solve it.

Answer 1

You can't use @Embed that way. The last line in your init() function should be something like this:

custScroller.ex1.source = "http://my.server.com/images/theRealImage.png";

This might need some adjustment, since I don't know what the innards of your ExercisesScroller component look like. You might, for instance, have to just take the URL as a string property, and have code inside the component to apply the change to the internal image.

EDIT : By the way, I'm confused about why your code above isn't using a URL to reference the replacement image. A relative path, like you show, assumes the files are local already, but you said you don't want to download them to the end user's machine until you're sure the user wants them. Giving a URL like this achieves the result you want: the image isn't downloaded until you change the image's source property.