- Windows in Adobe AIR
- Creating Windows Using NativeWindow
- Creating Windows Using mx.core.Window
- Getting a Window Reference
- Window Operations
- Understanding Window Events
- Creating Custom Window Chrome
- Summary
Creating Windows Using mx.core.Window
The Adobe Flex mx.core.Window class essentially wraps NativeWindow and facilitates the addition of Adobe Flex content. As an Adobe Flex developer, you will find yourself using this class to create windows in most cases.
The steps to creating a Window differ slightly from NativeWindow:
- Create an instance of Window.
- Set Window properties (optional—there are defaults).
- Open the Window on the Screen.
Let’s take a look at a simplistic example of instantiating a Window instance and opening it onscreen. (See Listing 5.2)
Listing 5.2. Simple Example of Using mx.core.Window
<?xml version="1.0" encoding="utf-8"?> <mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="middle" horizontalAlign="center"> <mx:Script> <![CDATA[ import mx.core.Window; private function openWindow():void { var myWindow:Window = new Window(); myWindow.systemChrome = NativeWindowSystemChrome.STANDARD; myWindow.type = NativeWindowType.NORMAL; myWindow.open( true ); } ]]> </mx:Script> <mx:Button label="Create Window" click="openWindow()" /> </mx:WindowedApplication>
Creating an Instance of Window
Using the Adobe Flex Window class, we create an instance:
var myWindow:Window = new Window();
Notice there is no NativeWindowInitOptions object passed into the constructor of Window. You can now set those same properties directly on the Window instance itself, as you will see demonstrated in the following section.
Setting Window Properties
Using mx.core.Window differs from NativeWindow in that we can set all parameters after it has been instantiated. The one exception is the nativeWindow property of Window; this is not accessible until we open it onscreen.
To create a window using mx.core.Window, do the following:
var myWindow:Window = new Window(); myWindow.systemChrome = NativeWindowSystemChrome.STANDARD; myWindow.type = NativeWindowType.NORMAL;
As with NativeWindow, you have the same options to choose from with regard to both the chrome of the window instance and the window type. There are some differences in the results of these options which we’ll take a closer look at now.
Chrome Options for mx.core.Window
Creating a Window with standard window chrome yields the same result as with NativeWindow. After all, mx.core.Window is essentially a NativeWindow primed to host Adobe Flex content. The only visual difference visually is the gray background, which represents the Adobe Flex content area (see Figure 5.5).
Figure 5.5 mx.core.Window of type NORMAL with standard system chrome.
Figure 5.6 mx.core.Window of type UTILITY with standard system chrome.
Figure 5.7 mx.core.Window of type NORMAL with NONE system chrome. By default Adobe Flex displays its own chrome.
Figure 5.8 mx.core.Window of type UTILITY with NONE system chrome.
Figure 5.9 mx.core.Window of type LIGHTWEIGHT with NONE system chrome.
At times, you will still need to access the underlying NativeWindow properties. For example, moving a window from one location onscreen to another requires setting the x and y coordinates of NativeWindow (see Listing 5.3). You won’t find those properties on the parent mx.core.Window class.
Listing 5.3. Referencing nativeWindow Properties When Using mx.core.Window
var myWindow:Window = new Window(); myWindow.systemChrome = NativeWindowSystemChrome.STANDARD; myWindow.type = NativeWindowType.NORMAL; myWindow.open( true ); myWindow.nativeWindow.x = 100; myWindow.nativeWindow.y = 100;
Opening a Window Onscreen
Finally, to open a Window onscreen, use the open() method. Although the Window defaults to “active,” you have the option to change this via a Boolean passed in with the method call as follows:
newWindow.open( true );
Passing false into the open method will cause the Window to open but not make it active. In other words, give the window focus.