Non-Visual Component Initialization in MXML With IMXMLObject

Having worked with flex for quite some time now, I still learn something new about the framework nearly every day. Which is great! The other day, I discovered the IMXMLObject interface in flex. Something I maybe should have known already by now, but hey, .. I didn’t :-)

It actually is really simple. If you have some non-visual component, that you want to use from mxml code, it will be the flex framework, that instantiates the component for you. In fact, it will be the mxml compiler, that, from your mxml code using the component, produces a sequence of actionscript statements, that instantiates and set properties on an instance of your component type.

Let us take an example. You build an extremely simple non-visual component, which is simply a class, like this Calculator class:

public class Calculator {
    private var _input : int;

    public function get input() : int {
        return _input;
    }

    public function set input(value : int) : void {
        _input = value;
    }

    public function calculate() : int {
        return _input + 42; // the answer?
    }
}

As you can see, Calculator is a simple ActionScript class with no fance-pancy flex. But, as Douglas Adams have taught us, the right answer is 42, which means this calculator will only return the correct answer when input has been set to 0. If I use it from mxml like this:

    <comp:Calculator id="calculator" input="34"/>
    <mx:Label text="{calculator.calculate()}"/>

It will write 76 in the label, which clearly is wrong. To use the class, the mxml compiler have generated code, that instantitates the class, and sets properties on it after instantiation. What we need, is to have flex call and initialize-like method, after properties have been set. IMXMLObject interface to the rescue. Here is the revised class:

public class Calculator implements IMXMLObject {
    private var _input : int;

    public function get input() : int {
        return _input;
    }

    public function set input(value : int) : void {
        _input = value;
    }

    public function calculate() : int {
        return _input + 42; // the answer?
    }

    public function initialized(document:Object, id:String):void {
        _input = _input - _input; // advanced pre-calculation based on properties
    }
}

An now, it correctly outputs 42 as its result. The mxml compiler is “tasting” on the component class, and calling the initialized method after properties has been set, to give the component instance a chance to initialize itself.

Apart from the fact, that this seems to be one of the extremely bad named interfaces in the flex api, it is also quite useful.

July 23, 2008  Tags:   Posted in: Programming, Rich Internet Applications

3 Responses

  1. Tristan - August 1, 2008

    Very confusing example – based on your code, 76 is indeed the correct answer, the fact that you want it to be 42 is not shown here. And then, why wouldn’t initialized() just set _input=0 instead of subtracting an integer from itself? And what’s the point of allowing “input” to be set if you don’t want it? Makes no sense. But I see how initialized() might be useful for cases that do make sense, and I know this was just an example of that :) Thanks!

  2. polesen - August 2, 2008

    @Tristan: You are right. The example was bad. Sorry.

  3. BetaDesigns( Blog ).toString( ); » IMXMLObject for non visual components - August 18, 2009

    [...] links livedocs smashedapples techper Comments (0) « DataBinding doesnt work with Vectors [...]

Leave a Reply