Best practice for XML-fed widgets

[raffjones]

Hi guys,

I'm just wondering what the best approach is for building a screenful of expandable widgets in Flash, in terms of keeping track of dimensions, position, loading status etc. The only slight complication is that the layout of the widgets and the content that populates each one of them, as well as the assets file required to build them graphically, are loaded independently.

I have read that many architects prefer to have their Mediators as "dumb" as possible, so I don't want my WidgetMediator doing too much work to create them, but at the same time, I don't want any individual view components flexing their little muscles too much either, as that would just be contrary to what I think PureMVC is all about.

I'm trying to figure out how a data proxy can fit into the equation to keep track of everything.

The app loads a single config file, which then contains paths to 2 things:

1. a shared library which includes fonts (no widgets can even be initialised until this happens)
2. a path to the "widget list" - which in turn contains the setup for each widget, and a path to its XML feed.

Should I use a Proxy to create a "virtual layout" as various responses are received, and sending a notification when enough data has been received to create something visual? Or is it OK to have a Mediator picking up on the relevant notifications (such as config loaded, widget list loaded, assets initialised etc.) and doing the layout work itself?

Any advice welcome. I'll be happy to share source code when the app is complete.

Cheers

SJ

[puremvc]

Assuming the process is as simple as load widget combine it with its info and pass it to the view to be placed into the view hierarchy.

You may want to create a VO that carries the loaded widget and all its config info. the proxy loads the widget list then loops through, laoding the widgets and creating the widgetVOs sending them in an INJECT_WIDGET note, picked up by the appropriate Mediator
If these widgets are all siblings in the view hierarchy then one Mediator will be interested and do all the placements.

You may have different mediators throughout your view hierarchy, and some are interested in placing some widgets and others place the rest.

In that case you need to devise a set of 'type' strings that say where each widget goes.

For instance some widgets might go in a 'toolbar'. So in the xml that was loaded describing these widgets, add a 'type' attribute of 'toolbar'. The proxy creates the VO with the widget and all its info then sends an INJECT_WIDGET note with the VO as the body and 'toolbar' as the type.

The mediators that are interested in the INJECT_WIDGET note should now look at the note type (note.getType()) and only act if it is the type they are looking to place. In this case, the ToolBarMediator would be the only one to respond, taking the widget from the VO and adding it to its view component, the toolbar.

-=Cliff>

[raffjones]

Thanks a lot, Cliff... some useful ideas here.

My layout uses a single "canvas" of three columns. The XML specifies which "slot" a widget should go into (via attributes ie. column="1", row="2").

I'm using "WidgetType" definitions to determine which class of widget to create -  for example, VIDEO would create VideoWidget, RSS creates an RssWidget and so on, all of which extend a "BaseWidget" class, making use of the flash.utils.getDefinitionByName() method which turns strings into Class references.

The only complication is that these widgets have varying default sizes, and once their content loads (an RSS feed for example), they generate their display and some will expand or contract to fit, moving everything below them in their column if need be. I can expand a story in, say, the "NewsWidget" which would move everything below it downwards.

I've had no problem generating the widgets and adding them to the view. It is the maintenance of the overall column heights and positioning of the widgets themselves that I am struggling with... in terms of who should be looking after all that - the proxy, the mediator or the WidgetCanvas view component that contains the actual visual elements?

I will investigate further, and thanks again for your advice... Great to have the main man taking such an interest in the PureMVC posse at large!

From snowed-under London, warm regards

SJ

[puremvc]

Snowed under here as well today. Brrh!

Based on my earlier suggestion I would put those values on the WidgetVO used to carry the Widget to its destination in the view. So the VO is basically carries all the 'meta' info about the widget.

Then the view component that the WidgetVO is passed to would pluck the VO out and put it where it needs to go and size it appropriately.

Although it's not visually carrying a component, take a look at the EmployeeAdmin demo and how the UserVO is set on the UserForm component, where the data on the VO is distributed to the fields for editing. This is done by binding, but in the UserForm, but your receiving component could have an 'injectWidget' method that takes a WidgetVO and uses the meta info to handle it appropriately.

-=Cliff>