Wondering About Mobile?

Register for our Newsletter on GeoMobile for ArcGIS and mobile location apps.

Our strict privacy policy keeps your email address 100% safe & secure.

Dynamic Sizing of Flex MXML Module

Flex MXML Module Sizing

Working with Flex MXML files can sometimes be challenging.  I was recently asked to take an existing flex component and compile it into an MXML module.  Historically, I’ve used static width and height in my MXML module, but this module needed to be dynamically sized by percent.  I had often wondered how to size MXML modules dynamically, which can be done with other flex components.  My first inclination for a potential solution was to re-size the width and height of the module in the parent containers updateDisplayList.  But I found a good post about dynamic sizing on the Adobe Forum that said you could use the percentHeight and percentWidth properties of the Module (e.g. percentWidth=”100″). I also referenced an article at Adobe LiveDocs called Sizing Visual Components.

Code for Dynamic Sizing of a compiled AS3 Module

Module Loader Code:

<mx:ModuleLoader url="ExampleMod.swf" width="100%" height="100%" />

Module Code:

<mx:Module xmlns:mx="http://www.adobe.com/2006/mxml" percentWidth="100" percentHeight="100" layout="absolute" >
<mx:Panel width="100%" height="100%" title="test panel" />
</mx:Module>

Remember to also set the ModuleLoader width and height properties to 100%.