resize loaded SWF to fit in canvas

3
votes

a .fla is 500 x 300. Inside, content moves OUT of the 500 x 300 stage so that it appears like it hides or moves off of the screen.

.fla complied... loaded into Flex via SWFLoader:

<mx:Conainer width="500" height="300">
       <mx:SWFLoader width="100%" height="100%" />
</mx:Conainer>

Loaded .swf file shows outside of the 500 x 300 Container in Flex.

How can i get it so that only what is INSIDE of the Container is visible?

3
apache-flexflex3resizecanvasswfloader
Do you want the swf to be resized so it will be visible all inside the canvas, or you want to mask all is outside the canvas ? – Adrian Pirvulescu
Adrian, for this problem I would like to mask what is outside the canvas. However, I would also like to know the former solution you mention for my own personal edification, if you wouldn't mind. Thanks. – Tomasz Iniewicz

3 Answers

1
votes

Ok, i figured it out.

<mx:Canvas id="swfHolder" mask="{maskCanvas}">
        <mx:SWFLoader id="swffer" scaleContent="true" />
</mx:Canvas>

<mx:Canvas id="maskCanvas" backgroundColor="#000000"/>

The trick is to use the "mask" property. Note the object doing the "masking" must have a backgroundColor property set. I found this article helpful: link text

0
votes

please use scaleContent="true" in SWFLoader tag.

0
votes
<mx:Conainer width="500" height="300" clipContent="true">
       <mx:SWFLoader width="100%" height="100%" />
</mx:Conainer>

Use "clipContent" property

Flex help for Canvas:

clipContent:Boolean [read-write]

Whether to apply a clip mask if the positions and/or sizes of this container's children extend outside the borders of this container. If false, the children of this container remain visible when they are moved or sized outside the borders of this container. If true, the children of this container are clipped.

If clipContent is false, then scrolling is disabled for this container and scrollbars will not appear. If clipContent is true, then scrollbars will usually appear when the container's children extend outside the border of the container. For additional control over the appearance of scrollbars, see horizontalScrollPolicy and verticalScrollPolicy.