Controlling Stage scaling

When the portion of the screen representing Flash Player or AIR is resized, Flash Player or AIR automatically adjusts the Stage contents to compensate. The Stage class’s scaleMode property determines how the Stage contents are adjusted. This property can be set to four different values, defined as constants in the flash.display.StageScaleMode class.

For three of the scaleMode values (StageScaleMode.EXACT_FIT, StageScaleMode.SHOW_ALL, and StageScaleMode.NO_BORDER), Flash Player and AIR will scale the contents of the Stage to fit within its boundaries. The three options differ in determining how the scaling is accomplished:

• StageScaleMode.EXACT_FIT scales the SWFproportionally.

• StageScaleMode.SHOW_ALL determines whether a border appears, like the black bars that appear when viewing a wide-screen movie on a standard television.

• StageScaleMode.NO_BORDER determines whether thecontent can be partially cropped or not.

Alternatively, if scaleMode is set to StageScaleMode.NO_SCALE, the Stage contents maintain their defined size when the viewer resizes the Flash Player or AIR window. In this scale mode only, the stageWidth and stageHeight properties of the Stage class can be used to determine the actual pixel dimensions of the resized window. (In the other scale modes, the stageWidth and stageHeight properties always reflect the original width and height of the SWF.) In addition, when scaleMode is set to StageScaleMode.NO_SCALE and the SWF file is resized, the Stage class’s resize event is dispatched, allowing you to make adjustments accordingly.

Consequently, having scaleMode set to StageScaleMode.NO_SCALE allows you to have greater control over how the screen contents adjust to the window resizing if you desire. For example, in a SWF containing a video and a control bar, you might want to make the control bar stay the same size when the Stage is resized, and only change the size of the video window to accommodate the Stage size change. This is demonstrated in the following example:

// videoScreen is a display object (e.g. a Video instance) containing a 
// video; it is positioned at the top-left corner of the Stage, and 
// it should resize when the SWF resizes. 
 
// controlBar is a display object (e.g. a Sprite) containing several 
// buttons; it should stay positioned at the bottom-left corner of the 
// Stage (below videoScreen) and it should not resize when the SWF 
// resizes. 
 
import flash.display.Stage; 
import flash.display.StageAlign; 
import flash.display.StageScaleMode; 
import flash.events.Event; 
 
var swfStage:Stage = videoScreen.stage; 
swfStage.scaleMode = StageScaleMode.NO_SCALE; 
swfStage.align = StageAlign.TOP_LEFT; 
 
function resizeDisplay(event:Event):void 
{ 
    var swfWidth:int = swfStage.stageWidth; 
    var swfHeight:int = swfStage.stageHeight; 
 
    // Resize the video window. 
    var newVideoHeight:Number = swfHeight - controlBar.height; 
    videoScreen.height = newVideoHeight; 
    videoScreen.scaleX = videoScreen.scaleY; 
     
    // Reposition the control bar. 
    controlBar.y = newVideoHeight; 
} 
 
swfStage.addEventListener(Event.RESIZE, resizeDisplay);