Flex 3:Feature Introductions: Window Component
From Adobe Labs
Windows, windows, windows!
Adobe AIR provides the ability to have multiple windows. Until now, however, there has not been any way to use Flex to layout any windows but the first one. In this latest release of Flex, we've added the ability to use Flex to create, lay out, and manipulate as many windows as you want.
In Adobe AIR, the operating system's windows are represented by a NativeWindow class. Since this class is not Flex-aware, it doesn't provide the layout and other features that Flex developers (including you, presumably) demand. To give you multiple windows and Flex layout capabilities, we've created two components you can use for your AIR applications. They contain the raw ActionScript NativeWindow, but provide Flex-friendly functionality.
<mx:WindowedApplication>
This component should be the root of your initial window. It serves the same function that Application provides a traditional web-based Flex app, but with additional window-awareness.
<mx:Window>
This should be the root component of any additional windows. It provides the same access to the underlying NativeWindow as WindowedApplication, but with additional access to the window's initialization options.
Here's how to use them:
File: MyWindow.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Window xmlns:mx="http://www.adobe.com/2006/mxml" transparent="false" systemChrome="standard"
backgroundColor="#FFFFFF" width="400" height="400" layout="vertical">
<mx:Label text="hello world"/>
</mx:Window>
File:windowTest.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" width="500" height="400">
<mx:Button click="openWin()" label="open window"/>
<mx:Button click="renameWin()" label="rename window"/>
<mx:Script>
<![CDATA[
private var myWin:MyWindow;
private function openWin():void
{
myWin = new MyWindow();
myWin.title = "hello window!";
myWin.maximizable=false;
myWin.open();
}
private function renameWin():void
{
myWin.title="hi, there, world";
}
]]>
</mx:Script>
</mx:WindowedApplication>
Initialization options: NativeWindows have a set of initialization options that can only be set before the NativeWindow is actually created. Some of these are available to <mx:WindowedApplication>, but can only be set in the application.xml descriptor file:
systemChrome, which controls whether the window uses standard system-generated chrometransparent, which controls whether the window background is transparent
In addition to providing ActionScript and MXML access to those properties, <mx:Window> adds the following init options:
type, which specifies what kind of window gets createdmaximizable, which specifies whether window is maximizableminimizable, which specifies whether window is minimizableresizable, which controls whether the window can be resized via user interaction
With a component based on <mx:Window>, you can specify these options either in ActionScript (as with maximizable in the example above), or in the <mx:Window> tag in MXML, as with transparent. In either case, once you call window.open(), these options can no longer be changed.
Usage Notes:
One tricky part of Window and WindowedApplication is specifying the size of the window. Setting the height and width of the MXML component will set the stage height or width. If you are using systemChrome, the actual window size will be larger than the height or width you specify. If you wish to specify the size of the window, including all chrome, set bounds of the window's nativeWindow. For example, if your window variable is myWindow, you'd specify something like myWindow.nativeWindow.bounds = new Rectangle(200, 200, 800, 600);
The recommended pattern for WindowedApplication is to specify <visible>false</visible> in the application.xml. By default, the WindowedApplication will then become visible after its layout is complete. It will dispatch a "show" event at that point. If you do not wish your WindowedApplication to ever become visible, specify visible="false" in the MXML tag.
Closed Windows are do not automatically disappear from memory. The window object will still exist, it will not have a visible presence. You can check to see if a Window is closed by checking its closed property. Closed Windows cannot be reopened.
