So – I’ve got bored of the standard flex preloader.  (Actually the company I’m working at has)  I’ve got away with it so far as the applications I’ve been working on have either been back-end systems or prototypes so the great unwashed (in which I include myself, expecially today as Charlie was up most of the night and I didn’t have a chance for a shower this morning after oversleeping) never saw the grey box.

Don’t get me wrong, as with most flex components the standard design is very nice, just a bit, well, er, basically it looks like a flex app.

As normal I need to thank a few guys for some fantastic posts that put me on the right track : -

Jesse Warden

Ted On Flex

I am Josh

I’m not trying to steal these guys ideas and post them as my own, what I am doing is to write up what I understand here in a way that I can swallow.

Back to custom preloaders.

With all the other framework components it is really easy to apply CSS, skins or images to style them up.  The problem with the preloader is that it is, well it’s preloading the framework.  We have no access to any of the flex framework except for a class called the DownloadProgressBar.  We have this class and the standard flash classes that are available to us in the flash player.

We definately do want to use the DownloadProgressBar, for the reasons explained by Jesse Warden

“Flex’ built in preloader is pretty sweet. It auto-adjusts for your application’s color to stand out, it handles all aspects of preloading. This includes remote shared libraries, fonts, and even deferred classes used in modules. Finally, it deals with the initialization of your Flex application which can possibly take longer than a few milliseconds. ”

There’s no point in us re-writing functions that do the above if they are already in the DownloadProgressBar class, so we only need to worry about displaying something instead of the standard preloader and get some useful information into it.

Lets look at a very simple example, we will load a swf as a replacement for the standard preloader.

Next we’ll look at what we need to do with the Flash FLA to make it’s assets available for Flex.