Flex mx Image source path at runtime

Question

I'm wading through a Flex AIR desktop project that someone else wrote. The original author has used several mx.controls.Image components. Runtime image paths assigned like this:

image.source = "/assets/book.png";

It doesn't work - I just get the broken image icon.

I've never used the above approach in my own code. Personally, I've always used compile-time embedded images or URLLoader/Loader for runtime images.

So, I'd like to learn how to get this image path approach working.

I wrote a simple test program. Here is my .mxml -

<?xml version="1.0" encoding="utf-8"?>
 <pf:LearningAS xmlns:fx="http://ns.adobe.com/mxml/2009"
      xmlns:mx="library://ns.adobe.com/flex/mx"
      xmlns:pf="com.powerflasher.*">
      <mx:Image id="myImage"/>
 </pf:LearningAS>

Here is my connected .as

public class LearningAS extends WindowedApplication {

    public var myImage:Image;

    public function LearningAS() {
        super();
        addEventListener(FlexEvent.CREATION_COMPLETE, init);
    }

    protected function init(event:FlexEvent):void {
        myImage.source = '/assets/myimage.png';
    }
}

I also added the src/assets folder to AIR package contents. And I added -use-network=false to my compiler directives. (I'm using FDT, and Flex 4.6).

Is this at runtime in debug mode or runtime after you run the installer for your program? — Brian
Running locally in ADL simulator. Both run or debug in the simulator. — Daniel Freeman
What is that connected .as means? You are providing id for mx:Image as myImage and again defining the same myImage in LearningAs. — gbdcool
By the magic of Flex this works. I've connected the .mxml and LearningAS.as by nesting all my mxml inside: <pf:LearningAS.... That syntax with myImage, ensures that the myImage var inside the .as is tied to the <mx:Image id="myImage"/>. — Daniel Freeman

Daniel Freeman Daniel Freeman · Accepted Answer · 2015-09-29T15:14:21

Ok - Cracked it, with some help from the Flex mailing list.

I had to copy my assets folder into my bin folder. So that the paths were relative to the .swf. (Actually, I've done this for previous AS3 projects - but I assumed that packaging assets folder for AIR would cover this.)

Anyway - problem solved.

Flex mx Image source path at runtime

2 Answers