How to set SWF object to the background of the Flex 4 Application

Question

I am Creating one application in which I want to set one swf as my application background.
I am able to set background but it is only coming with some area only.
It is not coming in the whole application.
It is not scaled in the whole application background.

I am using 9-slice scaling with that background SWF.

Please Help me....

Answer 1

You haven't told us how and where you add the background, but something like this should work:

stage.addChildAt (background, 0);

For the scaling, add an event listener to the stage to react on Event.RESIZE:

stage.addEventListener (Event.RESIZE, function () : void { 
    background.width = stage.stageWidth;
    background.height = stage.stageHeight;
});

Answer 2

Summary: To accomplish this in a Flex 4 Application you should create a custom Application Skin and add the .swf you want to use as a DisplayObject that sits behind the contentGroup Group.

Implementation:

Create a new skin, eg, SWFBackgroundSkin.mxml, and make sure the skin is set to have a host component compatible with the spark Application class:

<fx:Metadata>
    [HostComponent("spark.components.SkinnableContainer")]
</fx:Metadata>

Next, add an SWFLoader as the first visible element (ie. behind contentGroup ), which will serve as the background:

<mx:SWFLoader source="background.swf"/>
...
<s:Group id="contentGroup" ... />

Finally, in the main Application, set the skinClass:

<s:Application ... skinClass="skins.SWFBackgroundSkin">

assuming the SWFBackgroundSkin.mxml is in the skins package (folder).

Note: You may want to have a look at the default Application skin, spark.skins.spark.ApplicationSkin, first. If you make your new skin from the default one, make sure to either delete the <s:Rect id="background" ... > or at least put the SWFLoader in front of it.