Recently I’ve run into the problem of controlling the size of an embedded swf movie in a Flex application. The size of the stage in Flash didn’t match the size of the SWFLoader-loaded component in Flex for some reason. I tried putting a Canvas around it and using the clipContent field, but that didn’t. After a few hours of pain, though, I did get a somewhat reasonable solution.
This post should also serve as a very light example of applying a mask.
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Canvas mask="{myMask}">
<mx:SWFLoader source="path/to/mySwf.swf"/>
<mx:UIComponent id="myMask"
creationComplete="myMask.graphics.beginFill(0xff0000);myMask.graphics.drawRect(0,0,360,541);myMask.graphics.endFill()"/>
</mx:Canvas>
</mx:Application>
Here, the size and location of the rectangle you draw in the myMask determines the visible area of the swf.
I haven’t yet cooked up an actual example showing what this actually does - maybe I’ll do so later…
On a different note, if anyone knows of a quick way (perhaps a wordpress plugin) to post an example coded in Flex Builder, let me know - it would be much appreciated! Right now, I’m bundling a release build and manually pushing it up each time with no regard to specific posts, then hard-linking…
Maybe I’ll write something to do it…knowing me it’ll never get done…
Tags: clipContent, embedded, mask, swf
on 12 Aug 2009 at 1:22 pm William Chadwick said …
The mask is a great idea. You would think that setting ‘clipContent’ to true would fix this or setting scaleContent to true on the SWF loader would fix this. Oh how I hate bugs. Thanks for your post.
on 12 Aug 2009 at 7:47 pm Frank Lam said …
Yea, this one is a little unfortunate, but at least there’s a workaround. I hate having to rewrite Flex components because I wanted 2 pixels of padding on an internal textField or something stupid like that.