100% to 100% Flex application preloader positioning

Question

Hello, everyone!

I've got a problem trying to apply a loading animation to my Flex application - a whole browser window occupant. I'm subclassing DownloadProgressBar class as described on Adobe's article about this. stageHeight and stageWidth, reported by base class are incorrect. It says 500x375 pixels in constructor and 0x0 elsewhere. Why?

Answer 1

I'm not sure if this will help but I think its possible to reference the size of the Flex application by using Application.width, Application.height.

http://livedocs.adobe.com/flex/3/html/help.html?content=app_container_2.html

The issues below seem to be related to your issue:

http://www.nabble.com/Stupid-Question---Flex-width-and-height-td21423345.html

http://www.nabble.com/Flex-stage-size-td20167125.html

http://dreamweaverforum.info/flex/125327-referencing-stage-flex.html

Hope they help.

Answer 2

A width/height measurement of 0x0 is often indicative of the component in question not having been fully laid out at the time of the reading (including child components). Checking measurements in the constructor is surely too early. You'll want to check the measurements after you've set the stage to fullscreen and everything you're displaying has been laid out, probably at the applications creationComplete event, perhaps even later. The following link should be a good resource:

http://blog.flexexamples.com/2007/08/07/creating-full-screen-flex-applications/

Answer 3

What you want to do is add an event listener to the stage for its resize event and adjust the size of your preloader accordingly. Otherwise if someone resizes your Flex app while the preloader is displayed it will not resize.

stage.addEventListener(Event.RESIZE, onStageResize);

public function onStageResize(e : Event) : void {
    this.width = stage.stageWidth;
    this.height = stage.stageHeight;
}

Or alternatively you can center your preloader on the stage using code like so:

preloader.x = this.stage.stageWidth/2 - preloader.width/2;

Answer 4

i have code to center my custom progress loader and is working very much fine from this article http://askmeflash.com/article_m.php?p=article&id=7

Answer 5

Hey Artem Have you solved this problem? I have the same problem with my flex app. Stage returns 500x375. My workaround is not pretty. This function is called on FlexEvent.INIT_PROGRESS. So when my application is available i use its props.

private function onFlexInitProgress( event:FlexEvent ):void {
    if (Application.application != null){
        var appWidth:Number = Application.application.width;
        var appHeight:Number = Application.application.height;
        x = (appWidth * 0.5) - (preloaderSWF.width * 0.5);
        y = (appHeight * 0.5);
        preloaderSWF.visible = true;
    }
}

Answer 6

Does anyone happen to know if it is possible to create a fullscreen preloader in Flex? To clarify, the preloader is a fullscreen image that should appear (fade in) before the site itself begins loading.

I have been told by 3 Flex developers that it is not possible, but that seems strange. Any ideas or examples you could point me to?