Understanding resizing and scaling in Flash Catalyst

One of the features in Flash Catalyst CS5.5 is the ability to have applications that resize. But was does that actually mean? The Flex framework has the concept of constraint based layouts. Meaning you can define how your components position themselves as the application resizes. For example you can tell a component, like a button, always to be 10 pixels from the left and 10 pixels from the bottom, no matter what the size of the application.

Resized Version

Scaled Application

This is a different system than what Flash Professional developers might be used to. For most Flash Professional developers, they are used to the concept of scaling rather than resizing. Flash Pro developers would set the scaling of their swf to be 100%, and their content would simply scale to fill the browser window. But what this means is any UI controls, like a button would also scale as the browser window is resized. Before the Flex Framework, many Flash application developers wrote their own resize systems (myself included). Since Flex is designed toward application development (and by extension Flash Catalyst), using a basic scaling solution is not the right choice.

Hope this helps in understanding the difference between resizing and scaling. Here is the source code for each application.


Leave a Reply

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s