AIR application with tool panels in front of other windows

[maguskrool]

Hello. I'm using Flash CS6 on OSX and I'm working on an AIR desktop application. My application opens a local image file in a window, produces some calculations and shows the results in several panels. I want those panels to be like the ones on CS applications, for example. They should always be on top of the image windows. I've tried using the nativeWindow.NativeWindowInitOptions.owner to achieve this, but I can't get the hierarchy right. Any suggestions?

Thank you.

[moccamaximum]

you can always force your UI in front of everyting else with something like:

setChildIndex(UI, stage.numChildren - 1);

[maguskrool]

Thank you. That would imply doing that everytime an image window is clicked, right? Just off the top of my head, I think perhaps with a listener...

[maguskrool]

Having found no other solution so far, I'm using the index manipulation method, but it seems  a nativeWindow can't be added to the stage like other display objects, and therefore you can't use setChildIndex, even if you try to cast it as a DisplayObject. The "equivalent" method is activate() but then I noticed the orderInFront() method. Shame on me for not seeing it sooner. I added event listeners to all the image windows like this:

imgWindow1.addEventListener(Event.ACTIVATE, windowActivated);

imgWindow1.addEventListener(NativeWindowBoundsEvent.MOVING, windowMoving);

imgWindow1.stage.addEventListener(MouseEvent.MOUSE_DOWN, windowMouse);

//At one time also had listeners for Event.DEACTIVATE, NativeWindoBoundsEvent.MOVE and MouseEvent.CLICK, but from my tests I don't need them.

imgWindow1.activate()

toolsWindow.activate();

public function windowActivated($event:Event):void {

     toolsWindow.orderInFront();

}

public function windowMoving($event:NativeWindowBoundsEvent):void {

     toolsWindow.orderInFront();

}

public function windowMouse($event:MouseEvent):void {

     toolsWindow.orderInFront();

}

It works almost perfectly. The only blemish is when you click a window that is behind the tools window, it shows in front for a fraction of a second and then goes back again. This might be because the ACTIVATE event is fired before the others (according to my tests), or maybe it would happen in whatever the case. Still, this is not the most elegant solution, I believe, and I would love to know if anyone else has any suggestions.

Thank you.

[moccamaximum]

The alwaysInFront property seems to overrule the orderToFront method:

If alwaysInFront is false, then calling this method [orderToFront] will not send this window in front of any windows which have alwaysInFront set to true.

[maguskrool]

Yes, but I don't want any windows with alwaysInFront set to true, because that would make them stay on top of windows of all other applications, not jut mine. It would be like having Photoshop panels still appearing if you clicked on another application.

[moccamaximum]

This is the most illustrative "basic" display order tutorial of native windows I found from Adobe.

To get rid of that ACTIVATE-flicker you mention I see no other way than to use alwaysInFront.

You could eventually diminish the disturbing effect by trying to tween the alphachannel during the reset.

[maguskrool]

Thank you.

I have also been looking into the possibility extending the NativeWindow class and overriding the activate() method so it doesn't bring the window to the front, but I'm not sure it's possible and is probably too much work for what I'm trying to achieve.

EDIT: While reading the tutorial you mentioned I got the idea of only temporarily changing the alwaysInFront property. Perhaps if I can change it before the image window goes to the front, I can set it to true on the tools window and have it stay on top for just enough time, then change the property back to false so it won't affect other applications.

[maguskrool · Accepted solution]

It works!

In this example I'm using the main window as for the tool panels. The code is from my document class.

It works!

In this example I'm using the main window as for the tool panels. The code is from my document class.

package {

import flash.desktop.NativeApplication;

import flash.display.MovieClip;

import flash.display.NativeWindowInitOptions;

import flash.display.NativeWindowSystemChrome;

import flash.display.NativeWindowType;

import flash.display.NativeWindow;

import flash.events.Event;

import flash.geom.Rectangle;

public final class MainClass extends MovieClip {

private var _mainApp:NativeApplication = NativeApplication.nativeApplication;

private var _mainWindow:NativeWindow;

public function MainClass() {

     _mainWindow = NativeApplication.nativeApplication.activeWindow;

     _mainWindow.alwaysInFront = true;

     _mainApp.addEventListener(Event.ACTIVATE, appActivated);

     _mainApp.addEventListener(Event.DEACTIVATE, appDeactivated);

}

private function appActivated($event:Event):void {

     _mainWindow.alwaysInFront = true;

}

private function appDeactivated($event:Event):void {

     _mainWindow.alwaysInFront = false;

}}}

Hope this helps someone else.