There is a big difference between nativeWindow size and the stage size within an AIR application. Depending on what type of window you are displaying and what OS you are using, the actual size of the stage may vary wildly. This post will cover how to determine the system chrome metrics and resize the nativeWindow in both Flex 4 and AS3. Here is how it works:
My application is a Sudoku puzzle app (320480) and I wanted it to have chrome matching the native OS of the end user. Given I know the stage size, I needed to dynamically measure the system chrome metrics and resize the surrounding nativeWindow to provide a stage properly sized to 320480. My app was written using AS3 but the same problem holds true with apps in Flex or Flash Pro and I have included source for both Flex and AS3 to help you get started.
When applications in AIR initiate, they have a logical process they go through.
1. NativeWindow is built from application.xml running ADL
2. Application constructor is called in SWF
3. During the first frame render, this.stage and this.stage.nativeWindow are available and sized correctly.
To be able to set this.stage.nativeWindow, it needs to be called after the first frame render or else metrics will not be fully set. To make sure, I test for the presence of this.stage and this.stage.nativeWindow in an enterFrame event when using AS3 and in Flex I use the applicationComplete event and everything is ready to go.
ASSUMPTION: We will assume that the width and height properties set in the application.xml are the desired stage size for the app (not nativeWindow size but stage size) and then adjust the nativeWindow larger depending on chome boundaries.
HINT:
AS3: nativeWindow is a property of this.stage
Flex: WindowedApplication has a nativeWindow property but also includes this.stage.nativeWindow. (they are the same object)
To determine the chrome width and height I used this calculation:
var chromeWidth:int = this.stage.nativeWindow.width this.stage.stageWidth;
var chromeHeight:int = this.stage.nativeWindow.height this.stage.stageHeight;
At the start of your application this.stage.width and this.stage.height will be 0!!! If you use this.stage.stageWidth and this.stage.stageHeight it will save you some level of frustration. In Flash the stage.width and stage.height are determined by content (no content they equal 0) but when empty, stageWidth and stageHeight will give you proper values.
Then I add chromeWidth and chromeHeight onto the nativeWindow size to make stageWidth and stageHeight match your content to the pixel.
this.stage.nativeWindow.width += chromeWidth;
this.stage.nativeWindow.height += chromeHeight;
To make this seamless and invisible to the end user, you make the nativeWindow invisible at start-up (the default) using application.xml and making it visible once you set the correct size of the nativeWindow width and height. This way the user does not see the window resize.
In Flex using WindowedApplication the window is made visible when the ApplicationComplete event occurs.
EXAMPLE DOWNLOAD
In this Flex 4 project there are 2 apps, one is AS3 and one is Flex. Simple select one or the other to run it. Both provide a stage that is 250250. To change the size, simple change the width/height values within the application.xml file.