34 Replies Latest reply on Apr 27, 2009 4:06 PM by Flex harUI

    Popupmanager display issue in AIR

    TrinityPlanet Level 1

      Hello Everybody!!

      I am working on an application where components have to be added/ removed from the main application window and added to new windows.
      The issue I am facing is with Comboboxes, tooltips (popupmanger impl) show up in the main application window rather than the popped up window. I am using mx:Windows as the popup window and mx:WindowedApplication as the main application window
      For now it a stop ship. Any response is highly appreciated.

       

      Thanks & Regards

      Vandana

        • 1. Re: Popupmanager display issue in AIR
          Flex harUI Adobe Employee

          I would avoid moving components to different Windows.  If that's your only way, for ToolTips find a way to call destroyToolTip on existing ToolTips.  ComboBox should handle it correctly, but I doubt there's been lots of testing of that.  If you are popping things up with PopUpManager yourself, be sure to specify the second parameter correctly.

           

          If it were me, I'd just make new instances of the components and copy their properties or better yet, wire them up to the same data model.

           

          Alex Harui

          Flex SDK Developer

          Adobe Systems Inc.

          Blog: http://blogs.adobe.com/aharui

          1 person found this helpful
          • 2. Re: Popupmanager display issue in AIR
            Michael Borbor Level 4

            I think you'll need to post at least a little bit of the code that is giving you troubles.

            1 person found this helpful
            • 3. Re: Popupmanager display issue in AIR
              TrinityPlanet Level 1

              Thanks for your reply.

              The significant requirement for the application is to move components across windows and the main app.

              I assume creating new controls would be resource intensive,  maintaining the states and properties for 10 windows.

              I have also created custom combo boxes and giving appropriate second parameter but this doesnot solve the issue.

              Please let me know if you think there is any other alternative solution to it.

              • 4. Re: Popupmanager display issue in AIR
                TrinityPlanet Level 1

                I would like to post the code , but its just not one piece of code. The problem is with tootips and comboboxe's or using any popupmanager impl.

                Let me give you some more details. The windowed application is the main application where some of the widgets containing comboboxes are added.

                Now the user can pull out the widgets into a window, they can drag out the widgets to mx:window. The issue arises when we try to click on the combo, or mouseover to get the tooltip. The tooltip and combo dropdown comes up in the main app window rather than the mx:window.

                Please let me know If you have any thought about it.

                • 5. Re: Popupmanager display issue in AIR
                  Flex harUI Adobe Employee

                  If you destroy the dragged component and replace it with a new instance, there should be no significant change in resource usage.  It might take less CPU cycles to that as opposed to cleaning up cached popups in the dragged component.  If you have a well-structured data model, assigning a new instance to view some portion of the model should be relatively simple.

                   

                  But first things first, if you place a brand new ComboBox or other component with a tooltip in an mx:Window, does its popup show up in the right place?  If not, we gotta figure that out.

                   

                   

                   

                  Alex Harui

                  Flex SDK Developer

                  Adobe Systems Inc.

                  Blog: http://blogs.adobe.com/aharui

                  • 6. Re: Popupmanager display issue in AIR
                    TrinityPlanet Level 1

                    Yes If we add a new combobox to mx:window its dropdown the popup shows up at the right place.

                    Again just link to the issue, If you add this combo to the main application it shows up correctly. The issue is only when you move it from

                    main application windowedapplication to windows.

                    Trying to figure out why it behaves so. Its seems this behaviour is  because of the popupmanger impl. when drawn dynamically.

                    • 7. Re: Popupmanager display issue in AIR
                      Flex harUI Adobe Employee

                      For a ComboBox, once it creates the dropdown, the dropdown is parented by, in this case, the main window.  Even when it goes away, it just becomes visible and remains parented by the main window and that's where it will show up again.  There are calls you can make that should cause the ComboBox to destroy the dropdown and create a new one, and theoretically it should create the new one in the right Window.  I see code in ComboBox that should have handled that, but maybe you're running an older version of Flex or that code path isn't getting hit somehow.  That's why we'd like to see the code you are using to re-parent the ComboBox.

                       

                      Alex Harui

                      Flex SDK Developer

                      Adobe Systems Inc.

                      Blog: http://blogs.adobe.com/aharui

                      • 8. Re: Popupmanager display issue in AIR
                        TrinityPlanet Level 1

                        Yes If we add a new combobox to mx:window its dropdown the popup shows up at the right place.

                        Again just link to the issue, If you add this combo to the main application it shows up correctly. The issue is only when you move it from

                        main application windowedapplication to windows.

                        Trying to figure out why it behaves so. Its seems this behaviour is  because of the popupmanger impl. when drawn dynamically.

                        • 9. Re: Popupmanager display issue in AIR
                          TrinityPlanet Level 1

                          I am using the latest Flex SDK 3.3 production release. Please let me know if there is any such call to destroy the

                          combo dropdown and recreate. I capture the drop event on the main app window and then add the event.currentTarget as

                          child to it using addChild API. I do not have the codebase with me right now I will mail it you once at work.

                          • 10. Re: Popupmanager display issue in AIR
                            Flex harUI Adobe Employee

                            In theory, if you call removeChild on the ComboBox, it should have it removedFromStageHandler method called and it should destroy the dropdown.  I'd set a breakpoint in the CombBox on destroyDropdown and see if it gets called.  Maybe if you are not calling removeChild and just call addChild we don't get the removedFromStage event.

                             

                            If you just setStyle with any style, even setStyle("Alex", "Harui") on the ComboBox it should also call the destroyDropdown method.  destroyDropdown is private so you have to get at it via some other means.

                             

                            Alex Harui

                            Flex SDK Developer

                            Adobe Systems Inc.

                            Blog: http://blogs.adobe.com/aharui

                            • 11. Re: Popupmanager display issue in AIR
                              TrinityPlanet Level 1

                              I will surely try this solution. Also I am not calling remove child.

                              Hope this resolves the issue.

                              Thanks alot

                              • 12. Re: Popupmanager display issue in AIR
                                TrinityPlanet Level 1

                                Please see below

                                • 13. Re: Popupmanager display issue in AIR
                                  TrinityPlanet Level 1

                                  Hi Alex,

                                   

                                  1) So this is what I did,  I removed the component from the parent window after adding it to the new mx:window, did not resolve the issue with tooltips and combo box.

                                  Also I captured the added event on combobox which was getting fired every time the combo is added or removed, on this event I invoked the setstyle method for the combo.Now the result is it does destroy the dropdown but then doesnot recreate it. So now I do not see the dropdown at all after clicking on it when it is in the mx:window.

                                  Please let me know If I am doing something wrong.

                                   

                                  2) There is another behaviour which is showing up particularly with combo boxes- I have posted a bug on Jira  - http://bugs.adobe.com/jira/browse/FB-18875

                                   

                                  Below I have some snippets of the code

                                  //This method is used to add components to the main app.

                                  private function addManagedPod(parentComponent:Object, childComponent:ISphericallComponent, width:int, height:int):Object
                                          {

                                              // Managed pod is a class extended from panel 
                                              var win:ManagedPod = new ManagedPod();   
                                                
                                                  win.title = childComponent.componentTitle;
                                                  win.name = Math.random().toString();
                                                  win.addEventListener(POPOUT, handlePopOut);
                                                  win.visible = childComponent.componentVisible;
                                                 
                                                  childComponent.componentState = MANAGED_STATE;
                                                  childComponent.parentObject = win;
                                                 
                                                  win.addChild(DisplayObject(childComponent));


                                                   //ParentComponent is a box which is added to the windowed application                     
                                                  parentComponent.addChild(win);
                                                  managedPodCollection.addItem(childComponent);
                                              }else{
                                                  //Set Focus
                                                  //UIComponent(childComponent.parentObject).setStyle("borderColor", "#3399FF");
                                              }
                                              return win;
                                          }

                                   

                                  ////Add floating pods to mainframe
                                          public function addFloatingPod(childComponent:ISphericallComponent, width:Number, height:Number):SphericallWindow
                                          {

                                            //Sphericall window is a extended from mx:window
                                              var floatingPodWin:SphericallWindow = new SphericallWindow();
                                              floatingPodWin.width = width;
                                              floatingPodWin.height = height;
                                              floatingPodWin.title = childComponent.componentTitle;
                                              floatingPodWin.visible = childComponent.componentVisible;
                                              childComponent.componentState = FLOATING_STATE;
                                              childComponent.parentObject = floatingPodWin;
                                              floatingPodWin.addChild(DisplayObject(childComponent));
                                             
                                              floatingPodWin.open();
                                              return floatingPodWin;
                                          }

                                   

                                  // This how a child component looks like

                                  <mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:local="com.necsphere.components.*"
                                      creationComplete="startup()">

                                            <mx:ComboBox id="stateComboBox" dataProvider="{choices}" width="50%" change="setPresence()"  />
                                     
                                               <controls:AutoComplete id="noteAutoComplete" width="50%" lookAhead="true"
                                           enter="setPresence()" borderThickness="0" keepLocalHistory="true" defaultText="notes..." localHistoryName="noteAutoCompleteData"/>
                                  </mx:HBox>

                                   

                                  OR

                                   

                                  <mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%"
                                      horizontalScrollPolicy="off" />

                                   

                                  <mx:VBox width="100%" height="100%" verticalGap="1">
                                          <!--<mx:Spacer height="5" />-->
                                          <mx:HBox width="100%" horizontalScrollPolicy="off" verticalScrollPolicy="off">
                                              <mx:Canvas width="100%" styleName="ToolbarContainer" horizontalScrollPolicy="off" verticalScrollPolicy="off">
                                               <mx:Form height="35" defaultButton="{go}" width="100%" styleName="Toolbar"
                                                  paddingLeft="2" paddingRight="2" paddingTop="6" paddingBottom="2" horizontalScrollPolicy="off" verticalScrollPolicy="off">
                                                  <mx:FormItem labelWidth="0" direction="horizontal" verticalCenter="true" width="100%" label="Search">
                                                      <mx:TextInput id="match" width="100" focusEnabled="true" />
                                                      <mx:Button id="go" width="25" icon="@Embed(source='images/iconMagnifier.png')" click="startSearch()"/>
                                                    
                                                      <mx:ComboBox width="125" id="cmbSort"  close="handleSortBy(event)" visible="{results.length > 0}"
                                                          dataProvider="{[{label:'Sort By..', data:''},{label:'First Name', data:'firstName'},{label:'Last Name',data:'lastName'}]}" />
                                                   </mx:FormItem>
                                              </mx:Form>
                                              </mx:Canvas>                          
                                          </mx:HBox>

                                  </mx:Canvas>

                                  • 14. Re: Popupmanager display issue in AIR
                                    Flex harUI Adobe Employee

                                    Hopefully you are removing the component BEFORE adding it the new mx:Window.  Other than that, I don't know why it isn't working.

                                     

                                    For the bug you filed, you will need to submit a simplified test case.  Doing so may help you diagnose your first problem as well.

                                     

                                    Alex Harui

                                    Flex SDK Developer

                                    Adobe Systems Inc.

                                    Blog: http://blogs.adobe.com/aharui

                                    • 15. Re: Popupmanager display issue in AIR
                                      TrinityPlanet Level 1

                                      I will make the change to  remove it before adding the component. I am not sure If I understand how should I add simplfy test case.

                                      Is there any way to accelerate the bug fixing issue or reach the QA team. As I do not see any response for now.

                                       

                                      Thanks

                                      • 16. Re: Popupmanager display issue in AIR
                                        Michael Borbor Level 4

                                        The Bug base is sorta a popularity contest so if you want a bug to be 

                                        fix, tell your friends, colleagues, and so on to vote 4 it.

                                         

                                        Sincerely,

                                         

                                        Michael

                                         

                                        El 23/04/2009, a las 13:20, TrinityPlanet <forums@adobe.com> escribió:

                                         

                                        >

                                        I will make the change to  remove it before adding the component. I 

                                        am not sure If I understand how should I add simplfy test case.

                                        Is there any way to accelerate the bug fixing issue or reach the QA 

                                        team. As I do not see any response for now.

                                        >

                                        Thanks

                                        >

                                        • 17. Re: Popupmanager display issue in AIR
                                          Flex harUI Adobe Employee

                                          QA periodically checks new bugs.  They don't do it daily and there is no guarantee that they'll look at it within a given amount of time.  It needs to have a valid test case and some votes.

                                           

                                          Your test case should be attached and be as simple as possible.  You'll see an option for attaching files in the Bug Report.

                                           

                                          Alex Harui

                                          Flex SDK Developer

                                          Adobe Systems Inc.

                                          Blog: http://blogs.adobe.com/aharui

                                          • 18. Re: Popupmanager display issue in AIR
                                            TrinityPlanet Level 1

                                            Thanks Alex, I will work over the test case.

                                            • 19. Re: Popupmanager display issue in AIR
                                              Flex harUI Adobe Employee

                                              I took a few minutes to put together a simple test case and it does not fail for me.

                                               

                                              <?xml version="1.0" encoding="utf-8"?>

                                              <mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="makeCombo()" >

                                                   <mx:Script>

                                                        <![CDATA[

                                                    

                                                        import mx.controls.ComboBox;

                                               

                                                        import mx.core.Window;

                                               

                                                        private var window:Window;

                                               

                                                        private function newWindow():void

                                                        {

                                                             window = new Window();

                                                             window.open();

                                                        }

                                                              

                                                        private var combo:ComboBox;

                                                                             

                                                        private function makeCombo():void

                                                        {

                                                             combo = new ComboBox();

                                                             combo.dataProvider = ["a", "b", "c"];

                                                             addChild(combo);     

                                                        }

                                               

                                                        private function reparent():void

                                                        {

                                                             removeChild(combo);

                                                             window.addChild(combo);

                                                        }

                                               

                                                        ]]>

                                                   </mx:Script>

                                               

                                                   <mx:Button label="new window" click="newWindow()" />

                                                   <mx:Button label="reparent" click="reparent()" />

                                                         

                                              </mx:WindowedApplication>

                                               

                                              Alex Harui

                                              Flex SDK Developer

                                              Adobe Systems Inc.

                                              Blog: http://blogs.adobe.com/aharui

                                              • 20. Re: Popupmanager display issue in AIR
                                                TrinityPlanet Level 1

                                                Hey Alex

                                                This is very helpfull testcase. Perhaps I should post a simple test case presenting the scenario on my end too.

                                                As I do not have combo as the direct child. But that should not make difference I guess. I will coming back with a simple test case.

                                                • 21. Re: Popupmanager display issue in AIR
                                                  TrinityPlanet Level 1

                                                  Hi Alex,

                                                  I have created a sample test case project and attached the files. Let me know what I am doing wrong.

                                                  • 22. Re: Popupmanager display issue in AIR
                                                    TrinityPlanet Level 1

                                                    I have been trying to attach the files, doesnt let me do . I have tried to  paste the code too.

                                                    Ok I will try putting the code one by one file. there are 3 small files

                                                    • 23. Re: Popupmanager display issue in AIR
                                                      TrinityPlanet Level 1

                                                      Hi Alex,

                                                      I have developed a sample testcase project please find attached the files.

                                                      let me know what is that I am doing wrong.

                                                      Thanks in advance

                                                       

                                                      Thanks & Regards

                                                      Vandana

                                                      • 24. Re: Popupmanager display issue in AIR
                                                        TrinityPlanet Level 1

                                                        Doesnot let me attach/paste the code. I have send files through email.

                                                        • 25. Re: Popupmanager display issue in AIR
                                                          Flex harUI Adobe Employee

                                                          I may not have time to look at your test case.  You should try my test case to verify if it works for you and compare the differences.

                                                           

                                                          Alex Harui

                                                          Flex SDK Developer

                                                          Adobe Systems Inc.

                                                          Blog: http://blogs.adobe.com/aharui

                                                          • 26. Re: Popupmanager display issue in AIR
                                                            TrinityPlanet Level 1

                                                            I went through your testcase. The difference I see is, If you add and remove directly it works.

                                                            But does not work -  if you have certain heirarchy of objects like if combo is added to another intermediate layout container .

                                                            • 27. Re: Popupmanager display issue in AIR
                                                              Flex harUI Adobe Employee

                                                              Can you add about 10 lines of code to my example and reproduce the problem?

                                                               

                                                              Alex Harui

                                                              Flex SDK Developer

                                                              Adobe Systems Inc.

                                                              Blog: http://blogs.adobe.com/aharui

                                                              • 28. Re: Popupmanager display issue in AIR
                                                                TrinityPlanet Level 1

                                                                sure I will do that

                                                                • 29. Re: Popupmanager display issue in AIR
                                                                  TrinityPlanet Level 1

                                                                  Hi Alex,

                                                                   

                                                                  I have modified your example to replicate the issue, below is the code. Please let me know whats going wrong.

                                                                  Thanks.

                                                                   

                                                                  <?xml version="1.0" encoding="utf-8"?>
                                                                  <mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="makeCombo()" >

                                                                   

                                                                       <mx:Script>

                                                                   

                                                                            <![CDATA[
                                                                            import mx.containers.Canvas;
                                                                            import mx.controls.ComboBox;
                                                                            import mx.core.Window;
                                                                            private var window:Window;
                                                                           
                                                                            private function newWindow():void
                                                                            {
                                                                                window = new Window();
                                                                              window.open();
                                                                            }
                                                                             
                                                                            private var combo:ComboBox;
                                                                            private var canvas:Canvas;  

                                                                   

                                                                            private function makeCombo():void
                                                                            {
                                                                              canvas = new Canvas();
                                                                              combo = new ComboBox();
                                                                              combo.dataProvider = ["a", "b", "c"];
                                                                              canvas.addChild(combo);
                                                                              divBox.addChild(canvas);   

                                                                   

                                                                            }
                                                                           private function reparent():void
                                                                            {
                                                                              divBox.removeChild(canvas);
                                                                              window.addChild(canvas);
                                                                            }

                                                                   

                                                                            ]]>

                                                                   

                                                                       </mx:Script>

                                                                   

                                                                       <mx:Button label="new window" click="newWindow()" />
                                                                       <mx:Button label="reparent" click="reparent()" />

                                                                   

                                                                       <mx:HBox id="mainHbox" width="100%" height="40%" >
                                                                           <mx:HDividedBox id="divBox" width="100%" height="100%" />
                                                                       </mx:HBox>   

                                                                   

                                                                  </mx:WindowedApplication>

                                                                  • 30. Re: Popupmanager display issue in AIR
                                                                    Flex harUI Adobe Employee

                                                                    Looks like children don't know when their parent is changed to a new window so they don't re-calculate which systemManager they are using.  I got around it in this case by doing this:

                                                                     

                                                                    private function reparent():void

                                                                              {

                                                                                divBox.removeChild(canvas);

                                                                                window.addChild(canvas);

                                                                                   combo.dispatchEvent(new Event(Event.REMOVED));

                                                                              }

                                                                     

                                                                    You'll have to do something similar for other things like tooltips.  I still think you should just generate new instances and have them reference the same data model.

                                                                     

                                                                    Alex Harui

                                                                    Flex SDK Developer

                                                                    Adobe Systems Inc.

                                                                    Blog: http://blogs.adobe.com/aharui

                                                                    • 31. Re: Popupmanager display issue in AIR
                                                                      TrinityPlanet Level 1

                                                                      Isn't this a bug?

                                                                      Creating new instances is huge amount of work, state management of all the objects seems a much complex task in the application

                                                                      I am working on. But if nothing works that the option. I hope there is some concerete solution for it though.

                                                                      posted a bug - http://bugs.adobe.com/jira/browse/FB-18996

                                                                       

                                                                      Hey Alex I appreciate your response. Thank you. Perhaps this is an issue with every popup, so is there any event that could let the popupmanager know

                                                                      that his parent has changed?

                                                                      • 32. Re: Popupmanager display issue in AIR
                                                                        Flex harUI Adobe Employee

                                                                        You are welcome to file a bug, but I doubt it will get fixed soon.  It would require that all children add listeners for parents being re-parented and that can slow things down.

                                                                         

                                                                        If you have a model-view architecture, which I recommend for many reasons, I don't understand why state management would be hard.

                                                                         

                                                                        Alex Harui

                                                                        Flex SDK Developer

                                                                        Adobe Systems Inc.

                                                                        Blog: http://blogs.adobe.com/aharui

                                                                        • 33. Re: Popupmanager display issue in AIR
                                                                          TrinityPlanet Level 1

                                                                          I agree with MVC architecture. State management with respect to view is the concern. There are views which as per event change their states.

                                                                          Creating new instance on popout will result into forcing certain  events.   

                                                                          • 34. Re: Popupmanager display issue in AIR
                                                                            Flex harUI Adobe Employee

                                                                            Hmm.  I would have thought it would be as simple as assigning the currentState of the old instance to the currentState of the new instance.

                                                                             

                                                                            Alex Harui

                                                                            Flex SDK Developer

                                                                            Adobe Systems Inc.

                                                                            Blog: http://blogs.adobe.com/aharui