Hack 90 Center Your SWF Without Scaling 
Center unscaled content in the browser window
without using tables or CSS.
Although everyone knows vectors (unlike
bitmaps) do not lose quality when you zoom into them, almost all
commercial Flash sites use a small, nonscaling SWF centered in the
browser. The reasons for this are:
Flash performance is based on the number of pixels that change every
frame. By keeping the SWF movie's area modest and
forcing nonscaling, you are able to create a fast site with a more or
less constant frame rate. You don't want to let the
user scale the SWF up to full screen size (especially 1280 1024 and
larger), because such a large area would make Flash run really
slowly. Many commercial Flash sites use bitmaps, which don't
look good scaled. You should also avoid scaling video. Scaling both reveals
optimization artifacts and slows performance (sometimes drastically),
although Sorenson-encoded video can reduce this problem
significantly. A smaller Stage area requires fewer graphics, and that makes for
smaller bandwidth requirements.
The Stage.onResize(
) listener event allows you to detect
resize events and scale or reposition individual elements in a custom
manner, negating the need for one-size-fits-all scaling.
One of the most commonly asked questions for new users to Flash is,
"How do I generate a nonscaling SWF that is always
centered in the browser?" None of the out-of-the-box
templates under File NewTemplates includes this
option, and even some longtime Flash users instead use an HTML table
or CSS formatting. However, the easiest way to create a centered,
nonscaling SWF is using FilePublish Settings. Simply set
the Horizontal and Vertical options under Flash Alignment to Center,
and set the Scale option to No Scale, as shown in the Publish
Settings dialog box in Figure 11-8.
However, this technique allows off-stage content to be visible.
We'll address this drawback in the next hack, which
uses CSS formatting [Hack #91] .
|
