Code Zen

Earlier I had asked if anyone had any Flex questions I could ask Jeff Tapper when he came by to train the group, and a few people did. Unfortunately, the last day I had a major meeting maelstrom (try saying that three times fast) and so I didnt get to work on any of the cool stuff (but the rest of the team did and that was the point for the most part anyway). But I did ask a couple of questions that were posted. I do apologize for taking a week for putting these up but its been a crazy week.

Paul Rangel asked:

So turns out the entire group has never written a custom preloader before (oh the shame!), but the idea of not being able to use the loaded data baffles the mind. Probable solution: Use a singleton class with no strings to the Flex framework to load the data and reference it in the application when the application is initialized. Go completely native and use the URLLoader and the URLRequest objects if you have to (I am not sure if HTTPService has any dependencies on the SystemManager being ready). And do let us know how that works out. If anyone else has seen the same issue or has a solution, please drop me/us a comment as well.

SmackDaddy asked :

So we wasnt sure about this. If the idea was to catch an error at ANY time, then wrapping your app in an uber-try/catch block was a possibility (ugh), although I dont think that would work for async httpService calls will it? However I dont think there is any official way to handle global exceptions.

Again, none of us have an answer to this since we hadnt ever done it. But I can imagine a solution where you load node data only when required and since the performance of such an app would suck, you could try an aggressive strategy where you load one subsequent node worth of data (other than the ones open) and when a user opens a node, you fetch another node down as well, the idea being you keep fetching data for nodes that the user may open next. The retrieved data can be then spliced into the dataProvider of the tree. I’ll try to dig up a link that also talked about data refresh without closing the whole tree (which seems to be Flex’s way of handling a change in the dataProvider)

I guess most of the answers here are “umm…., we could try …”. If any readers have the answers then please feel free to comment.

-cheers

Like I had mentioned in my earlier post, the Flex team at Comcast Interactive Media in undergoing a training for three days on all things Flex with Jeff Tapper (of the Adobe Flex Training from the Source book fame). I have been in and out for the most part but the team seems to have absorbed a lot.

Here is a quick list of things that I learnt:

Using [style] metatags to create accessable styles:
By just putting the [Style] tag, you can make the styles available to you (well, more visibly anyway). You can also add the inherit=yes value in the style definition and the style will get picked up from the parent’s style values. Something a lot more interesting that I was looking for is the StyleManager.registerParentSizeInvalidatingStyle method that forces the parent to measure itself when a style value could potentially grow the component to a larger value needing the parent to do the same.

Using BindingUtils and the ability to bind to events:
I have never done the latter (weird I know). However it seems if you but the bindable metatag with the event name on top of a function, that function is called whenever that event is fired. Since we didnt specify a target (source) of the event, does this event get fired anytime anyone fires that event? I am still not sure.

Using namespaced XML:
If an XML file has namespaced nodes, you cant access those nodes until you include that namespace in the XML definition. To do that you would create a namespace variable and then use that to reference the namespaced nodes:

For example

x:XML = …
var rdf:Namespace = new Namespace(“http://rdf……”)
var dirvalue = xml.rdf::Directories
Note the use of the ::

Using ASyncToken:
This is returned from the HttpService call. It acts as a token for the call and can be used to attach fault and result functions to. I have never used it. Interestingly the Flex source code doesnt including the rpc package so I have no idea how its created.

Event Lifecycle:
We saw the difference between the event.target and the event.currentTarget. Also what was really useful was figuring out the event.stopPropagation and the event.stopImmediatePropagation. The former stops the event from going anywhere up the Displaylist but if you have two event listeners added to the same displayobject, both will get the event if you only use stopPropagation, but if you use stopImmediatePropagation, you can intercept the event preventing it from going any further even to other listeners on the same node in the DL. This property can get more useful when you use event priorities to register listeners.

Modules
Ran through a simple example of using modules especially using the -link-report and the -exclude-externs compiler directives to make sure the modules only compile whats needed. Apparently this gets easier in Flex 3.

These are just my notes, since most of the other stuff we talked about I already know ;). More stuff here tomorrow.

I have seen a couple of posts recently from people looking for some information on integrating AS2 and AS3 code. I recently worked on a project that I ended up spending quite a few hours trying to get some things to work right so I figured I should post about it. Hopefully someone will find it useful.
So I wrote a Flex application that I was able to knock out fairly quickly. The core framework really made a lot of the grunt work disappear and I was pretty pleased with what I had. It was only when I was done with the application itself was I informed that the application was supposed to be loaded in an AS2 swf. Ah well, I could always loadmovie it.
Wrong.
AS2 swfs cannot loadmovie AS3 swfs. I guess the swf headers dont get recognized by the Flash Player and the AVM2 doesnt startup. So we had to find a workaround to that. I was hoping Javascript popups would work but that was unacceptable user experience. So we went back to the drawing board. The other option seemed loading the existing AS2 base swf using an AS3 basic loader as the root. It worked well for a few initial scenarios but soon hit a wall since there were _root references all over some of the AS2 code and the root loader killed all that functionality (For those who still do so, please STOP using _root in your code !!!).
Just when I was ready to quit and about to just port the whole app to AS2, I tried going completely out of the flash player to get my application to show up on top of the base swf. Go html positioning. I ended up writing both the swfs into 2 separate divs using swfobject and then absolutely positioning the base swf and relatively positioning the container with the Flex application on top of it.

The css styles looked like this:
[css]
#div1{
position: absolute;
margin:0px;

width:100%;
height:100%;
}

#div2{
width:500px;
height:360px;
position: relative;
margin-left: auto;
margin-right:auto;

}
[/css]

Works pretty well :).

After being involved with AS3 and Flex for so long, I think I am now at a point where I have a really good understanding of the Flex framework. So when I was asked to build this online app, I immediately started it with Flex and before long had most of it working. However, the application was supposed to be a subcomponent of a larger AS2 project and was supposed to be loadmovie-ed. I didn’t realize till too late that AS2 swfs actually cannot loadmovie AS3 swfs (well Flex for sure, not sure about AS3 but doubt that too). This definitely left me feeling very ‘d-uh’. We ended up working around this by creating an AS3 base swf that loads the AS2 swf and then when the sub-app was supposed to be loaded, the AS2 swf told the base movie to do so via LocalConnection. This is definitely a hack but I couldn’t think of any other way to get this to work.

If anyone is aware of this or has successfully managed to load an as3 swf into an as2 swf via loadmovie, do drop me a comment. For others, be careful what you loadmovie ;).