10.29
In AIR , actionscript , flex , flex sdk , mxml | Tags:
The core to do that is WindowedSystemManager class and it’s implementation in our TestWindow.as class.
Have a look how the class is initialized in createChildren() method. The main container here is Canvas but can be anything I think even single button or label I think (didn’t tested out but feel free to check).
package { import flash.display.NativeWindow; import flash.display.NativeWindowInitOptions; import flash.events.Event; import mx.containers.Canvas; import mx.events.FlexEvent; import mx.managers.WindowedSystemManager; [Event(name="creationComplete", type="mx.events.FlexEvent")] public class TestWindow extends NativeWindow { private var systemManager:WindowedSystemManager; private var windowFlexContainer:Canvas; private var childrenCreated:Boolean = false; public function TestWindow(initOptions:NativeWindowInitOptions = null) { var options:NativeWindowInitOptions; initOptions == null ? options = new NativeWindowInitOptions() : options = initOptions; super(options); addEventListener(Event.ACTIVATE, windowActivateHandler); } private function windowActivateHandler(event:Event):void { event.preventDefault(); event.stopImmediatePropagation(); removeEventListener(Event.ACTIVATE, windowActivateHandler); if(stage) { createChildren(); stage.addEventListener(Event.RESIZE, windowResizeHandler); } } private function createChildren():void { if(!windowFlexContainer) { windowFlexContainer = new Canvas(); } if(!systemManager) { systemManager = new WindowedSystemManager(windowFlexContainer); } stage.addChild(systemManager); windowFlexContainer.width = stage.stageWidth; windowFlexContainer.height = stage.stageHeight; stage.addChild(windowFlexContainer); childrenCreated = true; dispatchEvent(new FlexEvent(FlexEvent.CREATION_COMPLETE)); } private function windowResizeHandler(event:Event):void { windowFlexContainer.width = stage.stageWidth; windowFlexContainer.height = stage.stageHeight; } public function get container():Canvas { return windowFlexContainer; } public function destroy():void { removeEventListener(Event.RESIZE, windowResizeHandler); windowFlexContainer.removeAllChildren(); stage.removeChild(windowFlexContainer); stage.removeChild(systemManager); windowFlexContainer = null; systemManager = null; } } }
This is fast typed so there is no way now to fully support flex-mxml work flow and to have children automatically added in code. Maybe I will extend it later to fully support adding mxml content. So now we simply create our TestWindow in mxml and add children manually when component is created.
<?xml version="1.0" encoding="utf-8"?> <local:TestWindow xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:local="*" title="Test MXML" creationComplete="testwindow2_creationCompleteHandler(event)"> <mx:Script> <![CDATA[ import mx.events.FlexEvent; protected function testwindow2_creationCompleteHandler(event:FlexEvent):void { container.addChild(label); } ]]> </mx:Script> <mx:Label x="0" y="0" visible="true" text="Test" id="label" /> </local:TestWindow>
Well this is basic. And unlike mx:Window our component is not extending UIComponent but it’s extending NativeWindow.
To run this component we create simple application with button great job doing button:
<?xml version="1.0" encoding="utf-8"?> <mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:local="*"> <mx:Script> <![CDATA[ import flash.events.MouseEvent; protected function button1_clickHandler(event:MouseEvent):void { var w:Test = new Test(); w.activate() } ]]> </mx:Script> <mx:Button label="open window" click="button1_clickHandler(event)" /> </mx:WindowedApplication>
As you can see when you compile those three classes It’s working :)
Peace.
1 ResponsesLeave a comment ?
Hi,
I am working on an application where components have to added/ removed from the main application window and added to new windows.
The issue I am facing is with Comboboxes,DataGridEvent.COLUMN_STRETCH event behaves very strange, tooltips all show up in the main application window rather than the popped up window.
I am using mx:Windows and mx:WindowedApplication.
Please let me know If you have any thought about it.
For More Detail view:-
http://stackoverflow.com/questions/2507435/air-desktop-application-related-to-window-component-need-some-work-around
Any work around.
Thanks.
Mahesh