Category: Flex

As I’ve mentioned before, DataSelector is a helpful class when dealing with dynamic components that you want to have react to ever-changing data. Shove a dataProvider in your DataSelector-empowered component, and watch it work it’s magic.

However, what my aritcle didn’t mention was how to utilize DataSelector & modelChanged in the same class. Since DataSelector is a mixin, both in Flex and Flash, it adds methods and properties at runtime. So, if you define a method called “modelChanged”, it’ll get overwritten after you compile; when the SWF runs. You can add an event listener, but this only gets triggered when you initially set the dataProvider to the component, now when the dataProvider itself actually changes.

There are 3 solutions. You can either do what I used to do in Flash, and that is create a base class that implements DataSelector for the sole purpose of being extended; like the List component does via ScrollSelectList.

That solution isn’t very practicle in Flex. Because of the elegant way inhertiance is implemented in Flex, you would lose a lot of the power from extending some of the other container classes, such as VBox, Panel, etc. One way to solve that is to use composition with proxy functions; import your DataSelector-empowered component (like a Lits for example), and merely proxy all function calls. That would require, however, ardous amounts of coding which is redundant since the mix-in already adds those methods at runtime.

The third way, which is more relevant for Flex, is to simply re-direct the modelChanged event to point to your own. Since mixins by their very nature affect the prototype, you might as well play by the same rules since you are already pretty low-level. They will not be such big players in AS3, but until Spring of 2006, here’s what you can do for deployable apps right now.

public static var mixinModifyCall = mixinModify();

private static function mixinModify():Void
{
        YourMXMLComponent.prototype.oldDataSelectorModelChanged = YourMXMLComponent.prototype.modelChanged;
        YourMXMLComponent.prototype.modelChanged = function()
        {
                this.oldDataSelectorModelChanged.apply(this, arguments);
                this.onModelChanged.apply(this, arguments);
        };
}